Динамические выпадающие списки с использованием select2, json request и Laravel

Question

Я пытаюсь получить динамические выпадающие списки, работающие с Laravel и Select2. Есть два выпадающих списка; один для компаний, т. е. «компания2», и один для мест, принадлежащих этой компании, то есть «location2».

В течение жизни я не могу понять, как заставить «company2» выпустить событие, чтобы прочитать, что компании расположены, если он изменился! Что я делаю неправильно в разделе javascript этого кода! (все остальное работает)

Маршрут

Route::controller('api', 'ApiController'); 

Controller (ApiController)

public function getLocations($companyId) 
{ 
    return Location::where('company_id', $companyId)->lists('id', 'name'); 
} 

Пример вывода из адреса "API/локаций/7"

{"Yellowstone":"8"} 

View (форма открыта/закрыть раздел)

{!! Form::select('company_id', $companies, null, ['class' => 'company2 form-control']) !!} 
{!! Form::select('location_id', $locations, null, ['class' => 'location2 form-control']) !!} 

View (Javascript)

<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".company2").select2(); 
     $(".location2").select2(); 
    }); 

$(".company2").select2().on('change', function() { 
    var $company2 = $('.company2'); 
    $.ajax({ 
     url:"../api/locations/" + $company2.val(), 
     type:'GET', 
     success:function(data) { 
      var $location2 = $(".location2"); 
      $location2.empty(); 
      $.each(data, function(value, key) { 
       $location2.append($("<option></option>").attr("value", value).text(key)); 
      }); 
      $location2.select2(); 
     } 
    }); 
}).trigger('change'); 
</script> 

мнение передается список активных компаний при инициализации т.е.

$companies = Company::lists('trading_name', 'id'); 

Answer 1

Замените JavaScript с нижеследующим, возможно, потребуется изменить некоторые его , Пожалуйста, ознакомьтесь с комментариями.

var $company2 = $('.company2'); 
var $location2 = $(".location2"); 

$company2.select2().on('change', function() { 
    $.ajax({ 
     url:"../api/locations/" + $company2.val(), // if you say $(this) here it will refer to the ajax call not $('.company2') 
     type:'GET', 
     success:function(data) { 
      $location2.empty(); 
      $.each(data, function(value, key) { 
       $location2.append($("<option></option>").attr("value", value).text(key)); // name refers to the objects value when you do you ->lists('name', 'id') in laravel 
      }); 
      $location2.select2(); //reload the list and select the first option 
     } 
    }); 
}).trigger('change'); 

Измените следующие, когда вы захватить данные о местоположении от контроллера

public function getLocations($companyId) 
{ 
    return Location::where('company_id', $companyId)->lists('name', 'id'); 
} 

Answer 2

вы можете попробовать это:

$.getJSON("getOptions.php", function (json) { 
     $("#inputs").select2({ 
     data: json, 
     width: "180px" 
     }); 
}); 

пример вывода JSon:

{id:0,text:"Text 1"}, 
    {id:1,text:"Text 2"}, 
    {id:2,text:"Text 3"}, 
    {id:3,text:"Text 4"}, 
    {id:4,text:"Text 5"}