JS动态增加表格

一个完整的ajax,看返回后面的操作就好了

$("#selectLeaveBtn").click(function(){
       var parms = {};
       parms.selectLeaveFlag=$("#selectLeaveFlag").val();
       parms.selectLeaveType=$("#selectLeaveType").val();
       parms.selectLeaveDate=$("#selectLeaveDate").val();
        $.ajax({
            type: "POST",
            url: '${ctx}/parentController/parents/select',
            data:parms,
            success: function(data){
                var html = "";
                if(data!=null){
                    for( var i=0; i<data.length; i++ ){
                        var item = data[i];
                        html+="<tr>";
                        html+="    <td>"+item.startDateStr+"</td>";
                        html+="    <td>"+item.endDateStr+"</td>";
                        html+="    <td>"+item.flagStr+"</td>";
                        html+="    <td>"+item.content+"</td>";
                        html+="    <td>"+item.typeStr+"</td>";
                        html+="    <td>"+item.createDateStr+"</td>";
                        html+="</tr>";
                    }
                }
                $("#leavebody").html(html);
            }
        })
   })

动态的增加一个按钮,点击会有模态框

              success: function (result) {
                  if(result==false){
                      alert("")
                  }else{
                      var html = "";
                      for( var i=0; i<result.length; i++ ){
                          var item = result[i];                                        
                          html+="<tr>";
                          html+="<td style=text-align: center; width=30></td>";
                            html+="<td align=left>"+item.depart_name+"</td>";
                          html+="<td align=left>"+item.name+"</td>";
                          html+="<td align=center>"
                        html+="<a class='btn btn-default'  title='编辑' ata-toggle=tooltip data-placement=top data-toggle='modal' data-target='#myModal"+item.id+"'>"
                        html+="编辑</a>"
                        html+="<div class='modal' fade id='myModal"+item.id+"' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>"
                        html+="<div class='modal-dialog'>"
                        html+="<div class='modal-content'>"
                        html+="<div class='modal-body'>"
                        html+="学校:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type='text' value='"+item.depart_name+"' readonly='true' ></br>"
                        html+="角色名:<input id='roleName"+item.id+"' type='text' />"
                        html+="</div>"
                        html+="<div class='modal-footer'>"
                            html+="<button type='button' class='btn btn-default' data-dismiss='modal'> 取消</button>"
                            html+="<button type='button' onclick='editName("+item.id+")' class='btn btn-primary' >确定</button>"
                            html+="</div>"
                            html+="</div>"
                            html+="</div>"
                            html+="</div>"
                          html+="<a class='btn btn-default disUser_a' onclick='deleteRole("+item.id+")' title='删除' ata-toggle=tooltip data-placement=top >"
                          html+="删除</a>"
                          html+="</td>";
                          html+="</tr>";
                      }
                      $("#rolebody").html(html);
                  }
              }


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值