JqGrid загрузка каждый раз при следующем нажатии на пейджинг

Question

Я привязываю данные в JqGrid при нажатии кнопки и успешно завершается. Но когда я нажимаю на следующий из pagging, вызов функции привязки данных снова и показывается та же страница i.e 1. Не перемещается на 2-ю страницу. Пожалуйста помоги мне с этим.

function SearchEmployee() { 
    alert('Button Clicked'); 
    $('#grid').jqGrid({ 
     datatype: function (postdata) { 
      var empId = $("#EmployeeId").val(); 
      var firstName = $("#F_Name").val(); 
      var lastName = $("#L_Name").val(); 

      var EmployeeDetailsModel = { 
       EmployeeId: empId, 
       F_Name: firstName, 
       L_Name: lastName 
      }; 
      $.ajax({ 
       url: "/Common/EmployeeSearchData/", 
       type: 'POST', 
       dataType: "json", 
       contentType: "application/json; charset=utf-8", 
       data: JSON.stringify({ objEmpModel: EmployeeDetailsModel }), 
       error: function (data, textStatus) { 
        alert('Error loading json'); 
       }, 
       success: function (jsondata, st) { 
        if (st == 'success') { 
         //alert('success'); 
         alert(JSON.stringify(jsondata)); 
         var thegrid = jQuery("#grid")[0]; 
         var data = JSON.stringify(jsondata); 
         thegrid.addJSONData(JSON.parse(data)); 
        } 
       } 
      }); 
     }, 
     colNames: ['HR ID', 'Employee Id', 'Full Name', 'Designation', 'Location Code'], 
     colModel: [ 
      { key: true, hidden: true, name: 'HRId', index: 'HRId', editable: false }, 
      { key: false, name: 'EmployeeId', index: 'EmployeeId', editable: false, width: 100 }, 
      { key: false, name: 'FullName', index: 'FullName', editable: false, width: 100 }, 
      { key: false, name: 'Designation', index: 'Designation', editable: false, width: 100 }, 
      { key: false, name: 'LocationCode', index: 'LocationCode', editable: false, width: 100 } 
     ], 
     pager: $('#pager'), 
     viewrecords: true, 
     loadonce: true, 
     rowNum: 10, 
     height: '100%', 
     width: '100%', 
     autowidth: true 
    }); 
} 

Answer 1

Я бы порекомендовал вам никогда не использовать datatype определяется как функция, если эти данные могут быть загружены с помощью jQuery.ajax.

Вы должны сделать следующее:

1. Обновление jqGrid до последней free jqGrid (4.12.1).
2. заменить datatype на datatype: "json"

Это лучше всего использовать следующий код внутри SearchEmployee функции

$("#grid").jqGrid("GridUnload"); 
$("#grid").jqGrid({ 
    datatype: "json", 
    url: "/Common/EmployeeSearchData/", 
    mtype: "POST", 
    ajaxGridOptions: { contentType: "application/json; charset=utf-8" }, 
    prmNames: { id: "HRId" }, // the name of id property 
    serializeGridData: function() { 
     return JSON.stringify({ 
        objEmpModel: { 
         EmployeeId: $("#EmployeeId").val(), 
         F_Name: $("#F_Name").val(), 
         L_Name: $("#L_Name").val() 
        } 
       }); 
    }, 
    colNames: ["Employee Id", "Full Name", "Designation", "Location Code"], 
    colModel: [ 
     { name: "EmployeeId" }, 
     { name: "FullName" }, 
     { name: "Designation" }, 
     { name: "LocationCode" } 
    ], 
    additionalProperties: ["HRId"], // include HRId in local data 
    cmTemplate: { width: 100 }, // optional if you want to remove autowidth:true option 
    pager: true, 
    rowNum: 10, 
    viewrecords: true, 
    loadonce: true, 
    forceClientSorting: true, 
    autowidth: true 
);