带自动完成功能的jQuery Grid

我正在使用jQuery和jQuery UI构建一个webapp。我无所事事。我需要的是一个jQuery网格，它具有可编辑的字段，并以某种方式在这些可编辑的单元之一上加入了一个自动填充字段，我似乎找不到任何实现此功能的网格产品。带自动完成功能的jQuery Grid

我一直在寻找StickGrid和jgGrid

我特别喜欢的jqGrid因为它的ThemeRoller就绪。是否有人知道是否有人已经成功地将自动完成功能集成到这些网格之一或任何其他jQuery网格上？

来源

2009-12-18 Marcelo Mason

我认为你想要的应该是可以实现的很容易。我让你快速复制粘贴/一起窃取。

如果您单击日期列，您会看到一个日历选择器。

如果您单击客户端列并删除内容，您将看到一个autocompleter（css不适合quickpastewhatever）列出美国城市（我知道城市不是客户名称只是一个演示）。从jqGrid细胞编辑演示页+ jQuery Autocomplete演示页采取

代码

http://jsbin.com/owatu（追加/edit到url看到代码）

当然演示是周围的边缘有点粗糙

css问题
快速入侵afterSaveCell插入以获取jQgrid从自动完成中插入选定的值呃如果用户使用箭头键+鼠标输入密钥它的工作原理没有破解

我想afterSaveCell黑客可以删除干净地集成自动完成和jqGrid相互。

基本上它归结为

jQuery("#celltbl").jqGrid({ 
    ... 
    {name:'name', width:100, editable:true}, //e.g. 
    ... 
    afterEditCell: function (id,name,val,iRow,iCol) { 
     if(name=='name') { 
      //cities here is local json object 
      jQuery("#"+iRow+"_name","#celltbl").autocomplete(cities); 
     } 
    }, 
    afterSaveCell : function(rowid,name,val,iRow,iCol) { 
     if(name == 'name') { 
      jQuery("#celltbl").jqGrid('setRowData',rowid,{name:jQuery(".ac_over").text()}); 
      jQuery(".ac_results").remove(); 
     } 
    } 
    ...

来源

2009-12-18 12:32:13 jitter

这正是我所期待的。谢谢！ – 2009-12-18 21:09:03

谢谢。其实我正在寻找类似的东西。 – Jack7 2012-03-15 11:41:32

我还没有实现自动完成，但我已经与jqGrid合作过，它对javascript事件有一个很棒的支持。

例如：如果你把一个id在细胞中的一个，并希望自动填充其他单元格中的信息u可以使用 afterEditCell其中u指定将收到的rowid，单元名称，价值，iRow，ICOL自定义函数并检查iRow是否与您的id相同，取该值并根据该值填充其他单元格。 - 基本上自动完成

或者可以使用beforeEditCell事件并创建自己的函数，它将接收rowid，cellname，value，iRow，iCol并将返回的结果放入单元格中。

退房事件部分 http://www.trirand.com/jqgridwiki/doku.php?id=wiki:cell_editing

好运！

来源

2009-12-18 02:23:40 Sergey

这是有趣的，并会派上用场，如果我最终使用的jqGrid，但我认为我没有让自己完全清楚。我正在寻找的更像是一个从可编辑单元格填充的下拉菜单，该单元格填充了以当前输入的文本开始的项目，并且用户可以单击下拉菜单中的某个项目，因此该字段会自动完成。没有时间看代码，但可以将这样的东西改编成jqGrid？ – 2009-12-18 02:35:30

我认为它可行，你将需要附加一个jQuery的onkeyup事件的单元格对象调用每个按键上的web服务。挑战将是如何从beforeEditCell获得该对象，因为它只发送rowid，cellname，value，iRow，iCol ...需要一些聪明的jquery – Sergey 2009-12-18 06:22:08

带自动完成功能的jQuery Grid

回答

相关问题