1. 首页
  2. 问答
  3. 如何在jqgrid上实现搜索？

如何在jqgrid上实现搜索？

2009-01-13 128 views
28

所以我得在jqGrid的ASP.NET MVC工作的基本示例，javascript的是这样的：如何在jqgrid上实现搜索？

$(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 examples具有搜索按钮（点击操纵/网格数据）。但我不明白他们是如何实施它的。我期待着一个“搜索：真实”和实施它的方法。

有没有人在jqgrid上实现过搜索，或者知道明确显示如何做的例子？

来源

2009-01-13 Edward Tanguay

回答

39

调用搜索表单最近，我自己（昨天其实）首次实现这一点。对我来说，最大的障碍是搞清楚如何编写控制器功能。函数签名是我花了很长时间才弄清楚的（请注意_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"});

来源

2009-04-16 23:16:18 Alan

+0

替换列表 groups = service。GetAppGroups（）; 为更明确的服务方法（这是一个选择每个查询中的所有数据库元素）：） – SDReyes 2010-05-22 19:40:30

-2

只需按照this link。它所有的实现解释...

您可以创建一个按钮searchBtn，可以在点击

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

来源

2009-03-17 08:59:10

+14

虽然我不喜欢它，但我明白为什么人们用“ass”来缩写“赋值”。但把“按钮”简称为“屁股”已经超出了我的想象。我的意思是，它只需要两个字母，以避免看起来像一个屁股。 – 2010-03-14 09:57:45

+1

LOL朗读给我的同事，他总是将“作业”缩写为“屁股”:)。鼓舞士气。 – 2011-06-23 11:22:47

-1

@Alan - 好吧，我用你的方法和扩展我的web服务期待这些额外的三个参数，并检查“_search”为真/假。但是，为了使这项工作，我不得不把它添加到我的JavaScript的Ajax调用：

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

来源

2009-04-17 16:42:27

2

在你仍然不知道关于处理可选参数的情况下，只需添加一个声明为nullables类型名称后的?。

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

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

来源

2009-06-12 16:10:31

相关问题

 相关问题