How to change value of id column in form editing

问题

I'm looking for a way to change the value of id column using form editing.

I tried code below: selected row, clicked in form edit button and changed anda and id. After pression submit button id column value is not changed in grid. How to change id column vaue also ?

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.11.4/themes/redmond/jquery-ui.css"/>
    <link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/free-jqgrid/4.8.0/css/ui.jqgrid.css"/>
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
    <script type="text/javascript" src="http://cdn.jsdelivr.net/free-jqgrid/4.8.0/js/i18n/grid.locale-en.js"></script>
    <script type="text/javascript">
        $.jgrid = $.jgrid || {};
        $.jgrid.no_legacy_api = true;
        $.jgrid.useJSON = true;
    </script>
<script src="http://rawgit.com/free-jqgrid/jqGrid/master/js/jquery.jqgrid.src.js"></script>
    <script type="text/javascript">
        $(function () {
            "use strict";
            var mydata = [ { name: 'name', id:'id'}
                ],
                $grid = $("#list");

            $grid.jqGrid({
                datatype: "local",
                data: mydata,
                colNames: ["Client", "Id"],
                colModel: [
                    { name: "name",  editable: true },
                    { name: "id", editable: true }
                ],
                iconSet: "fontAwesome",
                pager: "#pager",
                gridview: true,
                autoencode: true,
                ignoreCase: true,
                onSelectRow: function (rowid) {
                    var $self = $(this),
                        savedRow = $self.jqGrid("getGridParam", "savedRow");
                    if (savedRow.length > 0) {
                        $self.jqGrid("restoreRow", savedRow[0].id);
                    }
                    $self.jqGrid("editRow", rowid, {
                        keys: true
                    });
                }
            })

.jqGrid('navGrid', {}, {},
{
//           afterSubmit: function (response, postdata) {
//postdata.id='100';
//               return [true, '']; //, '100'];
// }
})
;

        });
    //]]>
    </script>
</head>
<body>
    <table id="list"><tr><td></td></tr></table>
    <div id="pager"></div>
</body>
</html>

回答1:

I can't test this, but I think that the usage of

afterSubmit: function (response, postdata) {
    postdata.id='100';
    return [true, '', '100'];
}

should work. I think that you can modify any even non-editable column in the way, but only in case of adding new row.

The only exception could be the id column because of the line (or the line of jqGrid 4.7).

To be sure that one don't have the case I modified the code of free jqGrid once more. You should try with the latest sources of free jqGrid

来源：https://stackoverflow.com/questions/29571905/how-to-change-value-of-id-column-in-form-editing

标签

jquery

jqgrid

free-jqgrid