2017-04-03 60 views
0

我想实现该复选框作为jQuery数据表中的列。当我选择记录时,那些人应该在相应的Action类中进行操作。我创建了一个隐藏的变量,并在同样的jQuery我分配值:在jQuery的所有记录Struts2复选框Datatable

HTML:

<s:iterator value="warehouseBean.pickReqList" status="matStat"> 
    <s:hidden name="warehouseBean.pickReqList[%{#matStat.index}].grade"></s:hidden> 
    <s:hidden name="warehouseBean.pickReqList[%{#matStat.index}].quantity"></s:hidden> 
    <s:hidden name="warehouseBean.pickReqList[%{#matStat.index}].action"></s:hidden> 
</s:iterator> 

<tbody><s:iterator value="warehouseBean.pickReqList" status="matStat"> 
    <tr> 
     <td><s:property value="grade" /></td> 
     <td><s:property value="quantity" /></td> 
     <td><s:select name="warehouseBean.pickReqList[%{#matStat.index}].pickQuantity" list="pickQuantity"></s:select></td> 
     <td><s:checkbox name="chkboxname" cssClass="checkbox pickIndivCheck"></s:checkbox></td> 
    </tr> 
    </s:iterator> 
</tbody> 

每当复选框被点击,则隐藏变量分配与价值。

的jQuery:

$('.pickIndivCheck').click(function(e){ 
    var index=$(this).closest('tr').index(); 
    $('#warehousePick_warehouseBean_pickReqList_'+index+'__action').val(e.target.checked); }); 

上面的代码完美地工作,如果我不排序或导航表中的不同页面。如果我选中数据表第一页上的复选框,则将检查的属性分配给动作变量,Action类中也会反映相同的内容。

如果我排序或分页,那么它不工作。在排除故障后,我发现jQuery代码正在获取点击复选框的索引并分配值。例如,如果对象中有20个元素,则加载到数据表的两个不同页面中。隐藏变量同样写入:

<input type="hidden" name="warehouseBean.pickReqList[0].grade" value="BR000-R" id="warehousePick_warehouseBean_pickReqList_0__grade"/> 
<input type="hidden" name="warehouseBean.pickReqList[0].quantity" value="1" id="warehousePick_warehouseBean_pickReqList_0__quantity"/> 
<input type="hidden" name="warehouseBean.pickReqList[0].action" value="false" id="warehousePick_warehouseBean_pickReqList_0__action"/> 

<input type="hidden" name="warehouseBean.pickReqList[1].grade" value="BR001-R" id="warehousePick_warehouseBean_pickReqList_1__grade"/> 
<input type="hidden" name="warehouseBean.pickReqList[1].quantity" value="1" id="warehousePick_warehouseBean_pickReqList_1__quantity"/> 
<input type="hidden" name="warehouseBean.pickReqList[1].action" value="false" id="warehousePick_warehouseBean_pickReqList_1__action"/> 

<input type="hidden" name="warehouseBean.pickReqList[2].grade" value="BR002-R" id="warehousePick_warehouseBean_pickReqList_2__grade"/> 
<input type="hidden" name="warehouseBean.pickReqList[2].quantity" value="1" id="warehousePick_warehouseBean_pickReqList_2__quantity"/> 
<input type="hidden" name="warehouseBean.pickReqList[2].action" value="false" id="warehousePick_warehouseBean_pickReqList_2__action"/> ......... 

<input type="hidden" name="warehouseBean.pickReqList[18].grade" value="BR0018-R" id="warehousePick_warehouseBean_pickReqList_18__grade"/> 
<input type="hidden" name="warehouseBean.pickReqList[18].quantity" value="1" id="warehousePick_warehouseBean_pickReqList_18__quantity"/> 
<input type="hidden" name="warehouseBean.pickReqList[18].action" value="false" id="warehousePick_warehouseBean_pickReqList_18__action"/> 

<input type="hidden" name="warehouseBean.pickReqList[19].grade" value="BR0019-R" id="warehousePick_warehouseBean_pickReqList_19__grade"/> 
<input type="hidden" name="warehouseBean.pickReqList[19].quantity" value="1" id="warehousePick_warehouseBean_pickReqList_19__quantity"/> 
<input type="hidden" name="warehouseBean.pickReqList[19].action" value="false" id="warehousePick_warehouseBean_pickReqList_19__action"/> 

这也是它在数据表中出现的方式。如果我对表格进行排序,则最后的记录出现在表格的第一页。如果我选择第二记录,jQuery的方法获取当前索引(其1)被分配到隐藏变量

warehousePick_warehouseBean_pickReqList_1__action

而实际变量应该是

warehousePick_warehouseBean_pickReqList_18__action

da的索引可变记录与隐藏对象的索引不同。你可以让我知道如何将值分配给不同表中的行的复选框吗?

回答

0

我创建了一个虚拟变量温度然后同样

<tr> 
    <td><s:property value="grade" /></td> 
    <td><s:property value="quantity" /></td> 
    <td><s:select name="warehouseBean.pickReqList[%{#matStat.index}].pickQuantity" list="pickQuantity"></s:select></td> 
    <td><s:checkbox name="warehouseBean.pickReqList[%{#matStat.index}].temp" cssClass="checkbox pickIndivCheck"></s:checkbox></td> 
</tr> 

更改jQuery来获得的复选框的id(其被点击)改变HTML,提取从该ID的索引,然后分配在使用该索引创建变量之后将相应的隐藏变量分配给相应的隐藏变量:

$('.pickIndivCheck').click(function(e){ 
    var clId=this.id; 
    var temp=clId.substring(40); 
    var n=temp.lastIndexOf('_'); 
    var index=temp.substring(0,n-1); 
    $('#warehousePick_warehouseBean_pickReqList_'+index+'__action').val(e.target.checked); });