jquery easyui datagrid实现增加，修改，删除方法总结

2024-05-06 14:57:35

字体：大中小

来源：转载

供稿：网友

本文实例讲述了jquery easyui datagrid实现增加，修改，删除的方法。分享给大家供大家参考，具体如下：

页面:

<body>  <form id="form1" runat="server">  <table id="tt">  </table>  </form></body>

引用的JS:

<link rel="stylesheet" type="text/css" href="/script/themes/default/easyui.css" /><link rel="stylesheet" type="text/css" href="/script/themes/icon.css" /><script type="text/javascript" src="/script/jquery-1.4.2.min.js" </script><script type="text/javascript" src="/script/jquery.easyui.min.js" </script><script type="text/javascript" src="/script/locale/easyui-lang-zh_CN.js" mce_src="script/locale/easyui-lang-zh_CN.js"></script>

JS:

<script type="text/javascript"><!--    $(function(){      $('#tt').datagrid({        width:810,        height:400,        idField:'xsbh',        url:'studentHandler.ashx',        singleSelect:true,        columns:[[          {field:'xsbh',title:'编号',width:80},         {field:'UserName',title:'姓名',width:100},         {field:'Sex',title:'性别',width:30},         {field:'SchoolYear',title:'年份',width:50},         {field:'opt',title:'操作',width:100,align:'center',          formatter:function(value,rec,index){            var s = '<a href="#" mce_href="#" onclick="view(/''+ rec.xsbh + '/')">查看</a> ';            var e = '<a href="#" mce_href="#" onclick="edit(/''+ rec.xsbh + '/')">编辑</a> ';            var d = '<a href="#" mce_href="#" onclick="del(/''+ index +'/')">删除</a> ';            return s+e+d;          }         }        ]],        toolbar:[{          text:'增加',iconCls:'icon-add',handler:function(){            window.location.href='StuAdd.aspx';          }        },        {text:'导入',iconCls:'icon-add',handler:function(){          window.location.href='StuImport.aspx'          }        },        {text:'查找',iconCls:'icon-search'}        ],        pagination:true      });    })     function view(bh) //转到查看页面      {        window.location.href='StuView.aspx?id='+bh+'&page=stu';//       var row = $('#tt').datagrid('getSelected');//        if(row)//        {//         alert(row.xsbh);//        }      }     function edit(bh) //转到编辑页面     {        window.location.href='StuEdit.aspx?id='+bh;     }     function del(index){ //删除操作      $.messager.confirm('确认','确认删除?',function(row){        if(row){          var selectedRow = $('#tt').datagrid('getSelected'); //获取选中行          $.ajax({            url:'delHandler.ashx?id='+selectedRow.xsbh+'&type=stu',//加了个type，作用是以后不管什么删除，都可以转到这个ashx中处理            success:function(){alert('删除成功');}          });          $('#tt').datagrid('deleteRow',index);        }      })     }// --></script>

上一篇：怎么引入(调用)一个JS文件

下一篇：jquery分隔Url的param方法(推荐)

学习交流

硬盘分区如何设置准确的分区空间

硬盘分区如何设置准确的分区空间...

热门图片

猜你喜欢的新闻

猜你喜欢的关注