Question

我已经有一段时间了，我似乎无法找到解决方案。

我正在使用X-editable（Jquery）来允许用户编辑页面中的元素。它大部分运行良好，但是我在降低地址方面遇到了很多麻烦。我编辑了插件附带的address.js文件，以便可以有更多字段（街道，城市，州等），如果点击“编辑”按钮，它们会正确显示。

但是，当您提交更改时，它不会更改原始文本。

JSFiddle所以你可以看到我的意思：http://jsfiddle.net/6puty174/

当您提交更改时，它应该替换原始文本（您可以在x-editable网站上看到示例：//vitalets.github.io/x-editable/demo-bs3.html - 在底部“莫斯科”）。

不确定我做错了什么。我认为这与我在address.js文件中所做的更改有关。我上传了它，这样你就可以看到我做了什么：http://saulmarquez.com/test/address.js。原始的：//vitalets.github.io/x-editable/assets/x-editable/inputs-ext/address/address.js。

我尝试模仿我在网站演示的源代码中看到的内容：

$('#acct-address').editable({
    value: {
        city: "Moscow", 
        street: "Lenina", 
        building: "12"
    },
    validate: function(value) {
        if(value.city == '') return 'city is required!'; 
    },
    display: function(value) {
        if(!value) {
            $(this).empty();
            return; 
        }
        var html = '<b>' + $('<div>').text(value.city).html() + '</b>, ' + $('<div>').text(value.street).html() + ' st., bld. ' + $('<div>').text(value.building).html();
        $(this).html(html); 
    }         
});

但是，当我点击编辑链接进行更改时，只打开一个文本字段（而不是应该的多个文本字段），文本[输出] [输出] - 再次，当您点击提交时，它不会什么都不改变。（我也改变了上面的值，以便与我在address.js中添加的值相对应，并且发生了同样的事情。）

希望这是有道理的。不知道我在做什么。我仍然是javascript / jquery的新手，以及所有插件的工作方式。

提前致谢！

Answer 1

更改HTML：

<div class="acct-sub">
    <strong>Address</strong><br>
    <span id="acct-address">5555 E. PEF Lane</span><br>
    <span id="acct-city">Phoenix</span>, <span id="acct-state">AZ</span> 
    <span id="acct-zip">85142</span> <span style="float: right;">
    <a href="#" id="address-edit">Edit</a></span>
</div>

改变JS：

$('#acct-address').editable({
    type: 'address',   
    pk: 1,    
    title: 'Edit Your Billing & Contact Address',
    display: function(value, sourceData) {
        if (value !== null) {
            $("#acct-address").text(value.street);
            $("#acct-city").text(value.city);
            $("#acct-state").text(value.state);
            $("#acct-zip").text(value.zipcode);
         }
    }
});

可编辑元素，覆盖原始文本无效（x-editable）

1 个答案: