jqGridボタンでクリックしてテキストボックスで検索

Question

"Buscar"ボタンをクリックして検索するには、 "teeeeeext"と "ALTA"を入力して "Buscar Index"関数を検索し、jqGridをリロードして結果を表示します。パラメータの検索

マイページ：jqGridをロードする

マイコード：

$("#jqGrid").jqGrid({ 
 
      url: '@Url.Action("BuscarIndex")', 
 
        styleUI: 'Bootstrap', 
 
        responsive:true, 
 
        datatype: "json", 
 
        colModel: [ 
 
         { label: 'Id', name: 'Id', width: 30, key: true, hidden: true, sortable: false }, 
 
         { label: 'Clave', name: 'Clave', width: 30, sortable: false,align: 'right' }, 
 
         { label: 'Nombre', name: 'NombreCompleto', width: 150, sortable: false }, 
 
         { label: 'Perfil', name: 'Perfil.Nombre', width: 150, sortable: false }, 
 
         { label: 'Estatus', name: 'Estatus', width: 45, sortable: false,align: 'center', formatter: formatEstatus }, 
 
         { label: 'Modificar', name: '', width: 45, sortable: false, align: 'center', formatter: formatModif }, 
 
        ], 
 
        width: 800, 
 
        height: 250, 
 
        viewrecords: true, 
 
        rowNum: 20, 
 
        pager: "#jqGridPager" 
 
     });

public JsonResult BuscarIndex(string sidx, string sord, int page, int rows,bool _search,string searchField,string searchOper,string searchString) 
 
     {      
 
      //SEARCH 
 
      return Json(resultadoGridBT,JsonRequestBehavior.AllowGet); 
 
     }

<div class="form-group">   
 
     @Html.LabelFor(model => model.Buscar, htmlAttributes: new { @class = "control-label col-md-1" }) 
 
     <div class="col-md-3"> 
 
      @Html.EditorFor(model => model.Buscar, new { htmlAttributes = new { @class = "form-control" } }) 
 
      @Html.ValidationMessageFor(model => model.Buscar, "", new { @class = "text-danger" }) 
 
     </div> 
 

 
     @Html.LabelFor(model => model.Estatus, htmlAttributes: new { @class = "control-label col-md-1" }) 
 
     <div class="col-md-2"> 
 
      @Html.DropDownList("Estatus", null, "(TODOS)", new { @class = "form-control" }) 
 
      @Html.ValidationMessageFor(model => model.Estatus, "", new { @class = "text-danger" }) 
 
     </div> 
 
     <button id="buscar" type="button" class="btn btn-default">Buscar</button> 
 
    </div>   
 
     <div class="col-md-12"> 
 
      <table id="jqGrid"></table> 
 
      <div id="jqGridPager"></div> 
 
     </div> 
 

 
     <div class="form-group"> 
 
      <div class="col-md-offset-2 col-md-10"> 
 
      </div> 
 
     </div> 
 
    </div>

Answer 1

回答：

$('#btnBuscar').click(function() {    
 
      fnBuscar(); 
 
     }); 
 

 
\t function fnBuscar(){ 
 
      var rules = []; 
 
      var $grid = $("#jqGrid"); 
 
      var postData = $grid.jqGrid('getGridParam', 'postData'); 
 
      rules.push({ field: 'buscar', op: "eq", data: $("#Buscar").val() }); 
 
      rules.push({ field: 'estatus', op: "eq", data: $("#Estatus").val() }); 
 

 
      postData.filters = JSON.stringify({ 
 
       groupOp: "AND", 
 
       rules: rules 
 
      }); 
 
      $grid.jqGrid("setGridParam", { search: true }); 
 
      $grid.trigger("reloadGrid", [{ page: 1, current: true }]); 
 
     }

public JsonResult BuscarIndex(string sidx, string sord, int page, int rows, bool _search, string searchField, string searchOper, string searchString, string filters) 
 
     {      
 
      //Fill resultadoGridBT       
 
      return Json(resultadoGridBT,JsonRequestBehavior.AllowGet); 
 
     }