EasyUI-Datagrid行内编辑

最新推荐文章于 2024-04-02 16:46:42 发布

一支支穿云箭

最新推荐文章于 2024-04-02 16:46:42 发布

阅读量7.2k

点赞数 1

分类专栏： JavaScript JavaScript从零开始

本文链接：https://blog.csdn.net/mengdonghui123456/article/details/51232796

版权

接上一篇，这次介绍easyUI的datagrid的行内编辑单元格的功能。

关于行内编辑，我之前写过一个demo 《jQuery：页面可编辑表格》，但是easyui 中早已经封装了行内单元格编辑的功能，我们在调用时只需要使用人家封装好的方法就行。这里就使用封装好的方法。

实现思路：

1.定义table 时写上监听单击事件的方法：onClickCell:onClickCell；

2.将需要编辑的<th>和<td>设置编辑的触发响应：editor:'text'。其中text只是它的一种类型，也可以写combox或设置它的数据类型等。

3.响应onclickcell和editor的方法，编写js文件（详细见代码）。

<head>
    @*引入的easyui的js和css*@
<script src="../../Content/jquery-easyui-1.3.2/jquery-1.8.0.min.js"></script>
<link href="../../Content/themes/base/minified/jquery-ui.min.css" rel="stylesheet" />
<script src="../../Content/jquery-easyui-1.3.2/jquery.easyui.min.js"></script>
&