I'm attempting to create a dynamic dropdown but unfortunately, no data is being populated on the second dropdown. I have followed this tutorial.
My setup so far:
Initial dropdown:
{!! Form::select('Specialisms', $specialisms, null,
['class' => 'form-control selectpicker', 'name' => 'specialisms',
'data-notblank' => 'true', 'required' => 'required']) !!}
Second dropdown:
<select id="treatments" class="form-control selectpicker" name="treatments[]"
data-live-search="true" required="required" multiple="multiple">
<option value=""></option>
</select>
Route to return the 'treatments' data':
Route::get('/treatments', function () {
$specialism_id = Input::get('specialisms');
$treatments = Treatment::where('specialism_id', $specialism_id)
->pluck('treatment', 'id');
return $treatments;
})->name('getTreatments');
Observation - On the code above, I'm unsure how `Input::get('specialisms') will return the ID from the first dropdown?
Javascript to tie it all together:
$(document).ready(function ($) {
$('#specialism').change(function () {
$.get("",
{option: $(this).val()},
function (data) {
var model = $('#treatments');
model.empty();
$.each(data, function (index, element) {
model.append("<option value='" +
element.id + "'>" + element.name + "</option>");
});
});
});
});
Nothing at all is being populated in the second dropdown and I'm unsure why. Debugging Ajax is most certainly not my strong point either. Many thanks in advance.
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire