2014-06-20 82 views
3

我有一個通過ajax提交新條目並返回條目數據的表單。我試圖在Select2字段中自動選擇返回的數據。我可以得到輸入的id作爲輸入值,但我不確定如何讓文本顯示在span中。jQuery Select2 - 選擇ajax提交的值

這裏的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); 
     } 
    }); 
}); 

正如你所看到的,所顯示的文字,就是要像「約翰·史密斯(smithj)」。

回答

0

我把它整理出來了,這是我返回的數據的一個問題。 Select2期待id變量,但我將它作爲client_id返回。