笔者最近在做一个项目的后台,用到了EasyUI的datagrid控件,并开启了行内编辑功能,实际上也就是使用了edatagird这个空间,引用了edatagrid.js,一切似乎都做的顺风顺水,添加数据、修改数据都没有问题,然而到删除数据的时候居然没有反应,折腾了好几天也没有任何进展。截图如下:

前台代码如下:

<table id="lsdg" title="设备数据采集列表"  singleSelect="true" 
        rownumbers="true" fitColumns="true" toolbar="#toolbar" pagination="true" idField="user_id">
    <thead> 
        <tr>
       
           <th field="user_id" width="50px" hidden>ID</th>
           <th field="username" width="50px" editor="{type:'validatebox',options:{required:true}}">用户名</th>
           <th field="password" width="50px" editor="{type:'validatebox',options:{required:true}}">密码</th>

……

<table>

初始化数据表格如下:

<script type="text/javascript">
 $('#lsdg').edatagrid({ 
     url:'getUsers',
     saveUrl:'save',
     updateUrl:'update',
     destroyUrl:'destroy'
     });
</script>

使用起来还是很方便的后台是用PHP做的,通过接收提交的数据主键来完成相关操作,比如保存的时候接收user_id作为查询数据表的条件,然后对相应数据进行修改

$userid=$_POST['user_id']

其他操作也是如此,但是当做到删除的时候这样接收数据删除操作却怎么也没有效果,折腾了半天,然后不得有看了一下edatagrid.js的源代码(一般看源代码有抵触心理),然后茅塞顿开,终于找到了原因,原来在edatagrid.js里删除函数POST的参数名称是固定的——‘id’,代码如下

function _del(row){
     var index = dg.datagrid('getRowIndex', row);
     if (index == -1){return}
     if (row.isNewRecord){
      dg.datagrid('cancelEdit', index);
     } else {
      if (opts.destroyUrl){
       var idValue = row[opts.idField||'id'];
       $.post(opts.destroyUrl, {id:idValue}, function(data){

……

后台接收的时候一定要接收id参数,而不是前面说的数据表的主键 user_id,将

$userid=$_POST['user_id']

改为

$userid=$_POST['id']

后,删除就顺利完成了,注意只操作只针对后台删除函数即destory(),而其他操作无须这么处理,接收表的主键就可以了。好了,困扰的问题终于解决了,如果你遇到了类似的问题,希望我的文章可以帮助你,另外,如果引用某个插件不顺利的话,看看它的源代码还是有必要的,特别对于哪些没有说明书的插件

from:顶求网

解决EasyUI DataGrid删除行失败的方法的更多相关文章

  1. 解决easyui datagrid加载数据时,checkbox列没有根据checkbox的值来确定是否选中

    背景:   昨天帮朋友做一个easyui datagrid的小实例时,才发现easyui datagrid的checkbox列,没有根据值为true或false来选中checkbox,当时感觉太让人失 ...

  2. easyui datagrid中 多表头方法总结

    easyui datagrid中怎么设置表头成多行显示呢?其实很简单,就是给datagrid的columns属性设置成多个数组就行了.下面直接看例子吧,这是一个两行表头的,按照此方法,还可以设置三行表 ...

  3. 解决easyui datagrid load时缓存问题

    修改easyui datagrid内容保存后,使用$("#dg").datagrid("reload");或者$("#dg").datagr ...

  4. easyui datagrid 取消删除的方法

    下面为取消方法 ... { field: 'Guid', title: '操作', width: 80, align: 'center', formatter: function (value, ro ...

  5. 解决anaconda安装cvxpy失败的方法

    在Windows下安装凸优化包CVXPY 直接在anaconda prompt中输入pip install cvxpy经常会出现安装失败的情况,使用以下方法,亲测成功! 1. 下载所需的whl文件,请 ...

  6. 解决Genymotion下载设备失败的方法(Connection Timeout)

    一直下载不下来,报错. 解决办法: 打开 C:\Users\用户名\AppData\Local\Genymobile目录 打开genymotion.log文件,在里面最下面几行,找到如下日志 [Deb ...

  7. easyui datagrid deleteRow(删除行)的BUG!

    转自:http://my.oschina.net/fants/blog/77189项目中又用到easyui 的datagrid做数据展示.功能很强大,很实用,但bug也很多.今天这个就够让人头疼. 如 ...

  8. easyui datagrid行合并

    easyui datagrid行合并 合并方法 /** * EasyUI DataGrid根据字段动态合并单元格 * 参数 tableID 要合并table的id * 参数 colList 要合并的列 ...

  9. easyui datagrid 没数据时显示滚动条的解决方法

    今天解决了一个bug,因为datagrid有多列,可是当没有数据的时候,后面的列无法通过滚动条拉动来显示,比较麻烦,而需求要求没有数据也要拉动滚动条查看后面有什么列,一开始在网上找了一些资料,发现都不 ...

随机推荐

  1. 01_常用 Linux 命令的基本使用

    01. 学习 Linux 终端命令的原因 Linux 刚面世时并没有图形界面,所有的操作全靠命令完成,如 磁盘操作.文件存取.目录操作.进程管理.文件权限 设定等 在职场中,大量的 服务器维护工作 都 ...

  2. sql server 语句获取表的描述,主键等等

    sql语句添加表,字段的描述 --添加表的描述 --格式如右:execute sp_addextendedproperty 'MS_Description','字段备注信息','user','dbo' ...

  3. A Year in Computer Vision

    A Year in Computer Vision http://themtank.org/

  4. Vue nodejs商城项目-商品列表页面组件

    data(){        return {            goodsList:[], // 商品列表            priceFilter:[ // 价格区间数组          ...

  5. center os 文件读写权限

    五.使用chmod和数字改变文件或目录的访问权限文件和目录的权限表示,是用rwx这三个字符来代表所有者.用户组和其他用户的权限.有时候,字符似乎过于麻烦,因此还有另外一种方法是以数字来表示权限,而且仅 ...

  6. vue入门: 实现选中并显示修改功能

    1.实现功能 2.工具 vue 3.代码 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  7. ES6 语法学习总结

    第一节:什么是ES6?   ES6是什么?跟JavaScript有什么关系? JavaScrip由三部分组成:分别是ECMAScript,BOM和DOM. 1)由此看出,ECMAScript是Java ...

  8. Java Iterator ListIterator 理解

    一. Iterator 常用操作 next hasNext remove 先上源码:JDK8 简化版本,用于说明问题 private class Itr implements Iterator< ...

  9. 【原创】展开二层嵌套列表(或pd.Series)的几种方法效率对比

    转载请注明出处:https://www.cnblogs.com/oceanicstar/p/10248763.html ★二层嵌套列表(或以列表为元素的pd.Series)有以下几种展开方式 (1)列 ...

  10. visio studio code 用chrom启动打开本地html

    { // 使用 IntelliSense 了解相关属性. // 悬停以查看现有属性的描述. // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linki ...