如何重新填充使用java脚本动态生成的表格行

时间:2012-02-05 23:55:39

标签: codeigniter

我有一个输入表单,用于指定有关“志愿者”的信息。志愿者可以是一个人或一群人。在表单底部有一个复选框,当信息是关于一组人时,选中该复选框。当它被选中时,我使用jquery来显示一个有一个表(最初只有一行)的DIV,其中可以输入关于该组其他成员的信息。

用户可以单击图像来触发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> 

1 个答案:

答案 0 :(得分:0)

使用当前的实现,尝试通过隐藏输入传递成员总数

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

这样,您就知道提交的成员总数以及何时出现验证错误

<?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; ?>

*注意:我没有检查语法。仅作为一个例子...