可编辑的元素，覆盖原文不工作（x编辑）

Question

我一直在这一段时间，我似乎无法想出一个解决方案。

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

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

的jsfiddle所以你可以明白我的意思：http://jsfiddle.net/6puty174/

它应该当您提交您的更改，以取代原来的文本（你可以看到X-编辑网站上的例子：//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); 
     } 
    } 
});