JQgridの追加時のソート方法について

Question

Jqgridでデータの入力をさせています。追加、編集、削除は正常に行われるのですが
追加時にデータをソート（id順）してくれません。 ヘッダーの上下ではソートは
できるのですが、なんとか追加時に自動でソートさせたいのです。

$("#grid01").jqGrid({
    data: dt1,
    editurl: 'clientArray',
    datatype: "local",
    colNames: ['id','日付', '工事区分', '料金種別', '数量', '施工業者', '班数'],
    colModel: [
        { name: 'id', index: 'id', width: 55, editable: false, frozen: true, sorttype: 'text', sortable: true, key: true },
        /* 日付 */
        {
            index: 'Hiduke', name: 'Hiduke', width: '70px', align: 'left', editable: true,
            sortable: true,
            //dateFormat: 'Y/m/d',
            formatter: 'date',

            formatoptions: {
                //srcformat: 'ISO8601Long',
                newformat: 'Y/m/d'

            },
            edittype: 'text',
            editoptions: {
                size: 12,
                maxlengh: 12,
                dataInit: function (element) {
                    $(element).datepicker({
                        dateFormat: "yy/m/d",
                        numberOfMonths: 3,     // 3ヶ月分表示
                        showCurrentAtPos: 1,   // 表示位置は左から2番目 (真ん中)
                        stepMonths: 3,         // 月の移動を3ヶ月単位とする
                        showButtonPanel: true, // ボタン領域を表示
                        gotoCurrent: true      // ボタン領域に「今日」ボタンを表示
                    })
                }
            },
            editrules: {
                /*required: true, date: true*/
                date: true
            },
        },
        /* 工事区分 */
        {
            index: 'Gua_Kouji_KubunId', name: 'Gua_Kouji_KubunId', width: '200px', align: 'center', editable: true,
            edittype: "select", // edittype を select とする
            formatter: "select",
            editoptions: { value: kouji_kubun_m },
            sortable: false
        },

        /* 料金種別 */
        {
            index: 'Gua_RyoukinId', name: 'Gua_RyoukinId', width: '150px', align: 'center', editable: true,
            edittype: "select", // edittype を select とする
            formatter: "select",
            editoptions: { value: ryoukin_m },
            sortable: false
        },

        /* 数量 */
        { name: 'Suryou', index: 'Suryou', width: 50,  editable: true },


        /* 施工業者 */
        {
            index: 'Gua_SekousyaId', name: 'Gua_SekousyaId', width: '150px', align: 'center', editable: true,
            edittype: "select", // edittype を select とする
            formatter: "select",
            editoptions: { value: sekousya_m },
            sortable: false
        },

        /* 班数 */
        { name: 'Hansu', index: 'Hansu', width: 50,  editable: true }
    ],
    cellEdit: false,               // false: セルの直接編集はしない
    autoencode: true,             // true: データをエンコード
    rowNum: 10,
    loadonce: true,
    rowList: [10, 20, 30],
    pager: '#pager1',
    cellsubmit: 'clientArray',
    sortname: 'id',
    viewrecords: true,
    sorttable: true,
    sortorder: "asc",
    caption: "",
    shrinkToFit: false,
    height: 300,
    width: 800,
    navOptions: {
        edit: false,
        add: false,
        del: false,
        refresh: false,
        search: false,
    },
    beforeEditCell: function (rowid, cellname, value, iRow, iCol) {
        // クリックされたセルを記録
        savedRow = iRow;
        savedCol = iCol;
    },
});
$("#grid01").jqGrid('navGrid', '#pager1', { edit: true, add: true, del: true });
//列を非表示にする
//$('#grid01').jqGrid('hideCol', 'sdate');
$("#grid01").jqGrid('setFrozenColumns');  //固定列表示にする

Answer 1

自己解決しました。'navGrid'を追加した後に｛｝でそれぞれの処理が記述できます。

$("#grid01").jqGrid('navGrid', '#pager1',
{ edit: true, add: true, del: true },
{
closeAfterEdit: true//編集後閉じる　ここがedit
},
{ //以下の分がadd
reloadAfterSubmit: false,
afterComplete: function (response, postdata, formid) {
// 追加が完了した時のイベント処理
$('#grid01').trigger('reloadGrid');
}
},
addはreloadAfterSubmit: falseとafterComplete: function で
書き込み後理ロードを行いidでソートした結果で表示されました。

とりあえず上記の方法で解決しました。 {}