JQGrid 数据不会在第二次或后续单击事件时重新加载...（它在第一次 getdata 按钮单击时加载）

Question

我正在使用 JQGrid 根据从下拉列表中选择的 LogID 显示来自 db 的一些数据列表。 ITS 在第一次点击时正确显示内容。 但是在所有后续点击中，页面不会更改或重新加载或做任何事情，但如果我尝试调试脚本，我可以看到按钮点击事件在每次点击时都会被触发，但它仍然没有带回来数据库中更改的 LogID 数据。我不确定，但我认为它与 reloadGrid 触发器有关......

  <script type="text/javascript">
    var firstClick = true;
    $(document).ready(function () {
        $('.editor-date > input').datepicker();
        $('.getdata').click(function () {
            if (!firstClick) {
                $("#GridTable").trigger("reloadGrid");
            }
                firstClick = false;
                $('#GridTable').jqGrid({
                    url: '<%= Url.Action("GetData", "Report") %>',
                    datatype: 'json',
                    mtype: 'POST',
                    colNames: ['Log ID'],
                    colModel: [{ name: 'LogID', index: 'MessageLogID', key: true, formatter: pointercursor }],
                    multiselect: true,
                    sortname: 'LogID',
                    sortorder: "asc",
                    viewrecords: true,
                    pager: $('#pager'),
                    rowNum: 20,
                    rowList: [5, 10, 20, 50],
                    postData: {
                        IdParam: $('#testLogID').val()
                    },
                    jsonReader: {
                        repeatitems: false,
                        id: 'LogID',
                        records: 'TotalRecords',
                        total: 'TotalPages',
                        page: 'CurrentPage',
                        root: 'Rows'
                    },
                    loadError: function (xhr, status, error) {
                        messageBox('Error', 'Error occurred loading data.');
                    },
                    height: 'auto',
                    width: 'auto'
                });

            });

我发现了一个类似的问题，但解决方案不起作用jQuery button click refresh of jqGrid only firing once

Answer 1

我认为你应该改变

postData: {
    IdParam: $('#testLogID').val()
}

到

postData: {
    IdParam: function () {
        return $('#testLogID').val();
    }
}

（请参阅my old answer 了解更多信息）。

您当前的代码保存了$('#testLogID').val() 在第一次调用时创建网格时的值。以后的调用使用相同的旧值。 postData 内部的函数/方法的使用遵循每次重新加载网格期间调用该函数。它将间接完成：jqGrid 使用$.ajax，它使用$.param，它调用函数postData.IdParam。

另外，我建议您添加gridview: true 选项并将pager: $('#pager') 更改为pager: "#pager" 并将行var firstClick = true; 移动到函数$(document).ready(function () {...}); 内。我还想念} else { 的一部分if (!firstClick) {。重要的是要了解，应该使用$('#GridTable').jqGrid({...}); 创建网格一次，以后只使用$("#GridTable").trigger("reloadGrid");。

Answer 2

插入并刷新 jqgrid，查看我的代码。

$("#Tab1").click( function(){ 

 var gridArrayData = [];
   var ids =jQuery("#jqGrid").jqGrid('getGridParam','selarrrow'); 
   var totalRowsCount = ids.length;
   if(totalRowsCount>0)
  {
   $.ajax({ 
     type: "POST", 
     url: 'Operaciones_Grilla.php?Op=30'+'&Filtro='+ids+'&page=1&rows=10', 
     dataType: "json",
     success: function(data) {
		$("#jqGrid2")[0].grid.beginReq();
     	var data = data.rows;
		var ii =0;
        for(var i in data)
               {
						gridArrayData.push({
                                id: data[i].id,
                                sistema: data[i].des_sistema,
                                opcion: data[i].des_opciones_sistema,
								id_sistema:data[i].id_sistema,
								id_opcion:data[i].id
								
                            });                            
                }// cierra el for each
					  jQuery('#jqGrid2').jqGrid('clearGridData')
                     .jqGrid('setGridParam', {data: gridArrayData})
                     .trigger('reloadGrid');
					$("#jqGrid2")[0].grid.endReq();
						$("#jqGrid2").trigger('reloadGrid');
		       }
           }); 
						   $('#tabs a[href="#tabs-2"]').trigger('click');	
						   }else{
							  alert('debe escoger un registro') ;
					}// cierra el íf que cuenta el numero de registros
	});








//*************** PHP CODE ************************//

Operaciones_Grilla.php?Op=30 call this function:

 public function Sube_Data_Grid_Perfiles22($page,$rows,$filtro)
	  {
	   
		 $respuesta = new stdClass();
	     $this->page =$page;
		 $this->limit=$rows;
		 $sql="";
		 $sql='select count(a.*) from opciones_sistema a where a.id_opciones_sistema in  '."(".$filtro.")";
         $count = $this->dbh2->query($sql)->fetchColumn();
		 if( $count >0 ) {
	                $total_pages = ceil($count/$this->limit);
               } else {
	                $total_pages = 0;
               }
              if ($this->page > $total_pages)$this->page=$total_pages;
		     
             $start = $this->limit*$page - $this->limit; 
           $i=0;

           $Sql='select a.id_opciones_sistema, b.des_sistema,a.des_opciones_sistema, b.id_sistema from opciones_sistema a,sistemas b where a.id_sistema = b.id_sistema and a.id_opciones_sistema in '."(".$filtro.") order by b.id_sistema,a.id_opciones_sistema ";
  
		$stmt = $this->dbh2->prepare($Sql);
		$stmt->execute();
	
		
		
		foreach ($stmt as $row) {
		
		        $respuesta->rows[$i]['id']=$row["id_opciones_sistema"];
				$respuesta->rows[$i]['des_sistema']=$row["des_sistema"];
				$respuesta->rows[$i]['des_opciones_sistema']=$row["des_opciones_sistema"];
				$respuesta->rows[$i]['id_sistema']=$row["id_sistema"];
               
                $i++;
		
   
   }// cierra sube data grid

     $this->dbh2 = null;
 
	 return json_encode($respuesta);
	
	
	 
	  
}// cierra metodo suba data grid