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

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

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

маршрут

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

пример вывода из адреса "api / locations / 7"

{"Yellowstone":"8"}

вид (форма открыть/закрыть раздел опущен)

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

Просмотр (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');
9
javascript jquery-select2 laravel laravel-5 php

2 ответов

замените 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');
}
8

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

$.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"}
1