x可编辑-成功执行POST后运行代码？

Question

我最近在django项目中添加了x可编辑的功能。我有工作来填充组合框并提交我的选择。它保存到数据库，一切正常。但是我有一个div我想在成功提交/发布时进行更新。

在source:下面的行中，我可以指定成功获取组合框值后发生的情况。（success: function(data)....etc）

成功执行POST之后，我无法弄清楚该如何做。

Javascript（混有一些django）：

$('#issueResponse').editable({
        disabled: true,
        type: 'select',
        url: '../ajax/post/issueresponse',
        params: {
                csrfmiddlewaretoken: '{{ csrf_token }}',
                },
        pk: {{ issue_obj.pk }},
        {% if issue_obj.fk_issueresponseTypeName.id == null %}
            //Do nothing
            //Do not include value: variable if existing value is set!
        {% else %}
            value: {{ issue_obj.fk_issueresponseTypeName.id }}, //value = the default value (id) of the combobox
        {% endif %}  
        showbuttons: true,

    source: function() {
        var result;
        $.ajax({
            url: '../ajax/get/responses',
            //data: {t: 'zone'},
            type: 'GET',
            global: false,
            async: false,
            dataType: 'json',
            success: function(data) {
                result = data;
                //$( "#Response" ).load( "../ajax/get/{{issue_obj.id}}/response/" );
            }
        });
        return result;
    },
});

我已经确认$( "#Response" ).load( "../ajax/get/{{issue_obj.id}}/response/"可以通过按钮执行操作（刷新指定的“ div”）。我也将其添加到source:-> success:区域中，并且按预期工作（在上面的代码段中，但已注释掉了）。但是，当然，我希望它在通过x-editable成功执行POST 之后刷新。

我尝试了以下变化：

• 下面的代码添加在 showbuttons: true,

success: function(data, config) { $( "#Response" ).load( "../ajax/get/{{issue_obj.id}}/response/" },

• 下面的代码针对url:我认为可能会遵循类似的方法进行了扩展source:，`

  url: function() {
      var result;
      $.ajax({
          url: '../ajax/post/issueresponse',
          //data: {t: 'zone'},
          type: 'POST',
          global: false,
          async: false,
          dataType: 'json',
          success: function(data) {
              $( "#Response" ).load( "../ajax/get/{{issue_obj.id}}/response/" );
          }
      });
      return result;
  },
  

都没有工作。有什么建议么？

=====以下代码包含BabyAzerty的解决方案====

Response对应于<div id="Response">你会有你的html

$('#issueResponse').editable({
        disabled: true,
        type: 'select',
        url: '../ajax/post/issueresponse',
        success: function(response, newValue) {
                          $( "#Response" ).load( "../ajax/get/{{issue_obj.id}}/response/" );
                          },
        params: {
                csrfmiddlewaretoken: '{{ csrf_token }}',
                },
        pk: {{ issue_obj.pk }},
        {% if issue_obj.fk_issueresponseTypeName.id == null %}
            //Do nothing
            //Do not include value: variable if existing value is set!
        {% else %}
            value: {{ issue_obj.fk_issueresponseTypeName.id }}, //value = the default value (id) of the combobox
        {% endif %}  
        showbuttons: true,

    source: function() {
        var result;
        $.ajax({
            url: '../ajax/get/responses',
            //data: {t: 'zone'},
            type: 'GET',
            global: false,
            async: false,
            dataType: 'json',
            success: function(data) {
                result = data;
                //$( "#Response" ).load( "../ajax/get/{{issue_obj.id}}/response/" );
            }
        });
        return result;
    },
});

Answer 1

使用X-Editable的成功参数

$('#issueResponse').editable({
    success: function(response, newValue) {
        $( "#Response" ).load( "../ajax/get/{{issue_obj.id}}/response/" );
    }
});

或者您可以添加事件触发器

$('#issueResponse').on('save', function(e, params) {
    alert('Saved value: ' + params.newValue);
    $( "#Response" ).load( "../ajax/get/{{issue_obj.id}}/response/" );
});