Jquery动态增加行和删除行并封装成list表单提交

动态增加表单jquery方法:

var i=0;
function addtr(){  
 $("#myTable").append("<tr><td><input id=\"sd\" type=\"checkbox\" name=\"ckb\" /> "+
 " </td><td><input type=\"text\" name=\"list["+i+"].companyName\" /></td><td><input type=\"text\" name=\"list["+i+"].orgNo\" /></td><td><input type=\"text\" name=\"list["+i+"].draftingCity\" /> "+
 " </td><td><input type=\"text\" name=\"list["+i+"].linkman\" /></td><td><input type=\"text\" name=\"list["+i+"].linkTel\"/></td>'</tr>");

i=i+1;
}


删除行的方法:

function delTr(ckb){
 //获取选中的复选框,然后循环遍历删除
 var ckbs=$("input[name="+ckb+"]:checked");
 if(ckbs.size()==0){
 alert("要删除指定行,需选中要删除的行!");
 return;
 }
  ckbs.each(function(){
  $(this).parent().parent().remove();
  });
 }
function allCheck(allCkb, items){
 $("#"+allCkb).click(function(){
 $('[name='+items+']:checkbox').attr("checked", this.checked );
 });
 }

$(function(){
 //全选
 allCheck("allCkb", "ckb");
 })
function del() {
 delTr('ckb');
}

后台将页面的list在action中进行封装    private List<Objec> list;    封装的对象,直接获取list中对象属性即可


  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
以下是使用jQuery动态创建每3个元素,并在每个元素上添加删除按钮的示例代码: HTML代码: ``` <div id="container"></div> ``` JavaScript代码: ```javascript // 定义一个数组,用于存储元素数据 var data = [ '元素1', '元素2', '元素3', '元素4', '元素5', '元素6', '元素7', '元素8', '元素9', ]; // 获取容器元素 var $container = $('#container'); // 遍历数据数组,创建元素并添加到容器中 $.each(data, function(index, value) { // 创建元素 var $item = $('<div class="item"></div>').text(value); // 创建删除按钮 var $deleteBtn = $('<button class="delete-btn">删除</button>'); // 绑定删除按钮的点击事件 $deleteBtn.on('click', function() { // 在数据数组中删除该元素的数据 data.splice(index, 1); // 在页面中删除该元素 $item.remove(); }); // 将删除按钮添加到元素中 $item.append($deleteBtn); // 将元素添加到容器中 $container.append($item); // 如果是每的第3个元素,添加一个clearfix元素 if ((index + 1) % 3 === 0) { $container.append('<div class="clearfix"></div>'); } }); ``` CSS代码: ```css .item { float: left; width: 30%; margin-right: 3%; margin-bottom: 20px; border: 1px solid #ccc; padding: 10px; box-sizing: border-box; } .delete-btn { margin-left: 10px; } ``` 在上面的代码中,我们首先定义了一个数组来存储元素的数据。然后,我们获取容器元素,并使用`$.each`函数遍历数据数组,创建每个元素并添加到容器中。在创建元素时,我们还创建了一个删除按钮,并将其添加到元素中。我们还绑定了删除按钮的点击事件,以便在点击按钮时从数据数组中删除该元素的数据,并从页面中删除该元素。最后,我们还添加了一些CSS样式来指定元素和删除按钮的样式。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值