javascript - How to transfer contents of one table to another in struts 2? -
i have 2 tables displaying 2 lists. jsp
<%@page contenttype="text/html;charset=utf-8"language="java"pageencoding="utf-8"%> <%@taglib prefix="s"uri="/struts-tags"%> <!doctype html public"-//w3c//dtd xhtml 1.0 transitional//en""http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>insert title here</title> </head> <body> <s:form name="tableform"method="post"> <th> <s:submit action="verify" key="add"></s:submit> </th> <table id="one"> <thead> <tr> <th ></th> <th> id</th> <th>name</th> <th>status</th> <th>type</th> <th>rollup type</th> <th>system</th> </tr> </thead> <tbody> <s:iterator value="formlist1"> <tr> <td><s:checkbox name="checked" fieldvalue="%{#attr.id}" theme="simple" ></s:checkbox> </td> <td><s:property value="id"/></td> <td><s:property value="name"/></td> <td><s:property value="status"/></td> <td><s:property value="type"/></td> <td><s:property value="rolluptype"/></td> <td><s:property value="unit"/></td> </tr> </s:iterator> </tbody> </table> <table id="two"> <thead> <tr> <th ></th> <th> id</th> <th>name</th> <th>status</th> <th>type</th> <th>rollup type</th> <th>system</th> </tr> </thead> <tbody> <s:iterator value="formlist2"> <tr> <td><s:checkbox name="checked" fieldvalue="%{#attr.id}" theme="simple" ></s:checkbox> </td> <td><s:property value="id"/></td> <td><s:property value="name"/></td> <td><s:property value="status"/></td> <td><s:property value="type"/></td> <td><s:property value="rolluptype"/></td> <td><s:property value="unit"/></td> </tr> </s:iterator> </tbody> </table> <s:a href="#" id="add">add >></s:a> <s:a href="#" id="remove"><< remove</s:a> </s:form > </body> </html>
here want move rows checked table 1 table 2 when click on add , move rows checked table 2 table 1 when click on remove. found similar example on link http://jsfiddle.net/akvtw/1/ not work out in jsp.
it helpful if can suggest me sample code implementing functionality using jquery/javascript.
i know possible implement functionality using s:optiontransferselect tag in struts 2?
you can jquery easily. jquery has "appendto" function type features.
$(document).ready(function(){ $('#add').on("click", function(){ $('#one tbody input:checked').parent().parent().appendto("#two tbody"); }); $('#remove').on("click", function(){ $('#two tbody input:checked').parent().parent().appendto("#one tbody"); }); });
i created demo link. can test it.
Comments
Post a Comment