asp.net-mvc - 如何在 jqgrid 上实现搜索？

Question

所以我有 jqgrid 在 ASP.NET MVC 中工作的基本示例，javascript 看起来像这样：

    $(document).ready(function() {

        $("#list").jqGrid({
            url: '../../Home/Example',
            datatype: 'json',
            myType: 'GET',
            colNames: ['Id', 'Action', 'Parameters'],
            colModel: [
                   { name: 'id', index: 'id', width: 55, resizable: true },
                   { name: 'action', index: 'action', width: 90, resizable: true },
                   { name: 'paramters', index: 'parameters', width: 120, resizable: true}],
            pager: $('#pager'),
            rowNum: 10,
            rowList: [10, 20, 30],
            sortname: 'id',
            sortorder: 'desc',
            viewrecords: true,
            multikey: "ctrlKey",
            imgpath: '../../themes/basic/images',
            caption: 'Messages'
        });

现在我正在尝试实现他们在jqgrid 示例中的搜索按钮（单击操作/网格数据）。但我不明白他们是如何实现它的。我期待例如“search：true”和实现它的方法。

有没有人在 jqgrid 上实现了搜索，或者知道明确显示如何做到这一点的示例？

score 40 · Accepted Answer

我最近自己（实际上是昨天）第一次实现了这个。对我来说最大的障碍是弄清楚如何编写控制器功能。函数签名是我花了最长时间才弄清楚的（注意 _search、searchField、searchOper 和 searchString 参数，因为我见过的大多数 asp.net mvc 示例都缺少这些参数）。javascript 发布到控制器以进行初始加载和搜索调用。您将在代码中看到我正在检查 _search 参数是否为真。

下面是控制器和javascript代码。对于任何格式问题，我深表歉意，因为这是我第一次在这里发帖。

public ActionResult GetAppGroups(string sidx, string sord, int page, int rows, bool _search, string searchField, string searchOper, string searchString)
{
    List<AppGroup> groups = service.GetAppGroups();
    List<AppGroup> results;
    if (_search)
       results = groups.Where(x => x.Name.Contains(searchString)).ToList();
    else
       results = groups.Skip(page * rows).Take(rows).ToList();

    int i = 1;

    var jsonData = new
    {
        total = groups.Count / 20,
        page = page,
        records = groups.Count,
        rows = (
            from appgroup in results
            select new
            {
                i = i++,
                cell = new string[] {
                         appgroup.Name,
                         appgroup.Description
                     }
            }).ToArray()
    };

    return Json(jsonData);
}

这是我的 HTML/Javascript：

$(document).ready(function() {
  $("#listGroups").jqGrid({
    url: '<%= ResolveUrl("~/JSON/GetAppGroups/") %>',
    datatype: 'json',
    mtype: 'GET',
    caption: 'App Groups',
    colNames: ['Name', 'Description'],
    colModel: [
        { name: 'Name', index: 'Name', width: 250, resizable: true, editable: false},
        { name: 'Description', index: 'Description', width: 650, resizable: true, editable: false},
    ],
    loadtext: 'Loading Unix App Groups...',
    multiselect: true,
    pager: $("#pager"),
    rowNum: 10,
    rowList: [5,10,20,50],
    sortname: 'ID',
    sortorder: 'desc',
    viewrecords: true,
    imgpath: '../scripts/jqgrid/themes/basic/images'
//});
}).navGrid('#pager', {search:true, edit: false, add:false, del:false, searchtext:"Search"});

score 19 · Accepted Answer

请参阅我关于 codeproject 的文章，其中解释了我们如何在 jqgrid 中进行多重搜索：

在 ASP.NET MVC 中使用带有多个过滤器的 jqGrid 搜索工具栏

我使用 IModelBinder 进行网格的设置绑定，使用表达式树对数据进行排序和过滤。

score 2 · Accepted Answer

如果您仍然想知道如何处理可选参数，只需通过?在类型名称后添加 a 来将它们声明为可为空。

现在您可以将它们与它们进行比较null以检查它们是否不存在。

请注意，您不需要对字符串执行此操作，因为它们已经可以为空。

score -1 · Accepted Answer

@Alan-好的，我使用了您的方法并扩展了我的网络服务以期望这三个额外的参数并检查“_search”是否为真/假。但是，为了完成这项工作，我必须在 JavaScript 中将其添加到我的 ajax 调用中：

if (!postdata._search) {    
           jQuery("#mygrid").appendPostData( {searchField:'', searchOper:'', searchString:''});  
}

score -2 · Accepted Answer

只需点击此链接。它解释了所有实现...

您可以创建一个按钮searchBtn，并可以在点击时调用搜索表单

$("#searchBtn").click(function(){
   jQuery("#list4").searchGrid(
   {options}
    )});

asp.net-mvc - 如何在 jqgrid 上实现搜索？

5 回答 5

Related

Reference