SSM中Ajax实现异步刷新,实现添加功能无刷新绑值。

 //获取表单的值,并进行序列化,将序列化的值传入controller。
		      var cc=$("#add_menber_style").serialize();
              $.ajax({
                  type :"POST",
                  url : "/adduser",
                  data:cc,
                  dataType:"json",
                  success:function(data){
                     //获取tbody标签的id。
                      var tbody =$('#tbody');
                     //html 用于拼接数据
                     var html="";
                     html+=" <tr>\n" +
                         "                      <td><label>\n" +
                         "                          <input type=\"checkbox\" class=\"ace\">\n" +
                         "                          <span class=\"lbl\"></span></label></td>\n" +
                         "                      <td>"+data.username+"</td>\n" +
                         "                      <td>"+data.name+"</td>\n" +
                         "                      <td>"+data.age+"</td>\n" +
                         "                      <td>"+data.tel+"</td>\n" +
                         "                      <td>"+data.qq+"</td>\n";
                             if(data.dept==1){
                                 html+="                      <td>"+"部门1"+"</td>\n";
                             }if(data.dept==2){
                                 html+="                      <td>"+"部门2"+"</td>\n";
                             }if(data.dept==3){
                                 html+="                      <td>"+"部门3"+"</td>\n";
                            }
                                 html+="                      <td>"+data.role_id+"</td>\n";
                                 html+="                      <td>"+data.add_time+"</td>\n";
                              if(data.state==1){
                                  html+="<td class=\"td-status\"><span class=\"label label-success radius\">正常</span></td>\n" +
                               "                      <td class=\"td-manage\"><a onClick=\"member_stop(this,'10001')\"  href=\"javascript:;\" title=\"停用\"  class=\"btn btn-xs btn-success\"><i class=\"icon-ok bigger-120\"></i></a> <a title=\"编辑\" onclick=\"member_edit('550')\" href=\"javascript:;\"  class=\"btn btn-xs btn-info\" ><i class=\"icon-edit bigger-120\"></i></a> <a title=\"删除\" href=\"javascript:;\"  onclick=\"member_del(this,'1')\" class=\"btn btn-xs btn-warning\" ><i class=\"icon-trash  bigger-120\"></i></a></td>";
                              }else{
                                html+="        <td class=\"td-status\"><span class=\"label label-defaunt radius\">停用</span></td>\n" +
                                  "                      <td class=\"td-manage\"><a onClick=\"member_start(this,'100')\"  href=\"javascript:;\" title=\"起用\"  class=\"btn btn-xs btn-success\"><i class=\"icon-ok bigger-120\"></i></a> <a title=\"编辑\" onclick=\"member_edit('550')\" href=\"javascript:;\"  class=\"btn btn-xs btn-info\" ><i class=\"icon-edit bigger-120\"></i></a> <a title=\"删除\" href=\"javascript:;\"  onclick=\"member_del(this,'1')\" class=\"btn btn-xs btn-warning\" ><i class=\"icon-trash  bigger-120\"></i></a></td>";
                              }
                              //将拼接好的数据,追加到数据的第一行。
                               tbody.prepend(html);
                      layer.alert('添加成功!',{
                          title: '提示框',
                          icon:1,
                      });
                      layer.close(index);
                  }
              });

猜你喜欢

转载自blog.csdn.net/weixin_43127338/article/details/83930945