javascript - 按项目修改 X-Editable 中的按钮模板?

标签 javascript jquery x-editable

我正在尝试将自定义按钮模板与 X=Editable jQuery 库一起使用。

我知道有一种方法可以使用影响页面上所有表单字段的全局方法来设置按钮模板。我想知道如何在每个项目的基础上使用自定义模板?

这是显示如何设置全局按钮模板的 DOCS 页面和部分:http://vitalets.github.io/x-editable/docs.html#global

它说:


$.fn.editableform.buttons

按钮模板。自动插入到 .editable-buttons 中。必须包含类 .editable-submit.editable-cancel
默认值:

<button type="submit" class="editable-submit">ok</button>
<button type="button" class="editable-cancel">cancel</button>

所以你可以看到你可以像这样轻松地将按钮模板设置为全局的 JavaScript 变量......
$.fn.editableform.buttons = '此处为按钮 HTML';

如何为 1 个特定的表单字段设置自定义按钮模板?

最佳答案

我找到了为我做这件事的解决方案。对于特定的 x 可编辑对象,我想要一个文本发送按钮而不是 glyphicon-ok。因此,如果弹出窗口出现并且此弹出窗口适用于我的按钮,我会使用 MutationObeserver 进行监听:

var MutationObserver = MutationObserver || WebKitMutationObserver || MozMutationObserver;
var observer = new MutationObserver(function(mutations, observer) {
    mutations.forEach(function(mutation) {
        if($(mutation.target).find('.popover-title').text() === 'Title of my button' && $(mutation.target).find('.glyphicon-ok')){
            $(mutation.target).find('.editable-submit').html('process');
        }
    });
});
observer.observe(document, {
    subtree: true,
    attributes: true
});

不太好,但有效。

关于javascript - 按项目修改 X-Editable 中的按钮模板?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31000192/

相关文章:

jquery - X-editable data-type=number 导致弹出窗口位于错误的位置。

javascript - 更新 AngularJS 中数组的数据

javascript - knockout foreach 环绕 4

javascript - 如何在另一个 dgrid 单元格中显示 dojo dgrid 选择

javascript - 如何从选择选项中获取 HTML5 数据值?

javascript - 绑定(bind)到 x-editable 的成功函数未使用正确的参数执行

javascript - 复选框的集合

javascript - 在组合属性选择器中使用 OR 条件

javascript - 秒倒计时的 jQuery.countdown 问题

twitter-bootstrap - 使用 Spring MVC X-editable Select2 标签