6

对 jquery 和数据表来说是全新的。我想添加一个编辑按钮，该按钮调用一个显示所有可编辑字段的颜色框 div。谁能指出我如何实现这一目标的正确方向？

我能够为每个字段添加一个 sClass 并使用 fnDrawCallback 回调从字段中调用颜色框。但这有点乱，我宁愿在每一行的末尾都有一个按钮用于编辑目的。非常感谢您的任何指点。

4

2 回答 2

10

您可以通过 fnCreatedCell 回调在 aoColumnDefs 的列定义中添加内容，以下将一个按钮添加到第一行，并带有一个 onclick 事件处理程序，该处理程序重定向到第一列中的值（这是您可能想要更改的内容。

"aoColumnDefs" : [ 
                    {
                        "aTargets": [0],
                        "fnCreatedCell" : function(nTd, sData, oData, iRow, iCol){
                            var b = $('<button style="margin: 0">edit</button>');
                            b.button();
                            b.on('click',function(){
                                document.location.href = oData[0];
                                return false;
                            });
                            $(nTd).empty();
                            $(nTd).prepend(b);
                        }
                    },
于 2012-03-19T16:37:29.153 回答
1

我会推荐使用优秀的DataTables Editable插件。该插件使直接在表格中编辑字段变得非常容易。

如果您真的想在每一行上都有一个按钮，您可以在生成表服务器端时添加它，或者使用 jQuery 添加它。然后，您需要将操作绑定到按钮。

假设你想注入按钮，代码变成这样：

$('#form-id').delegate('.edit-button', 'click', function() {
   // action
}).find('.classname-of-field-for-button').html('<button class="edit-button">');
于 2011-04-09T21:38:52.007 回答