3

这是我所拥有的：

gridComplete: function() {
    var doneButton = $('<input>', {
        type: 'button',
        value: 'Done',
        click: function() {
            alert("Done!");
        }
    });

    console.log("HTML:", doneButton.html());

    var ids = $(this).jqGrid('getDataIDs');
    var self = this;
    _.each(ids, function(id) {
        $(self).jqGrid('setRowData', id, {
            MarkDone: doneButton.html()
        });
    });
}

如果我只是尝试插入 doneButton 对象，jqGrid 单元格会呈现 [object Object] 而不是实际的按钮。因此，我可以推断它期待原始 HTML。但是， doneButton.html() 返回一个空字符串...大概是因为我还没有将 doneButton 对象附加到文档上。

用 jQuery 做这件事有诀窍吗？我更喜欢更简洁/更安全的语法来生成 HTML 标记，但我可以这样做：

gridComplete: function() {
    var doneButtonHtml = "<input type='button' value='Done' onclick=\"alert('Done');\" />";

    var ids = $(this).jqGrid('getDataIDs');
    var self = this;
    _.each(ids, function(id) {
        $(self).jqGrid('setRowData', id, {
            MarkDone: doneButtonHtml
        });
    });
},

它按预期呈现按钮。

4

4 回答 4

1

您从按钮中获得一个空字符串，因为html()返回的是内部HTML。

你可能想要doneButton.get(0).outerHTML

于 2013-03-27T17:22:05.920 回答
1

如果我正确理解你想要什么，你可以用另一种方式做同样的事情。为了减少Web 浏览器重排的次数， jqGrid 构建断开的网格体，然后将其插入一个。一个必须使用gridview: true才能具有性能优势。问题只是 jqGrid 将网格体构建为 HTML 字符串而不是 DOM。jqGrid 提供自定义格式化程序、cellattr 和 rowattr 回调，允许构造自定义列内容或在行上设置一些自定义属性。有关详细信息，请参阅答案。

所以你应该做的是

  1. MarkDone为带有内容"<input type='button' value='Done' />"（不带click）事件处理程序的列提供自定义格式化程序
  2. 使用onCellSelect或回调在网格体的任何beforeSelectRow位置捕获click事件，包括单击“完成”按钮。事件冒泡（参见此处）有助于减少网格中所需的事件句柄数量。将为您获取单击的单元格，将为您获取列号，并为您获取单击列的名称。$td = $(e.target).closest("td")iCol = $.jgrid.getCellIndex($td[0])this.p.colModel[iCol].name

答案，另一个和最旧的答案将为您提供所需的代码示例和其他信息。

于 2013-03-27T17:43:41.320 回答
0

改变这个：

MarkDone: doneButtonHtml.html()

到：

MarkDone: doneButtonHtml.get(0)

doneButtonHtml是一个 DOM 元素数组。您需要调用get(0)来获取该数组中的第一个元素。

于 2013-03-27T17:26:41.330 回答
0

首先要记住的是 .HTML() 实际上检索元素内部的 html，而不是元素本身的 html。

如果您从 jQuery 对象数组访问 Javascript 元素，您应该获取原始 html。看看这个小提琴：http: //jsfiddle.net/NvKYT/

var doneButton = $('<input>', {
    type: 'button',
    value: 'Done',
    click: function() {
        alert("Done!");
    }
});

//doneButton[0] - your html

尝试传递 doneButton[0] 因为那是实际元素，而不是 jQuery 包装的元素。

于 2013-03-27T17:29:10.807 回答