SSH-------------easyui的编译功能(无后台，仅easyui)

最新推荐文章于 2020-06-02 19:50:48 发布

保温杯有枸杞

最新推荐文章于 2020-06-02 19:50:48 发布

阅读量99

点赞数

分类专栏： SSH

本文链接：https://blog.csdn.net/qq_32659773/article/details/106196594

版权

SSH 专栏收录该内容

76 篇文章 0 订阅

订阅专栏

工作单快速录入
1. datagrid的编辑功能

1. 1. 使用步骤
2. 第一步：添加列的一个editor属性，
3. 第二步：调用datagrid的beginEdit方法,就可以开启编辑状态

1. 1. 其它方法罗列
2. endEdit
3. beginEdit
4. insertRow
5. deleteRow
6. getRowIndex 返回指定行的索引号，该行的参数可以是一行记录或一个ID字段值。
7. getSelected 获取选中的行
8. 1. 结束编辑状态时触发：onAfterEdit

jsp:

<%--
  Created by IntelliJ IDEA.
  User: Dong
  Date: 2020/4/27
  Time: 16:11
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/js/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/js/themes/icon.css">
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.0.min.js"></script>

    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/locale/easyui-lang-zh_CN.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/js/ztree3.5/zTreeStyle.css" type="text/css">
    <script type="text/javascript"
            src="${pageContext.request.contextPath}/js/ztree3.5/jquery.ztree.all-3.5.js"></script>
</head>
<body>

    <script
    type = "text/javascript" >
        var columns=[[
            {field: 'id', title: '编号', width: 100,checkbox:true},
            {field: 'name', title: '名字', width: 100,editor:{
                    type:'text',
                    options:{}
                }
            },
            {field: 'age', title: '手机', width: 100, align: 'right',editor:{
                    type:'text',
                    options:{}
                }
            }
        ]];
        var toolbar=[{
            iconCls: 'icon-edit',
            text: 'Edit',
            handler: function () {
                $('#grid').datagrid('beginEdit',0);   //必须配置editor中的type和options才有效
            }
        }, '-', {
            iconCls: 'icon-help',
            text: '结束编辑-保存',
            handler: function () {
                $('#grid').datagrid('endEdit',0);
            }
        }, '-', {
            text: '删除',
            handler: function () {
                $('#grid').datagrid('deleteRow',0);
            }
        }, '-', {
            text: '增加',
            handler: function () {
                $('#grid').datagrid('insertRow',{
                    index:0,
                    row:{}
                });
                $('#grid').datagrid('beginEdit',0);
            }
        }];
        $(function () {
            $('#grid').datagrid({
                url: '${pageContext.request.contextPath}/demo/stafftest.json',
                singleSelect:true,
                columns: columns,
                toolbar:toolbar,
                pagination:true,//显示分页工具条
                pageSize:6,
                pageList:[3,6,9],
                onAfterEdit:function (index, row, changes) {    //监听事件
                    console.info('index：'+index+'----row:'+row);
                }
               


        });
        });
</script>



<table id="grid"  />
</body>
</html>

保温杯有枸杞

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
SSH-------------easyui的编译功能(无后台，仅easyui)

工作单快速录入 datagrid的编辑功能使用步骤第一步：添加列的一个editor属性，第二步：调用datagrid的beginEdit方法,就可以开启编辑状态其它方法罗列 endEdit beginEdit insertRow deleteRow getRowIndex 返回指定行的索引号，该行的参数可以是一行记录或一个ID字段值。 getSelected 获取选中的行结束编辑状态时触发：on..
复制链接

扫一扫