Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/78.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Slickgrid-如何修改id值_Javascript_Jquery_Asp.net Mvc_Slickgrid - Fatal编程技术网

Javascript Slickgrid-如何修改id值

Javascript Slickgrid-如何修改id值,javascript,jquery,asp.net-mvc,slickgrid,Javascript,Jquery,Asp.net Mvc,Slickgrid,我刚刚开始使用Slickgrid(带有asp.NETMVC后端),作为一个简单的开始,我想将它作为一个编辑网格,用于系统设置的键/值对。我有它的工作正常添加,但更新工作正常,除非我们编辑的关键 因为我们已经更改了键值,所以它看起来总是像一个新的键/值对,而不是修改现有项。所以我的问题是,如何让后端知道我正在修改什么项目 我想我可以在dataview中添加一个额外的字段(保存原始id),但我想知道我是否缺少一些使这更容易的功能 $(function() { var grid; va

我刚刚开始使用Slickgrid(带有asp.NETMVC后端),作为一个简单的开始,我想将它作为一个编辑网格,用于系统设置的键/值对。我有它的工作正常添加,但更新工作正常,除非我们编辑的关键

因为我们已经更改了键值,所以它看起来总是像一个新的键/值对,而不是修改现有项。所以我的问题是,如何让后端知道我正在修改什么项目

我想我可以在dataview中添加一个额外的字段(保存原始id),但我想知道我是否缺少一些使这更容易的功能

$(function() {
    var grid;
    var columns = [{
        id: "id",
        name: "Name",
        field: "id",
        editor: Slick.Editors.Text
    }, {
        id: "Value",
        name: "Value",
        field: "Value",
        editor: Slick.Editors.Text
    }, ];

    var options = {
        enableColumnReorder: false,
        editable: true,
        enableAddRow: true,
        enableCellNavigation: true,
        autoEdit: false
    };

    var dataView = new Slick.Data.DataView();
    grid = new Slick.Grid("#myGrid", dataView, columns, options);

    grid.setSelectionModel(new Slick.CellSelectionModel());

    grid.onCellChange.subscribe(function(e, args) {
        var row = dataView.getItem(args.row);
        var value = row[grid.getColumns()[args.cell].field];
        var id = row[grid.getColumns()[0].field];

        var data = {
            value: value,
            id: id
        };
        var url = "@Url.Action("Update", "SystemSettings")";

        $.ajax({
            type: "POST",
            url: url,
            data: data,
            dataType: "json",
            success: function(a) {
                if (a.status != "ok") {
                    alert(a.msg);
                    undo();
                } else {
                    alert(a.msg);
                }
                return false;
            }
        });
    });

    grid.onAddNewRow.subscribe(function(e, args) {
        var item = {
            "id": dataView.length,
            "value": "New value"
        };
        $.extend(item, args.item);
        dataView.addItem(item);
    });

    dataView.onRowCountChanged.subscribe(function(e, args) {
        grid.updateRowCount();
        grid.render();
    });

    dataView.onRowsChanged.subscribe(function(e, args) {
        grid.invalidateRows(args.rows);
        grid.render();
    });

    $.getJSON('@Url.Action("GetAll", "SystemSettings")', function(data) {
        dataView.beginUpdate();
        dataView.setItems(data);
        dataView.endUpdate();
    });
});

我的需求是一个网格,允许用户能够在数据库表上执行所有基本CRUD函数。因此,我是朝着正确的方向走,还是应该做一些不同的事情。

因此,我想我还没有完全理解数据视图是如何与网格断开的。因此,我决定将key字段存储两次,一次作为(不可编辑的)Id字段,一次作为可编辑的name字段

一旦我意识到我可以检测到密钥字段的新旧版本:

    $(function () {
        var grid;
        var columns = [
            { id: "name", name: "Name", field: "name", editor: Slick.Editors.Text },
            { id: "value", name: "Value", field: "value", editor: Slick.Editors.Text },
        ];

        var options = {
            enableColumnReorder: false,
            editable: true,
            enableAddRow: true,
            enableCellNavigation: true,
            autoEdit: false
        };

        var dataView = new Slick.Data.DataView();
        grid = new Slick.Grid("#myGrid", dataView, columns, options);

        grid.setSelectionModel(new Slick.CellSelectionModel());

        grid.onCellChange.subscribe(function (e, args) {
            var row = dataView.getItem(args.row);
            var id = row["id"];
            var value = row["value"];
            var name = row["name"];

            var data = { value: value, id: id, name: name };
            var url = "@Url.Action("Update", "SystemSettings")";

            $.ajax({
                type: "POST",
                url: url,
                data: data,
                dataType: "json",
                success: function (a) {
                    if (a.status != "ok") {
                        alert(a.msg);
                        undo();
                    } else {
                        alert(a.msg);
                    }
                    return false;
                }
            });
        });

        grid.onAddNewRow.subscribe(function (e, args) {
            var item = { "id": args["name"], "value": "New value" };
            $.extend(item, args.item);
            dataView.addItem(item);
        });

        dataView.onRowCountChanged.subscribe(function (e, args) {
            grid.updateRowCount();
            grid.render();
        });

        dataView.onRowsChanged.subscribe(function (e, args) {
            grid.invalidateRows(args.rows);
            grid.render();
        });

        $.getJSON('@Url.Action("GetAll", "SystemSettings")', function (data) {
            dataView.beginUpdate();
            dataView.setItems(data);
            dataView.endUpdate();
        });
    });