Question

我有多个字段正在使用x-editable编辑，在单击提交按钮后立即保存所有字段，基于此示例：

https://vitalets.github.io/x-editable/docs.html#newrecord

这是处理保存过程的代码：

    $('.lpeditable').editable({
      url: "/post",
      savenochange: true
    });

    $('#save-btn').click(function() {
      $('.lpeditable').editable('submit', {
        url: '/post',
        data: {
          sub: $('#_sub').val()
        },
        ajaxOptions: {
           dataType: 'json'
        },
        success: function(data, config) {
          console.log("Success:");
          console.log(data);
        },
        error: function(errors){
          console.log(errors);
          if(errors.responseText == "missing-sub"){
            console.log("Sub missing!!");
          }
        }
      });
    });

在帖子上它获得JSON编码并保存到数据库中，当页面加载时，它从数据库中读取，页面将使用以下js代码进行更新：

<script>
$(document).ready(function(){
  $('.lpeditable').each(function(e) {
      var dname = $(this).attr('data-name');
      var fields = <?php if(!empty($fields)) { echo json_encode($fields); } ?>;

      if(fields !== undefined || fields !== null){
        if(fields[dname].length > 0){
          $(this).html(fields[dname]);
          $(this).removeClass('editable-empty');
        }
      }
      else {
        //
      }
  });
});
</script>

一切似乎都运行正常，除非我只编辑一个值，它会为每个其他值发送一个空字符串（＆＃34;＆＃34;）。 Savenochange似乎根本没有效果。

我也试过这种方法：

 $('.lpeditable').editable({
      url: "/post",
      savenochange: true
    }).on('save', function(){
      var dataJ = {};
      $('.lpeditable').each(function(){
        var currAttr = $(this).attr('data-name');
        dataJ[currAttr] = $(this).editable('getValue');
      });
      $.ajax({
        url:"/post",
        data: dataJ,
        sub: $('#_sub').val(),
      })
    });

但它发送了这个：

{"headline":{"headline":""},"headline2":{"headline2":""}}

所以看起来好像是

$(this).editable('getValue');

没有返回任何东西，它也是空的。

任何方法都不能用空的值覆盖未更改的值？

Answer 1

解决方案是添加

$(this).eq(0).data('editable').value = fields[dname];

更新页面上的文字的js函数：

$(document).ready(function(){
  $('.lpeditable').each(function(e) {
      var dname = $(this).attr('data-name');
      var fields = <?php if(!empty($fields)) { echo json_encode($fields); } ?>;

      if(fields !== undefined || fields !== null){
        if(fields[dname].length > 0){
          $(this).html(fields[dname]);

          $(this).eq(0).data('editable').value = fields[dname]; // <-- There

          $(this).removeClass('editable-empty');
        }
      }
      else {
        //
      }
  });
});

设置x-editable在保存/更新值时正在访问的值。这之前是空的，所以我自己设定。现在它运作得非常好。

保存过程的代码与我发布的第一个版本保持一致。

x-editable发送空字段，尽管＆＃34; savenochange＆＃34;设置为true

1 个答案: