menampilkan harga berdasarkan jenis kendaraan dan jasa/pekerjaan dengan laravel

selamat malam...

mohon bantuan nya agan2 sekalian.... saya sudah utak atik tapi belum berhasil juga. saya ingin menampilkan harga berdasarkan jenis kendaraan dan jasa/pekerjaan...

dimana saya sudah berhasil menampilkan jasa/pekerjaan berdasarkan jenis kendaraan yang dipilih, namun masih gagal/belum berhasil menampilkan harga berdasarkan jenis kendaraan dan jasa/pekerjaan yang dipilih.

1.Tampilan Form

1.png

2. Tabel Database

2.png

3. Route

Route::get('createtransaksi', [TransaksiController::class, 'createtransaksi'])->name('transaksi.input');

Route::get('fetch/{id}', [TransaksiController::class, 'fetch'])->name('fetch');

4. Controller

public function createtransaksi()

{

$jenis = DB::table('jenis')->pluck("jnskend","id");

return view('transaksi.input',compact('jenis'));

}

public function fetch($id)

{

$jasas = DB::table("jasas")->where("id_jns_kend",$id)->pluck("jasa","id");

return json_encode($jasas);

}

5. Tampilan Form/View

<div class="form-group">

<label for="idtipe">Jenis Kendaraan</label>

<select class="form-control form-control-lg" name="idtipe">

<option value="" selected>-- Pilih Jenis Kendaraan --</option>

@foreach ($jenis as $key => $value)

<option value="{{ $key }}">{{ $value }}</option>

@endforeach

</select>

</div>

<div class="form-group">

<label for="idpekerjaan">Jasa/Pekerjaan</label>

<select class="form-control form-control-lg"name="idpekerjaan">

<option value="" selected>-- Pilih Jasa / Pekerjaan --</option>

</select>

</div>

<div class="form-group">

<label for="harga">Harga</label>

<input type="text" class="form-control" name="harga" readonly>

</div>

6. Ajax Jquery

<script type="text/javascript">

jQuery(document).ready(function ()

{

jQuery('select[name="idtipe"]').on('change',function(){

var idtipe = jQuery(this).val();

if(idtipe)

{

jQuery.ajax({

url : 'fetch/' +idtipe,

type : "GET",

dataType : "json",

success:function(data)

{

console.log(data);

jQuery('select[name="idpekerjaan"]').empty();

jQuery.each(data, function(key,value){

$('select[name="idpekerjaan"]').append('<option value="'+ key +'">'+ value +'</option>');

});

}

});

}

else

{

$('select[name="idpekerjaan"]').empty();

}

});

});

</script>