How to select and position on inserted row after add in jqgrid?

Question

I have a jqgrid that works fine. However, I would like to select and position myself on the inserted row after I have added it. I want for inserted row to be properly sorted and placed inside jqgrid.

For now i only managed to select the inserted row, but it's not sorted correctly in the grid. Inserted row is displayed on the top of any page that I am currently on.

Here is the sample of my code, with create function which inserts a new row in jqgrid.

$(document).ready(function () {
        $('#jqgProducts').jqGrid({
            //url from wich data should be requested
            url: '@Url.Action("DynamicGridData")',


            //type of data
            datatype: 'json',
            mytype: 'POST',
            //url access method type
            //jsonReader:{repeatitems : false, id: "cSfPT"},
            //columns names
            colNames: ['Šifra pošte', 'Naziv pošte', 'Napomena'],
            //columns model
            colModel: [
                        { name: 'cSfPT', index: 'cSfPT', align: 'left', width: '100px', key: true, editable: true, search: true

                         },

                        { name: 'cNzPt', index: 'cNzPt', align: 'left', width: '200px', editable: true, edittype: 'text',
                             },

                        { name: 'cNapomena', index: 'cNapomena', align: 'left', width: '400px', 

                         editrules: { required: false} }
                      ],
            //pager for grid
            pager: '#jqgpProducts',
            //number of rows per page
            rowNum: 10,
            //initial sorting column
            sortname: 'cSfPT',
            //initial sorting direction
            sortorder: 'asc',
            //we want to display total records count
            viewrecords: true,
            //grid height
            height: '300px',
            width : 1000,
            rownumbers: true,
            //scroll: true,
            cellEdit:true,
            cellurl: 'Edit',


            loadComplete: function () {
                if (idToSelect) {
                $(this).jqGrid('setSelection', idToSelect);
                //$("#" + $.jgrid.jqID(idToSelect)).effect("highlight", {}, 3000);
                idToSelect = undefined;
                }
            }

 $('#jqgProducts').jqGrid('navGrid', '#jqgpProducts',
            { add: true,
              del: true,
              edit:true, 
              search: true

               },

{width: '450', url: '@Url.Action("Create")', closeAfterAdd: true, 

            closeAfterEdit: true,

            reloadAfterSubmit: false,

            afterSubmit: function (response) {
                return [true, '', response.responseText];
            },


            addedrow: "last", // add new row at the end of grid

             afterComplete: function (response, postdata) {

                var gridId = this.gbox.substr(6);

                $('#' + gridId).jqGrid('setSelection', postdata.id);
             },




            afterSubmit: function (response) {

            idToSelect = response.responseText;
            return [true, '', response.responseText];
            }

       };
      );
    });

I would appreciate any help.

Answer 1

Client side you can set:

sortname: 'yourSortingColum'
sortorder: 'asc' || sortorder:'desc'