I am using laravel. Inside this project I have two dropdown list which one is province and when I click the district dropdown should be filled from database according to the selected province.
I used new full jquery 3.2 in my project but $.get function does not send the request to server.
here is the route:
Route::get('/ajax-subcat',function(){
$cat_id=Input::get('cat_id');
$subcategories = \App\District::where('provinceID','=',$cat_id)->get();
return Response::json($subcategories);
})
here is the code
@extends('layout.master')
@section('content')
<div class="container">
<div class="row">
<div class="col-md-10 col-md-offset-1">
<form class="form-horizontal" role="form" method="POST" action="/registerCompany">
<div class="form-group">
<label for="provinces" class="col-md-4 control-label">Province</label>
<div class="col-md-6">
<select name="provinces" id="provinces" class="form-control">
<option disable selected value>Select Province</option>
@foreach($p as $pr)
<option value=""></option>
@endforeach
</select>
</div>
<label for="districts" class="col-md-4 control-label">District</label>
<div class="col-md-6">
<select class="form-control" name="districts" id="districts">
</select>
</div>
</div>
<div class="form-group">
<div class="col-md-6 col-md-offset-4">
<button type="submit" class="btn btn-primary">Register</button>
</div>
</div>
</form>
</div>
</div>
</div>
<meta name="_token" content="{!! csrf_token() !!}" />
<script src="http://ift.tt/1LdO4RA"></script>
<script src="http://ift.tt/1jAc4pg"></script>
<script>
$(document).ready(function(){
$('#provinces').change(function(e){
console.log(e);
var provinceID = e.target.value;
//ajax
$.get('/ajax-subcat?cat_id='+provinceID, function(data){
//$('#districts').empty();
//success data
$.each(data, function(index, subcatObj){
$('#districts').append('<option value="ali">ali</option>');
});
});
});
});
</script>
@endsection
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire