2017-01-20 9 views
1

Я использую ВЫБ.2 ст. 4.0.3Установить начальное значение выбор2 из АЯКС строки

У меня есть два поля на моей форме, когда показано на чертеже, Ajax вызов выполняется для заполнения данных форм.

Когда вызов ajax выполняется и успешно выполняется, я хочу заполнить поля select2 на основе значений из «left_options» и «right_options», которые являются двумя полями в моей базе данных, которые содержат целые строки следующим образом: 25, 0 или 3,41,4

//get all the record info and fillfields if in update mode 
$.ajax({ 
url: "ajax_quick_get_value.php", 
type: "get", 
data: { 
    table: 'invoice_hearing_aids', 
    field: 'id', 
    field_equals: $('#modal_form_invoice_hearingaids #hearing_aids_id').val() 
}, 
dataType: 'json', 
success: function (response) { 
//response here if data response 

if (response) { 

//loop through the data and fill form fields based on id's 
    $.each(response, function (index, value) { 
     if(index != 'left_options' || index != 'right_options') { 
      $('#modal_form_invoice_hearingaids #hearing_aids_' + index).val(value); 
     } 

     if(index == 'left_options') { 
      var left_current_string = value; 

      //will throw an error if it's null, so check first 
      if (left_current_string != null) { 
       var left_array = new Array(); 
       var left_array = left_current_string.split(','); 

       $('#modal_form_invoice_hearingaids #hearing_aids_left_options').select2('val', left_array); 
      } 

     } 

     if(index == 'right_options') { 
      var right_current_string = value; 

      //will throw an error if it's null, so check first 
      if (right_current_string != null) { 
       var right_array = new Array(); 
       var right_array = right_current_string.split(','); 

       $('#modal_form_invoice_hearingaids #hearing_aids_right_options').select2('val', right_array); 
      } 
     } 

    }); 

Я могу подтвердить, что данные JSON возвращается из моего AJAX вызова имеет значения для обоих left_options и right_options, разделенных запятой.

Только первое значение из строки опций заполняется в поля select2. Все остальное после этого не заселено.

$('#modal_form_invoice_hearingaids #hearing_aids_left_options').select2('val', left_array) 

Я думаю, что проблема в приведенном выше коде как-то? То же самое для кода right_options.

Мне кажется, что это сработало, но по какой-то причине внезапно остановилось. Я использую Chrome.

Вот как я заполнить мой ВЫБ.2 с параметрами динамически (только с указанием right_options один здесь):

<div class="form-group"> 
       <label class="control-label"></label> 
       <select id="hearing_aids_right_options" name="right_options[]" class="form-control hearing_aid_options" multiple style="width: 100%"> 
       <?php 
if($company->find_hearing_aid_options()) { 
$options = $company->hearing_aid_options(); 
foreach ($options as $option) { 
    echo '<option value="' . $option->id . '">' . $option->name . '</option>'; 
    }; 
}; 
?> 
</select> 

Я не уверен, если мне нужно предоставить больше кода, но я Можно. Благодарю.

ответ

0

Вам необходимо правильно построить данные на стороне сервера, чтобы он возвращал массив из key:value пар внутри массива с именем items[]. Кроме того, select2 имеет собственные мысли относительно обработки данных в успехе запроса AJAX, и поэтому вы должны использовать реализацию библиотеки, например:

$('select').select2({ 
    ajax: { 
     url: "ajax_quick_get_value.php", 
     dataType: 'json', 
     delay: 250, 
     data: function (params) { 
      return { 
      q: params.term, // search term 
      page: params.page 
      }; 
     }, 
     processResults: function (data, params) { 
      params.page = params.page || 1; 

      return { 
      results: data.items, 
      pagination: { 
       more: (params.page * 30) < data.total_count 
      } 
      }; 
     }, 
     cache: true 
     }, 
     escapeMarkup: function (markup) { return markup; }, 
     minimumInputLength: 1, 
     templateResult: formatItems, 
     templateSelection: formatItemSelection 
    }); 
}); 

Теперь единственное, что вам нужно беспокоиться о том является 2 функции formatItems и formatItemSelection.

Вы можете просто реализовать что-то простое для них, как:

function formatItems(item) { 
    return item.name; 
} 

и

function formatItemSelection (item) { 
    return item.name; 
} 

Вот и все. Теперь вам просто нужно, чтобы убедиться, на стороне сервера, он правильно возвращается таким образом, что это правильный ответ JSON, как описано выше:

return json_encode([ 
    'items' => $myItemsArray 
]); 

Тогда вам просто нужно возвращать массив объектов, имеющих id собственности и name собственности как минимум.

+0

Так на моем сервере, я должен иметь массив, который имеет идентификатор и имя для left_options и right_options полей? Что делать, если я изменю имя параметров?Например, я решил назвать это чем-то еще позже. Мне нужно пройти все записи и переименовать «имя» в json-запись, правильно? Прямо сейчас я просто храню идентификатор как разделенную запятыми строку в left_options, right_options. Затем я пытаюсь заполнить select2 на основе этих идентификаторов и параметров, которые я динамически загружаю из своей базы данных. –

+0

@ chris.cavage Вы можете выбрать все, что хотите использовать в 'formatItems' и' formatItemSelection'. Я просто выбираю имя для простоты. Но вам нужно будет сохранить это на будущее, а также – Ohgodwhy

0

Это работает для меня, изменяя код:

$('#modal_form_invoice_hearingaids #hearing_aids_left_options').val(left_array).trigger("change");