Laravel dropdown list - php

Question

I'm using Laravel framework and i have two dropdown lists of which both are reading data from the database tables,
the first one it read all the records from the table and populate it on the select list
here is my code:
<div class="form-group">
{{Form::select('advertiserName', Advertiser::all()->lists('advertiserName', 'advertiserId'))}}
</div>
it display the advertiser name and also passes the id on the advertiser.
The second dropdown i want it to display all the Brands related to the above selected advertiser.
here is my code:
<div class="form-group">
{{Form::select('brandName', Brand::where('advertiserId', '=', '3')->lists('brandName', 'id'))}}
</div>
The advertiserId is the foreign key of the advertiser and 3 must be replaced by the the advertiserId you selected on the first dropdown list, basically i want to pass variable from the first select list to the second one
Thank you

Answer 1

Basically you need to use AJAX to get data for Second Dropdown based on option selected from first dropdown.
Create Second Dropdown inside specific div and After ajax Call replace contect of div from ajax response.

Answer 2

As stated, the best way to achieve this is via an AJAX request. Here is an example of how you can achieve this functionality.
Firstly create a view partial that renders the select box for brands. Something like this (this code is based on Bootstrap 3):
{{ Form::label('brandName', 'Brand', ['class' => 'control-label col-sm-2']) }}
<div class="col-sm-10">
{{ Form::select('brandName', $brands, null, ['class' => 'form-control']) }}
</div>
Now, in your routes.php file add the following route:
Route::get('brand-list/{id}', ['as' => 'brands', 'uses' => 'BrandsController#brandList']);
In your BrandsController.php file (or whatever controller your using to handle this) add a method called brandList();
public function brandList($id)
{
// Return an array of brands for the selected advertiser name ID if available
$brands = $this->brand->where('advertiserId', $id)->lists('brandName', 'id'); // I'm using dependency injection here so you'll need to assign your Brand model to the $this->brand property of this classes constructor method
if ( ! isset($brands))
{
$brands = ['No brands available' => null]; // return a generic array containing 1 item with a value of null so you can handle it in your view. You could also return something else here such a boolean of false and then handle that in your AJAX request to return an error or info message
}
return View::make('brands.partials.select', compact('brands'));
}
Now for the AJAX:
$('#advertiserName').change(function(e) {
var advertiserId = $(this).val();
var url = '/brand-list/' + advertiserId;
$.get(url, function(data) {
$('.brands').html(data); // The returned view with the brand select input
});
});
Then in your initial form view you'll want to create an empty div with a class of .brands that we'll use to populate with the HTML returned via our AJAX request. Something like this if you're using Bootstrap 3 for example:
<div class="form-group brands"></div>
This should work as you need but I haven't tested this code, so if you have any issues let me know. Obviously this is generic code based on the info available and there are many ways to skin a cat.