7

当 ajax 调用失败时,如何阻止 Bootstrap x-editable 更新已编辑的字段?

我正在传递一个函数作为 url。

$('.order-price').editable({
    type: "text",
    title: "Order Price",
    url: function (params) {
        var orderID = $(this).data("order-id");
        var data = "OrderID=" + orderID + "&Price=" + params.value;

        $.ajax({
            type: 'post',
            url: '/Trades/SetOrderPrice',
            data: data,
            async: false,
            error: function (xhr, ajaxOptions, thrownError) {
                return false;
                // Do I return something here instead of false?

            }

        })
    }
});
4

6 回答 6

4

你有两个选择,要么在回调中抛出异常,x-editable 将自己捕获它,或者你可以使用“成功”事件并在成功函数中返回一个空字符串,然后你就设置好了

于 2014-03-18T16:23:17.343 回答
2

最好使用内置的 ajax 调用,它会在出现错误时自动保留旧值:

$('.order-price').editable({
  type: "text",
  title: "Order Price",
  url: '/Trades/SetOrderPrice', 
  params: function (params) {
    return {
      orderID: $(this).data("order-id"),
      value: params.value        
    };
  }
});
于 2013-06-01T10:47:13.833 回答
1
error: function (xhr, ajaxOptions, thrownError) {
    var oldValueObj = $(this).editable('getValue'); //get old value obj

    for(var key in oldValueObj) {
        var value = oldValueObj[key]; //get old value in loop if we don't know key

        return {newValue: value}; //set old value and stop x-editable
    }
}
于 2015-02-12T12:16:14.333 回答
0

在函数的末尾为 'url' 选项返回一个 Defered 对象的承诺。返回 this 告诉 x-editable 在该 Deferred 对象上运行 resolve 之前不要更改客户端数据中的值。如果拒绝()最终被运行,那么旧值仍然存在。

url: function (params) {

    /***ADD DEFERRED***/
    var d = new $.Deferred()
    var orderID = $(this).data("order-id");
    var data = "OrderID=" + orderID + "&Price=" + params.value;

    $.ajax({
        type: 'post',
        url: '/Trades/SetOrderPrice',
        data: data,
        async: false,
        success: function(data, textStatus, jqXHR) {
           /***RESOLVE THE DEFERRED OBJECT***/
           d.resolve(); 
        },
        error: function (xhr, ajaxOptions, thrownError) {
            /***REJECT IF ERROR OCCURRED***/
            d.reject(thrownError);
            //d.reject(''); //You could also return just an empty string, but must return a string


        }

    })

    /*** RETURN A PROMISE ***/
    return d.promise();
}
于 2016-09-18T22:45:09.877 回答
0

由于您是从 url 发出 ajax 请求,因此一种可能的解决方案是调用可编辑错误方法,您可以在初始化期间跟踪该方法。

url: function(params) {
            var url = '/xxx/yyy/dosomething';

            var success = $(this).data('editable').options.success;
            var error = $(this).data('editable').options.error;

            // call your ajax request and invoke success

             $.ajax({
                type: method,
                url: url,
                data: data
                async: false,
                error: function(x,y,z) {
                  error();
                },
                success: function(x,y,z) {
                  success();
                }
            });
}
于 2015-09-18T16:36:35.087 回答
0

使用此代码,它成功地为我工作

$(".editable-open").editableContainer("hide");

于 2017-04-20T23:17:42.450 回答