Question

我有一个表单，通过ajax提交一个新条目并返回条目数据。我正在尝试在Select2字段中自动选择返回的数据。我可以输入id作为输入值，但我不确定如何在跨度中显示文本。

这是我到目前为止的JS：

function clientFormatResult(client){
    var markup = client.first_name + ' ' + client.last_name + ' (' + client.username + ')';
    return markup; 
}

function clientFormatSelection(client) {
    $('#client-input').empty();
    $('#client-input').append('<input type="hidden" name="client" value="' + client.id + '" />');
    return client.first_name + ' ' + client.last_name + ' (' + client.username + ')';
}

$('#client-selection').select2({
    placeholder: 'Select a client',
    allowClear: true,
    minimumInputLength: 1,
    ajax: {
        type: 'POST',
        url: 'clients/get_client_list',
        dataType: 'json',
        data: function (term) {
            return {filter: term};
        },
        results: function (data) {
            return {results: data};
        }
    },
    formatResult: clientFormatResult,
    formatSelection: clientFormatSelection,
    dropdownCssClass: 'bigdrop',
    initSelection: function (element, callback) {
        var id = element.val();
        if(id != '') {
            $.ajax('clients/get_client_list/'+id).done(function(data) {
                data = $.parseJSON(data);
                callback(data);
            });
        }
    }
});

$('#add-client-form').submit(function(e) {
    e.preventDefault();
    var form = $(this),
        url = form.attr('action'),
        data = form.serialize();
    $.post(url, data, function(data, status, xhr) {
        $('.form-response').fadeOut(400);
        if(status == 'success') {
            $('#add-client-modal').modal('hide');
            data = $.parseJSON(data);
            $('#client-selection').select2('val', data.client_id);
        } else {
            $('#add-client-failure').fadeIn(400);
        }
    });
});

如您所见，显示的文字就像“John Smith（smithj）”。

Answer 1

我把它整理出来，这是我回来的数据的问题。 Select2期待id变量，但我将其作为client_id返回。

jQuery Select2 - 选择ajax提交的值

1 个答案: