updatepanel和jqgrid

Question

可以更新面板和jqgrid一起工作吗？ 我正在使用jqgrid，我想控制页面刷新。所以我添加了更新面板，但它不工作。

Answer 1

支持UpdatePanels。您可以使用我们的Master - > Detail示例在线嵌入到UpdatePanel中的jqGrid实例作为起点： MasterDetail jqgrid inside an update panel

Answer 2

您需要在部分回发后重新实例化您的jqgrid。

<script type="text/javascript"> 
        //Calls the function to load the for the first time 
        LoadGrid(); 
        **var prm = Sys.WebForms.PageRequestManager.getInstance(); 
        prm.add_initializeRequest(InitializeRequest); 
        prm.add_endRequest(EndRequest); 
        function InitializeRequest(sender, args) { 
        } 
        // fires after the partial update of UpdatePanel 
        function EndRequest(sender, args) { 
         //Calls the function again to load the grid after partial postback 
         LoadGrid(); 
        }** 

        function LoadGrid() { 
         jQuery("#jqGrid").jqGrid({ 
          url: '/GridHandler.ashx', 
          datatype: "json", 
          colNames: ['Id', 'Village Name', 'Village Area'], 
          colModel: [ 
          { name: 'Id', index: 'Id', width: 30, sorttype: 'int', sortable: true }, 
          { name: 'VillageName', index: 'VillageName', width: 170, sorttype: 'text', sortable: true }, 
          { 
           name: 'VillageArea', index: 'VillageArea', width: 70, align: "right", sorttype: 'int', 
           sortable: true, formatter: 'integer', formatoptions: { thousandsSeparator: "," } 
          }, 
          ], 
          //pager: "#pager", 
          rowNum: 1000, 
          height: 441, 
          width: 288, 
          loadonce: true, 
          sortname: 'Id', 
          viewrecords: true, 
          sortorder: "asc", 
          caption: "List of Villages", 
          shrinkToFit: 'false', 
          onSelectRow: function() { 
           //Gets the Id of selected row 
           var sel_id = $('#jqGrid').jqGrid('getGridParam', 'selrow'); 
           var selectedVillage = $('#jqGrid').jqGrid('getCell', sel_id, 'VillageName'); 

           $.ajax({ 
            type: "POST", 
            async: false, 
            url: "HomeModified.aspx/GridRowSelect", 
            data: "{'village':'" + selectedVillage + "'}", 
            contentType: "application/json; charset=utf-8", 
            dataType: "json", 
            success: function (result) { 
             GenerateMap(); 

            }, 
            error: function (result) { 
             alert("There is an error in generating map"); 
            } 
           }); 

           function GenerateMap() { 
            document.getElementById("<%=hiddenButton.ClientID %>").click(); 
           $('#jqGrid').jqGrid('setGridParam', { url: '/GridHandler.ashx', datatype: 'json' }).trigger('reloadGrid', [{ current: true }]); 
          } 
         } 
         }); 
        } 



       </script>