zoukankan      html  css  js  c++  java
  • JqueryEasyUI datagrid editor

    Combobox:

    { field: 'FieldType', title: '@ViewBag.FieldType',  40, align: 'center',
                            editor: {//设置其为可编辑
                                type: 'combobox', //设置编辑格式
                                options: {
                                    valueField: 'id',
                                    textField: 'text',
                                    url: '@Url.Content("~/Domain/LoadFieldType")',
                                    //data: products,
                                    editable: false,
                                    required: true//设置编辑规则属性
                                }
                            },
                            formatter: function (data) {
                                var str = "";
                                if (data == '') {
                                    return str;
                                }
                                $.ajax({
                                    url: '@Url.Content("~/Domain/GetFieldTypeNameById")' + "?fieldId=" + data,
                                    type: "POST",
                                    async: false,
                                    dataType: 'text',
                                    success: function (msg) {
                                        str = msg;
                                    }
                                });
                                return str;
                            }
                        },

    Checkbox:

    { field: 'IsEnable', title: '@ViewBag.FieldEnable',  40, align: 'center',
                            //                        formatter: function (data) {
                            //                            switch (data) {
    
                            //                             }
                            //                        },
                            editor: {//设置其为可编辑
                                type: 'checkbox', //设置编辑格式
                                options: {
                                    on: 1,
                                    off: 0,
                                    required: true//设置编辑规则属性
                                }
                            }
                        },

     普通文本框:

    editor: 'text'

     例子:

            $(document).ready(
                function () {
                    LoadData(); //加载数据
                    PagerCheck(); //分页索引不能输入非数字
                }
            );
    
            var isEdit = false;
            function LoadData() {
                $('#tbList').datagrid({
                    url: '@Url.Content("~/Domain/LoadCustomField")' + "?domainId=" + '@(Model.DomainID)',
                     "auto",
                    fitColumns: true,
                    striped: true,
                    nowrap: false,
                    pagination: true,
                    pageSize: 20,
                    singleSelect: true,
                    idField: 'FieldId',
                    //            frozenColumns: [[{ field: 'radio',  30, formatter: function (value, row, index) {
                    //                return '<input type="radio" name="rd_action" />';
                    //            }
                    //            }]],
                    columns: [[
                        { field: 'FieldId', title: '@ViewBag.FieldId',  20, hidden: true },
                        { field: 'DomainId', title: '@ViewBag.FieldDomainId',  40, align: 'left', hidden: true },
                        { field: 'FieldName', title: '@ViewBag.FieldName',  40, align: 'left', editor: 'text' },
                        { field: 'CName', title: '@ViewBag.FieldCName',  40, align: 'left', editor: 'text' },
                        { field: 'EName', title: '@ViewBag.FieldEName',  40, align: 'left', editor: 'text' },
                        { field: 'FieldType', title: '@ViewBag.FieldType',  40, align: 'center',
                            editor: {//设置其为可编辑
                                type: 'combobox', //设置编辑格式
                                options: {
                                    valueField: 'id',
                                    textField: 'text',
                                    url: '@Url.Content("~/Domain/LoadFieldType")',
                                    //data: products,
                                    editable: false,
                                    required: true//设置编辑规则属性
                                }
                            },
                            formatter: function (data) {
                                var str = "";
                                if (data == '') {
                                    return str;
                                }
                                $.ajax({
                                    url: '@Url.Content("~/Domain/GetFieldTypeNameById")' + "?fieldId=" + data,
                                    type: "POST",
                                    async: false,
                                    dataType: 'text',
                                    success: function (msg) {
                                        str = msg;
                                    }
                                });
                                return str;
                            }
                        },
                        { field: 'IsEnable', title: '@ViewBag.FieldEnable',  40, align: 'center',
                            //                        formatter: function (data) {
                            //                            switch (data) {
    
                            //                             }
                            //                        },
                            editor: {//设置其为可编辑
                                type: 'checkbox', //设置编辑格式
                                options: {
                                    on: 1,
                                    off: 0,
                                    required: true//设置编辑规则属性
                                }
                            }
                        },
                        { field: 'Remark', title: '@ViewBag.FieldRemark',  120, align: 'left', editor: 'text' }
                    ]],
                    toolbar: [{
                        text: '@ViewBag.CustomFieldAdd',
                        iconCls: 'icon-add',
                        handler: adddata
                    },
                {
                    text: '@ViewBag.CustomFieldEdit',
                    iconCls: 'icon-edit',
                    handler: editdata
                },
                {
                    text: '@ViewBag.CustomFieldDelete',
                    iconCls: 'icon-add',
                    handler: deletedata
                },
                {
                    text: '@ViewBag.CustomFieldSave',
                    iconCls: 'icon-save',
                    handler: function () {
                        var rowData = $('#tbList').datagrid('getSelected');
                        var rowIndex = $('#tbList').datagrid('getRowIndex', rowData);
                        $("#tbList").datagrid('endEdit', rowIndex);
                        if (dataValidate(rowData)) {
                            //特殊自定义字段只能新增一次
                            if (rowData.FieldId == undefined && rowData.FieldType != 6) {
                                var url = '@Url.Content("~/Domain/ValidateCreate?domainId=")' + '@(Model.DomainID)' + "&fieldType=" + rowData.FieldType;
                                $.ajax({
                                    url: url,
                                    type: 'POST',
                                    async: false,
                                    success: function (msg) {
                                        if (msg == 'True') {
                                            saveEdit(rowIndex, rowData);
                                        }
                                        else {
                                            beginEdit(rowIndex);
                                            alert('@ViewBag.CustomFieldCreateTips');
                                        }
                                    }
                                });
                            }
                            else {
                                saveEdit(rowIndex, rowData);
                            }
                        }
                        else {
                            beginEdit(rowIndex);
                        }
                    }
                },
                 {
                     text: '@ViewBag.CustomFieldCancel',
                     iconCls: 'icon-cancel',
                     handler: cancelEdit
                 }],
                    onLoadSuccess: function (data) {
                        $(".datagrid-htable table tr td div span").css("text-align", "center");
                        if (data.rows.length == 0) {
                            $(".datagrid-view2 .datagrid-body").html("<div style='text-align:center; margin-top:0px; height:50px;'>" + Language_Domain_Index_NoDataMsg + "</div>");
                        }
                    },
                    onDblClickCell: function (rowIndex, field, value) {
                        if (!isEdit) beginEdit(rowIndex);
                    },
                    onClickRow: function (rowIndex, rowData) {
                        $('#tbList').datagrid('selectRow', rowIndex);
                        cancelEdit(rowIndex, rowData);
                    }
                    //                onAfterEdit: function (rowIndex, rowData, changes) {
                    //                alert("onAfterEdit");
                    //                 saveEdit(rowIndex, rowData);
                    //                  }
                }).datagrid('getPager').pagination({ displayMsg: "" });
            }
    
            function cancelEdit(row, data) {
                if (isEdit) {
                    $('#tbList').datagrid('rejectChanges');
                    isEdit = false;
                }
            }
            function beginEdit(row) {
                $('#tbList').datagrid('beginEdit', row);
                $('#tbList').datagrid('selectRow', row);
                isEdit = true;
            }
            function dataValidate(data) {
                var flag = true;
                //            alert(data.FieldName + ":" + DataLength(data.FieldName));
                //            alert(data.CName + ":" + DataLength(data.CName));
                //            alert(data.EName + ":" + DataLength(data.EName));
                //alert(data.Remark + ":" + DataLength($.trim(data.Remark)));
                if (data.FieldName == "") {
                    alert('"' + '@ViewBag.FieldName' + '"' + '@ViewBag.EmptyTips');
                    flag = false;
                    return flag;
                }
                 //数据库中存的字段类型是nvarchar,不能按区别中英文算长度
                if ($.trim(data.FieldName).lenght > 50) {
                    alert('"' + '@ViewBag.FieldName' + '"' + Language_Domain_AddDomain_CustomFieldLengthCheck);
                    flag = false;
                    return flag;
                }
                if (data.CName == "") {
                    alert('"' + '@ViewBag.FieldCName' + '"' + '@ViewBag.EmptyTips');
                    flag = false;
                    return flag;
                 }
                if (DataLength($.trim(data.CName)) > 50) {
                    alert('"' + '@ViewBag.FieldCName' + '"' + Language_Domain_AddDomain_CustomFieldLengthCheck);
                    flag = false;
                    return flag;
                }
                if (data.EName == "") {
                    alert('"' + '@ViewBag.FieldEName' + '"' + '@ViewBag.EmptyTips');
                    flag = false;
                    return flag;
                 }
                if (DataLength($.trim(data.EName)) > 50) {
                    alert('"' + '@ViewBag.FieldEName' + '"' + Language_Domain_AddDomain_CustomFieldLengthCheck);
                    flag = false;
                    return flag;
                }
                if (DataLength($.trim(data.Remark)) > 50) {
                    alert('"' + '@ViewBag.FieldRemark' + '"' + Language_Domain_AddDomain_CustomFieldLengthCheck);
                    flag = false;
                    return flag;
                }
                return flag;
    
            }
            function saveEdit(row, data) {
                if (!dataValidate(data)) {
                    return;
                }
                var url = '@Url.Content("~/Domain/EditCustomField?fieldId=")' + data.FieldId + "&domainId=" + '@(Model.DomainID)' + "&fieldName=" + encodeURIComponent($.trim(data.FieldName)) + '&cName=' + encodeURIComponent($.trim(data.CName)) + "&eName=" + encodeURIComponent($.trim(data.EName)) + "&fieldType=" + data.FieldType + "&isEnable=" + data.IsEnable + "&remark=" + encodeURIComponent($.trim(data.Remark));
                //            alert(data.IsEnable);
                //            alert(url);
                $.post(url, $("form").serialize(),
                    function (data, state) {
                        if (state == "success") { }
                    });
                //        $.ajax({
                //            url: url,
                //            type: 'POST',
                //            async: false,
                //            success: function (data) {
                //            },
                //            error: function (data) {
                //            }
                //        });
                isEdit = false;
                $('#tbList').datagrid('reload');
            }
            function adddata() {
                $('#tbList').datagrid('insertRow', { index: 0, row: {
                    FieldName: '',
                    CName: '',
                    EName: '',
                    FieldType: 6,
                    Enable: '',
                    Remark: ''
                }
                })
                beginEdit(0);
            }
    
            function editdata() {
                var row = $('#tbList').datagrid('getSelected');
                var rowIndex = $('#tbList').datagrid('getRowIndex', row);
                beginEdit(rowIndex);
    
            }
    
            function deletedata() {
                if (isEdit) {
                    alert('@ViewBag.CustomFieldEditTips');
                    return;
                }
                var row = $('#tbList').datagrid('getSelected');
                if (row != null) {
                    var isdel = window.confirm('@ViewBag.CustomFieldDeleteTips');
                    if (isdel) {
                        $.post('@Url.Content("~/Domain/DeleteCustomField?fieldId=")' + row.FieldId, $("form").serialize(),
                            function (data, state) {
                                if (state == "success") {
                                    $('#tbList').datagrid('reload');
                                }
                            });
                     }
    //                $.messager.confirm('@ViewBag.CustomFieldDeleteConfirm', '@ViewBag.CustomFieldDeleteTips', function (r) {
    //                    if (r) {
    //                        $.post('@Url.Content("~/Domain/DeleteCustomField?fieldId=")' + row.FieldId, $("form").serialize(),
    //                        function (data, state) {
    //                            if (state == "success") {
    //                                $('#tbList').datagrid('reload');
    //                            }
    //                        });
    //                    }
    //                });
                };
            }
            //分页索引不能输入非数字
            function PagerCheck() {
                $(".pagination-num").keydown(function (event) {
                    event = event || window.event;
                    if (event.keyCode == 13)
                        event.keyCode = 9;
                    if ((event.keyCode < 48 || event.keyCode > 57) && event.keyCode != 8 && event.keyCode != 46 && (event.keyCode < 96 || event.keyCode > 105)) {
                        event.preventDefault();
                        event.returnValue = false;
                    }
                });
    
            }

    阿里云: www.aliyun.com

    华赐软件: www.huacisoft.com

    C#开源社区: www.opencsharp.net

    清泓美肤苑: 清泓美肤苑

    bootstrap权限管理系统: Asp.Net Mvc3 bootstrap权限管理系统

  • 相关阅读:
    安装mysql到服务器的linux环境下
    Junit
    shell编程控制结构:expr、let、for、while、until、shift、if、case、break、continue、函数、select
    JavaScript组合继承的一点思考
    JavaScript-2.内置对象---简单脚本之弹出对话框显示当前时间 ---ShinePans
    Python之美[从菜鸟到高手]--2+2=5
    Flex中配置FusionCharts
    [WHY]Hello, Worktile~
    数据库学习之中的一个: 在 Oracle sql developer上执行SQL必知必会脚本
    Remove Nth Node From End of List
  • 原文地址:https://www.cnblogs.com/8090sns/p/3123879.html
Copyright © 2011-2022 走看看