基于jQuery的表格分页和内联编辑支持

对于已经完成类似工作的人来说，这可能很简单。基于jQuery的表格分页和内联编辑支持

我有一个简单的网格中，我呈现数据到控件（例如文本框，复选框，...），所以用户可以做批量编辑中呈现的行，然后点击提交按钮来获取所有数据库中的更新。

现在，我在我的ASP.Net MVC2 proj中有这样的可编辑网格的工作版本。接下来，我想要在客户端使用jQuery （可以假设我正在使用大量记录呈现整个网格），然后使用排序，分页&筛选器。我可以用服务器端编码轻松做到这一点，并且只需渲染一页Grid，但现在考虑我想在客户端一侧执行此操作。

我试过了一些jQuery插件 - 它们工作正常，但对于正常的只读文本基于网格。我的网格有文本框，用户可以编辑的复选框，我的问题是，这些插件在搜索期间都没有保留其编辑值&分页。或者他们动态地坚持它 - 这不会传递给服务器！

例如，在这个电网的复选框状态或者不跨越分页坚持：

enter image description here

希望有人已经通过这个，并会帮助我。 我们努力让事情变得简单&干净。

插件尝试：

来源

2012-03-29 Hemant Tank

尝试jqGrid，我认为它具有所需的所有功能http://trirand.com/blog/ jqgrid/jqgrid.html – 2012-03-29 14:39:29

刚刚测试过另一个插件：http://www.scriptiny.com/2009/03/table-sorter/，但它不会在分页时保持复选框状态。 – 2012-03-29 14:42:45

基于一些流行的插件我到目前为止审查和基本的了解（或多或少）如何他们会取得客户端上的分页，我得到大多数人 -

缓存变量中的表格行。并且他们在分页或搜索之前清除“TBODY”，并用结果重新填充。

因此，在回发期间，我只获取“填充”行数而不是实际表格。至少这就是我的MVC动作给我看的东西。有时候，它是空的！

我的结论是，虽然状态，并在网格控件的值似乎是跨paginaton可见，他们是不同步与回发期间所被传递。我很乐意错误或者如果一个插件做得更好。

SOLUTION：现在，我已经记录的值，如果在临时文本框我选中的复选框，这将使可用值回发过程中没有无论插件不具有实际的表的！

谢谢。

来源

2012-03-30 12:12:21

顺便说一句，我已经确认了“jquery.tablesorter.filter.js”的缓存方案 - 它会在回发期间搞乱你的tbody。最好你可能会期望它会返回原来的tbody。这些插件最适合只读/仅文本网格。 – 2012-03-30 12:29:29

看一看这篇文章： http://roberto.open-lab.com/2010/01/30/javascript-grid-editor-i-want-to-be-excel/

几个这些网格的给你哪些东西几乎完全控制坚持和时。如果您希望您的复选框立即保留，您可以在复选框本身上添加一个监听器，以便调用服务器。

我是DataTables的忠实粉丝，但我没有用它来描述你描述的特定场景。

来源

2012-03-29 14:40:49 Marc

如果你已经使用jqGrid - 它是否有一个简单的初始化程序，如：$（“＃sortable”）。tablesorter（）。我看到它的构造函数问得太多了！ – 2012-03-29 15:07:16

我为tablesorter编写了一个复选框解析器，它允许您对复选框列进行排序。

我还没有测试过这个，但由于它使用updateCell方法更新缓存的单元格内容，无论何时修改复选框，我认为它可能只是与分页器插件一起工作。

检出the demo here，只需复制解析器代码并与寻呼机插件一起尝试。

编辑：哎呀，我忘了它会需要在github上从这个叉的最新版本tablesorter。原因是原始的tablesorter没有将所有额外的变量传递给format函数：format: function(s, table, cell, cellIndex) {}

来源

2012-03-31 02:02:01 Mottie

我想我没有阅读关于使用寻呼机的表的部分。如果你使用我的fork的分支，[pager]（http://mottie.github.com/tablesorter/docs/example-pager.html）有一个名为'removeRows'的附加选项，你可以将它设置为'false'保持整个tbody。 – Mottie 2012-09-02 12:31:26

基于jQuery的表格分页和内联编辑支持

回答

相关问题