2012-02-05 59 views
0

我有一個用於指定關於「志願者」信息的輸入表單。志願者可以是一個人或一羣人。在表單底部有一個複選框,當信息是關於一組人的時候選中的。當它被選中時,我使用jquery來顯示一個有表(最初只有1行)的DIV,其中可以輸入關於組中其他成員的信息。如何重新填充使用java腳本動態生成的表格行

用戶可以單擊圖像來觸發jquery腳本函數,該函數將動態添加一行到表中。

我的問題是,我不知道如何重新填充行中的值,如果窗體由於驗證錯誤而必須重新顯示。由於我使用腳本生成HTML,所以我無法放入PHP代碼,因爲它在頁面加載時被解釋。

也許有一個更好的方法來做這件事(我願意接受建議),但這是我現在擁有的。

在此先感謝您的幫助。

這裏的jQuery腳本添加新行:

function addMember() { 
    var $counter = parseInt($("#rowCounter").val()); 
    if ($counter > 1) { 
    var $firstName = "#firstName"+$counter; 
    var $lastName = "#lastName"+$counter; 
    var $email = "#email"+$counter; 
    if ($($firstName).val() == "" && $($lastName).val() == "" && $($email).val() == "") { 
     alert("You must fill out member row before adding another!"); 
     return false; 
    } 
    } 
    $memberRowNum = $counter; 
    $counter+=1; 
    var $appendVal = '<tr><td>'+$memberRowNum+'<input type="hidden" name="volID'+$counter+'" id="volID'+$counter+'"></td>'; 
    $appendVal += '<td><input type="text" name="firstName~~" id="firstName~~" size="15" ></td>'; 
    $appendVal += '<td><input type="text" name="lastName~~" id="lastName~~" size="20" ></td>'; 
    $appendVal += '<td><input type="text" name="email~~" id="email~~" size="25" ></td>'; 
    $appendVal += '<td align="center"><input type="checkbox" name="student_~~" id="student_~~" /></td>'; 
    $appendVal += '<td><select name="grade_~~" id="grade_~~"><option value=""></option><option value="13">College</option></option><option value="12">12th</option><option value="11">11th</option><option value="10">10th</option><option value="9">9th</option><option value="8">8th</option><option value="7">7th</option><option value="6">6th</option><option value="5">5th</option><option value="4">4th</option><option value="3">3rd</option></select></td>'; 
    $appendVal += '</tr>'; 
    $appendVal = $appendVal.replace(/~~/g,$counter); 
    $appendVal = $appendVal.replace(/@@/g,"?"); 
    $(".groupMembers > tbody:last").append($appendVal); 
    $("#rowCounter").val($counter); 
} 

這裏的HTML/PHP代碼段後,該行(一個或多個)附加:

<li><label>Are you registering as Group?</label><?php echo form_checkbox($asGroup);?> 
<span id="handleGroupInfo"> 
<br>Group Name:<?php echo form_input($groupName);?> 
<br><br>List names and emails of all group members below. Click plus sign to add more members to group<br> 
<table class="groupMembers"> 
<tbody> 
<th>&nbsp;&nbsp;<img id="add_row" alt="Add Group Member" src="<?php echo base_url();?>assets/images/green-plus-sign-tiny.png" />&nbsp;&nbsp;</th> 
<th>First Name</th> 
<th>Last Name</th> 
<th>email</th> 
<th>Student?</th> 
<th>Grade</th> 
</tbody> 
</table> 
</span> 
</li> 
</ul> 

回答

0

以您目前的實現,嘗試通過隱藏輸入傳遞成員總數

<input type="hidden" name="total_member" value="<?= $this->input->post('total_member'); ?>" /> 

這樣,你就知道了tot提交的成員數量以及何時出現驗證錯誤時,

<?php if(validation_errors()): ?> 
    <?php for($i = 0; $i < $this->input->post('total_member'); $i++): ?> 
    // For example... 
    <td><input type="text" name="firstName<?= $i; ?>" id="firstName<?= $i; ?>" value="<?= $this->input->post('firstName' . $i); ?>" size="15" ></td> 
    // And so no... 
    <?php endfor; ?> 
<?php endif; ?> 

*注意:我沒有檢查語法。只是作爲一個例子...

+0

這是我最終做的。我希望有一個「更乾淨」的方式來做到這一點,但這是有效的。謝謝 – IMZvonko 2012-02-11 02:16:18