的jqGrid - 如何追蹤本地操作

Question

我收到的分配創建2個應用程序，一個優化的和未優化的一個和我使用的jqGrid免費顯示從數據庫中的數據的速度。

我已經成功地創建了兩個，但我想跟蹤在女巫的地方操作完成的速度（分頁，搜索，排序）。

我試圖設置觸發操作的每個按鈕的事件，但他們似乎沒有觸發......我想知道是否有更好的東西是內置到jqGrid，我可以使用或建議，會幫我解決這個問題。

我jqGrid的代碼是這樣的：

$(function() { 
    var colModelSettings = [ 
     {name:'id', label:'id',key: true, hidden: true, width:10,sorttype:'number',editable: true},  
     {name:'judet',label:'Judet',width:70, align: 'center',editable:true}, 
     {name:'localitate',label:'Localitate',width:80,editable:true,searchoptions: {sopt: ['eq','bw','ew','cn']},align: 'center'}, 
     {name:'tipStrada',label:'tipStrada',editable:true,searchoptions: {sopt: ['eq','bw','ew','cn']},width:100,align: 'center' }, 
     {name:'denumire',label:'denumire',editable:true,width:100,searchoptions: {sopt: ['eq','bw','ew','cn']},align: 'center'}, 
     {name:'cod',label:'cod',width:90,editable:true,align: 'center'} 
     ]; 
    var beforeEvent = 0;  
    $("#gridAdrese").jqGrid({ 
     pager: $("#pagerGrid"), 
     url: "/UnoptimizedProject/rest/fetchData", 
     datatype: "json", 
     mtype: "POST", 
     loadonce: true, 
     forceClientSorting:true, 
     height: window.innerHeight-250, 
     sortname: 'id', 
     ajaxGridOptions: { contentType: 'application/json; charset=utf-8' }, 
     serializeGridData: function (postData) { 
      if (postData.searchField === undefined) postData.searchField = null; 
      if (postData.searchString === undefined) postData.searchString = null; 
      if (postData.searchOper === undefined) postData.searchOper = null; 
      return JSON.stringify(postData); 
     }, 
     rowNum: 5000, 
     viewrecords: true, 
     loadComplete: function(){ 
      if(beforeEvent !== undefined){ 
       var afterEvent = new Date().getTime(); 
       console.log(afterEvent- beforeEvent); 
       beforeEvent = 0; 
      } 
     }, 
     sortorder: 'asc', 
     caption:'Coduri Postale Neoptimizat' , 
     autowidth: true, 
     colModel: colModelSettings, 
    }); 
    $("#gridAdrese").jqGrid('navGrid', "#pagerGrid", {edit:false, add:false, del:false, save:false, cancel:false, search:true, searchtext: 'Search', refresh: false}); 

    $("#jqgh_gridAdrese_judet, #jqgh_gridAdrese_localitate, #jqgh_gridAdrese_tipStrada, #jqgh_gridAdrese_denumire, #jqgh_gridAdrese_cod ").on("click",function(){ 
     beforeEvent = new Date().getTime(); 
     console.log("Sorting"); 
    }) 
    $("#fbox_gridAdrese_search").on("click",function(){ 
     beforeEvent = new Date().getTime(); 
     console.log("searching"); 
    }); 

    $("#next_pagerGrid , #last_pagerGrid, #prev_pagerGrid, #first_pagerGrid").on("click",function(){ 
     beforeEvent = new Date().getTime(); 
     console.log("paging"); 
    }) 
}); 

Answer 1

你可以做以下幾點：

var startTime, measureTime = false, timeInterval, 
    startMesure = function() { 
     startTime = new Date(); 
     measureTime = true; 
    }; 

startMesure(); 
$("#gridAdrese").jqGrid({ 
    url: "/UnoptimizedProject/rest/fetchData", 
    ... 
    onSortCol: function() { 
     startMesure(); 
    }, 
    onPaging: function (pgButton, options) { 
     //if (pgButton === "records") { 
      startMesure(); 
     //} 
    }, 
    searching: { 
     closeAfterSearch: true, 
     closeAfterReset: true, 
     closeOnEscape: true, 
     searchOnEnter: true, 
     beforeSearch: function() { 
      startMesure(); 
      return false; // allow filtering 
     }, 
     onSearch: function() { 
      startMesure(); 
     }, 
     onReset: function() { 
      startMesure(); 
     }, 
    }, 
    loadComplete: function() { 
     if (measureTime) { 
      timeInterval = new Date() - startTime; 
      setTimeout(function() { 
       alert("Total loading time: " + timeInterval + "ms\nFull time: " + 
        (new Date() - startTime)); 
      }, 50); 
      measureTime = false; 
     } 
    } 
}).jqGrid("filterToolbar").jqGrid("navGrid"); 

我們與尊重startTime = new Date();的排序，分頁年初重置startTime到當前時間或過濾。