Postingan lainnya
dynamic select drop down Laravel 5.3
saya ingin membua dynamic select drop down di laravel 5.3 tetapi gagal,tidak muncul error tetapi ketika category dipilih subcategory nya gak muncul. mohon bantuannya.
ini adalah code dari view saya
{{ Form::open(['url' => 'foo/bar', 'files' => true]) }}
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<div class="form-group">
<label class="sr-only">Categories</label>
<select class="form-control input-sm" name="category" id="category">
@foreach( $categories as $data )
<option value="{{ $data->id }}"> {{ $data->name }}</option>
@endforeach
</select>
</div>
<div class="form-group">
<label class="sr-only">Subcategories</label>
<select class="form-control input-sm" name="subcategory" id="subcategory">
<option value=""></option>
</select>
</div>
{{ Form::close() }}
ini adalah JS saya
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script language="JavaScript" type="text/JavaScript">
$('#category').on('change', function(e){
console.log(e);
var cat_id = e.target.value;
//ajax
$.get('/ajax-subcat/' + cat_id, function(data){
$('#subcategory').empty();
$.each(data, function(index, subcatObj){
$('#subcategory').append('<option value="'+subcatObj.id+'">'+subcatObj.name+'</option>');
});
});
});
</script>
ini adalah route saya
Route::get('/', function () {
$all = new Category;
$categories = $all->get();
return view('index', compact('categories'));
});
Route::put('/ajax-subcat/{id}', 'HomeController@ajax');
ini adalah Controller saya dan saya
public function ajax(Request $request, $id)
{
$all = new Subcategory;
$subcategories = $all->where('category_id', $id)->first();
return response()->json($subcategories);
}
ini adalah migration Category
public function up()
{
Schema::create('categories', function (Blueprint $table) {
$table->increments('id');
$table->string('name');
$table->timestamps();
});
}
dan ini adalah migration Subcategory
public function up()
{
Schema::create('subcategories', function (Blueprint $table) {
$table->increments('id');
$table->string('name');
$table->integer('category_id')->unsigned();
$table->timestamps();
$table->foreign('category_id')->references('id')->on('categories');
});
}
4 Jawaban:
coba route.php ganti put jadi get
Route::get('/ajax-subcat/{id}', 'HomeController@ajax');
dan pada controller
public function ajax(Request $request, $id)
{
$all = new Subcategory();
$subcategories = $all->where('category_id', $id)->get();
return response()->json($subcategories);
}
pada controller ->first jadi ->get, karna pada ajax di view menggunakan looping untuk option select, sedangkan jika pada controller ->first() data hanya row [1 row] jika get result array [] (maka bisa di looping)
semoga membantu..
Coba di ganti Ajax seperti ini gan......
<script language="JavaScript" type="text/JavaScript">
$('#category').on('change', function(e){
console.log(e);
var cat_id = e.target.value;
//ajax
$.get('/ajax-subcat?cat_id=' + cat_id, function(data){ // Ganti bagian ini......
$('#subcategory').empty();
$.each(data, function(index, subcatObj){
$('#subcategory').append('<option value="'+subcatObj.id+'">'+subcatObj.name+'</option>');
});
});
});
</script>
Route Ganti seperti ini......
Route::get('/ajax-subcat', 'HomeController@ajax'); // Tanpa {id}
Controller Ganti Seperti ini.......
use Illuminate\Support\Facades\Input;
use App\Subcategory; // Sesuaikan dg nama Model Subcategory
public function ajax() // Tanpa (Request $request, $id)
{
$cat_id = Input::get('cat_id');
$subcategories = Subcategory::where('category_id', $cat_id)->get(); // Sesuaikan dg nama Model Subcategory
return Response::json($subcategories);
}
Silahkan di coba , semoga bisa teratasi ....
di inspect > console muncul tulisan seperti ini
jquery.min.js:4 GET http://localhost/Percobaan/public/ajax-subcat?cat_id=2 401 (Unauthorized)
maksud nya apa ya ?? mohon bantuannya
Coba cek JQuerynya gan udh ke Load atau blm sekalian sama response dr controllernya, atau kalau Ada TeamViewer, biar saya coba bantu cek