【问题标题】:Jeditable callback after onresetonreset 后的可编辑回调
【发布时间】:2018-08-04 10:36:47
【问题描述】:

我有一串多行,由换行符分隔,在客户端使用 javascript 解析为 <ul> 层次结构。 Jeditable 用于编辑列表,用户看到带有换行符的原始文本(从 loadurl 参数发送)而不是解析的 HTML。例如

原始文本/字符串以及在编辑时向用户呈现的内容:

line1
line2
line3
line4

在页面加载和编辑后解析为以下内容。用户在查看(非编辑)时看到的内容:

<ul>
   <li>line 1</li>
   <li>line 2</li>
   <li>line 3</li>
   <li>line 4</li>
</ul>

使用以下jeditable 设置在这里一切正常:

$('.editable').editable(function(value, settings) {
    var data = jeditableSubmitChange(value);
    return(data);
}, {
    type      : 'textarea',
    loadurl   : '/util/fetchsource.php',
    cancel    : 'Cancel',
    submit    : 'Change',
    loadtext : 'Loading...',
    indicator : 'Saving...',
    tooltip   : 'Click to edit...',
    cssclass  : 'liveeditform',
    cancelcssclass : 'button button__under',
    submitcssclass : 'button button__under',
    submitdata : {foo: "bar"},
    onreset   : jeditableCancel
});

当用户提交编辑时,他们会很好地传递给jeditableSubmitChange 函数,最重要的是,我可以修改发送回包含元素的内容,并提供与页面加载时类似的解析。这也很有效。

问题是当用户取消编辑时。 Jeditable 返回没有 html 解析的字符串,我找不到在加载后修改/解析它的方法。我只是得到原始的、未修改的字符串。

研究使我相信onreset 参数是我所需要的。从我的试验和错误(以及研究,例如this answer)看来,它被称为 before 原始内容被加载回包含元素,这意味着我不能调用它来修改刚刚的内容被加载回包含元素(它只会告诉我这是一个表单 - 它是在内容返回之前)。我也看不到修改返回内容的方法。我提供了一个参数(original),但返回或不返回数据似乎没有效果:

function jeditableCancel(settings, original) {

    console.log("jeditable form just cancelled. Function called and confirmed");

    // return "Does this data appear?"; // Didn't appear
    // leaving out return has no effect. The parent container is still populated with the original content.

}

有没有办法拦截被填充回父容器的实际数据并在填充之前对其进行修改(就像我可以提交一样,我可以控制返回的数据),或者是否有回调,我可以在页面完成加载(取消时)时解析页面上的数据?文档似乎也没有建议。我已经从问题中省略了解析功能,因为它们感觉不相关。它们工作正常,问题不在于我的解析方式,它能够在上述情况下修改数据。

【问题讨论】:

    标签: javascript jquery jeditable


    【解决方案1】:

    我遇到了和你一样的问题。经过多次尝试,终于找到了解决方案:

                 data    : function(string) {                    
                    td_object = $(this);
                    return string;
                 },
                 onreset: function(settings, original) {
    
                    td_object.html('whaever');
                    return false;
                 },
    

    return false是防止强制替换内容的关键。

    【讨论】:

    • 很高兴知道,非常感谢。我没有对此进行测试,因为我从头开始编写的版本(请参阅我的原始答案)只是在时间和代码长度方面让我的一切变得更简单。如果有人在其主要案例中使用 jeditable,它仍然是一个很好的解决方案。
    【解决方案2】:

    事实证明,这在现有版本中是不可能的,而且很可能永远不会,因为它的用途太小众了。

    源是可用的,但是用 jquery 从头开始​​创建我自己的工作(虽然这里太长了,与回答问题无关)而不是尝试调整什么jeditable 提供。我没有过分依赖 jeditables 的其他一些功能,而且重建核心功能的参与程度比您想象的要少。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-06-20
      • 1970-01-01
      • 2012-07-23
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多