javascript - X-Editable - 如何使用 ajax 提取表单数据

Question

我正在使用 x-editable，想知道如何使用 jquery 和 ajax 填充我的选择元素。

[编辑 - 为清楚起见]

这是我的代码:

jQuery(document).ready(function() {

    //toggle `popup` / `inline` mode
    $.fn.editable.defaults.mode = 'popup';

    var getSource = function() {
        var url = "/api/rpc/payments/status_options";
        $.ajax({
            type:  'GET',
            async: true,
            url:   url,
            dataType: "json",

            success: function(responseObject){
            }

        });

    };

    //make status editable
    $('.payments-click').editable({
        type: 'select',
        title: 'Select status',
        placement: 'right',
        value: 2,
        source: getSource()
        /*
         //uncomment these lines to send data on server
         ,pk: 1
         ,url: '/post'
         */
    });

});

我正在尝试获取来源:

source: getSource()

从函数但我不是 100% 确定如何从 Ajax 调用返回数据。

Answer 1

我在这篇文章的帮助下解决了这个问题:How do I return the response from an asynchronous call?

这是我的解决方案:

jQuery(document).ready(function() {

    //toggle `popup` / `inline` mode
    $.fn.editable.defaults.mode = 'popup';

    function getSource() {
        var url = "/api/rpc/payments/status_options";
        return $.ajax({
            type:  'GET',
            async: true,
            url:   url,
            dataType: "json"
        });
    }

    getSource().done(function(result) {

        $('.payments-click').editable({
            type: 'select',
            title: 'Select status',
            placement: 'right',
            value: 2,
            source: result
            /*
             //uncomment these lines to send data on server
             ,pk: 1
             ,url: '/post'
             */
        });


    }).fail(function() {
        alert("Error with payment status function!")
    });

});