Как выбрать выпадающее значение по умолчанию select2 внутри модема начальной загрузки? - PullRequest
0 голосов
/ 01 февраля 2019

У меня есть модальный Bootstrap с выпадающим списком select2 внутри:

<div class="modal fade" id="modal_form" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            ...
            <div class="form-group">
                 <label class="control-label col-md-3">Artist</label>
                 <div class="col-md-9">
                    <select name="artist" class="form-control" id="dropartist"></select>
                    <span class="help-block"></span>
                </div>
            </div>

функция при вызове bootrap для установки выпадающего меню:

$('#modal_form').on('shown.bs.modal', function () {
  console.log("OK");
  $.ajax({
    type: "POST",
    //data: {dropartist: dropartist},
    url: 'Manage/get_artists',
    dataType: 'json',
    success: function(response) {
      var $el = $("#dropartist");
      $el.empty(); // remove old options
      var len = response.length;
      for( var i = 0; i<len; i++){

        var id = response[i]['id'];
        var name = response[i]['name'];

        $el.append("<option value='"+id+"'>"+name+"</option>");
      }
    }
  });
});

Функция для загрузки данных в Bootstrap:

function edit(id){
  save_method = 'update';
  $('#form')[0].reset(); // reset form on modals
  $('.form-group').removeClass('has-error'); // clear error class
  $('.help-block').empty(); // clear error string    
  //Ajax Load data to modal
  $.ajax({
    url : "<?php echo base_url('Manage/edit')?>/" + id,
    type: "GET",
    dataType: "JSON",
    success: function(data)
    {

      $('[name="id"]').val(data.id);
      $('[name="name"]').val(data.name);
      $("#dropartist").val(data.artistid).trigger("change"); //select dropdown default 
      $('[name="reason"]').val(data.reason);
      $('#modal_form').modal('show'); // show bootstrap modal when complete loaded
      $('.modal-title').text('Edit Artist'); // Set title to Bootstrap modal title

    },
    error: function (jqXHR, textStatus, errorThrown)
    {
      alert('Error get data from ajax');
    }
  });
}

Я пытаюсь выбрать раскрывающийся список, но он не работает.Как мне решить эту проблему?Большое спасибо за ваше время и помощь в этом вопросе.

Ответы [ 2 ]

0 голосов
/ 03 февраля 2019

Исправлено, я получаю все выпадающее значение и выбираю правильное значение в моем php-контроллере и передаю bootrap модальный через ajax.Спасибо @KHansen за предложение.

0 голосов
/ 01 февраля 2019

Ваш выбор пуст и не имеет элементов для выбора.Поэтому прежде всего, когда вы хотите обновить выбор, вы должны вставить <options></options> и не устанавливать значение.Таким образом, в основном data.artistid (или другой var) должен содержать html-строку, подобную этой

<option value="value-1" selected="selected">Name</option>
<option value="value-2">Name</option>
<option value="value-3">Name</option>

Затем вам нужно изменить свой jQuery на

$("#dropartist").html(data.artistid);

После этого вы можете изменить выбранныйпункт.

...