Fix: Bug AJAX in shop blade

This commit is contained in:
sayasilvi 2026-03-07 23:45:57 +07:00
parent b0798cc569
commit 7a9569e429
2 changed files with 73 additions and 26 deletions

View File

@ -45,16 +45,24 @@ public function shop(Request $request)
// --- FILTER LOKASI ---
if ($request->filled('provinsi')) {
$query->where('provinsi_code', $request->provinsi);
$query->whereHas('petani', function($q) use ($request) {
$q->where('provinsi_code', $request->provinsi);
});
}
if ($request->filled('kota')) {
$query->where('kota_code', $request->kota);
$query->whereHas('petani', function($q) use ($request) {
$q->where('kota_code', $request->kota);
});
}
if ($request->filled('kecamatan')) {
$query->where('kecamatan_code', $request->kecamatan);
$query->whereHas('petani', function($q) use ($request) {
$q->where('kecamatan_code', $request->kecamatan);
});
}
if ($request->filled('desa')) {
$query->where('desa_code', $request->desa);
$query->whereHas('petani', function($q) use ($request) {
$q->where('desa_code', $request->desa);
});
}
// Filter Search

View File

@ -132,7 +132,6 @@ class="d-flex justify-content-between align-items-center text-decoration-none {{
<div class="d-flex align-items-center">
<label class="small text-muted me-2 text-nowrap">Urutkan:</label>
<form id="sortForm" action="{{ route('shop') }}" method="GET">
{{-- Pertahankan query lain (search/kategori) saat sorting --}}
@foreach(request()->except('sort') as $key => $value)
<input type="hidden" name="{{ $key }}" value="{{ $value }}">
@endforeach
@ -226,30 +225,70 @@ class="card-img-top w-100 h-100" alt="{{ $produk->nama_produk }}"
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>
$(document).ready(function() {
function setupCascading(source, target, routeName, placeholder) {
$(source).on('change', function() {
let code = $(this).val();
$(target).html('<option value="">Memuat...</option>').prop('disabled', true);
if(target === '#filter_kota') {
$('#filter_kecamatan, #filter_desa').html('<option value="">Semua...</option>').prop('disabled', true);
}
function setupCascading(source, target, routeName, placeholder) {
$(source).on('change', function() {
let code = $(this).val();
$(target).html('<option value="">Memuat...</option>').prop('disabled', true);
if(target === '#filter_kota') {
$('#filter_kecamatan, #filter_desa').html('<option value="">Semua...</option>').prop('disabled', true);
} else if(target === '#filter_kecamatan') {
$('#filter_desa').html('<option value="">Semua...</option>').prop('disabled', true);
}
if (code) {
$.post("{{ url('/') }}/" + routeName, {code: code, _token: '{{ csrf_token() }}'}, function(data) {
$(target).html('<option value="">' + placeholder + '</option>').prop('disabled', false);
$.each(data, function(key, val) {
$(target).append(`<option value="${val.code}">${val.name}</option>`);
if (code) {
$.post("{{ url('/') }}/" + routeName, {code: code, _token: '{{ csrf_token() }}'}, function(data) {
$(target).html('<option value="">' + placeholder + '</option>').prop('disabled', false);
$.each(data, function(key, val) {
$(target).append(`<option value="${val.code}">${val.name}</option>`);
});
});
});
}
});
}
}
});
}
setupCascading('#filter_provinsi', '#filter_kota', 'get-kota', 'Semua Kota');
setupCascading('#filter_kota', '#filter_kecamatan', 'get-kecamatan', 'Semua Kecamatan');
setupCascading('#filter_kecamatan', '#filter_desa', 'get-desa', 'Semua Desa');
});
setupCascading('#filter_provinsi', '#filter_kota', 'get-kota', 'Semua Kota');
setupCascading('#filter_kota', '#filter_kecamatan', 'get-kecamatan', 'Semua Kecamatan');
setupCascading('#filter_kecamatan', '#filter_desa', 'get-desa', 'Semua Desa');
let oldProv = "{{ request('provinsi') }}";
let oldKota = "{{ request('kota') }}";
let oldKec = "{{ request('kecamatan') }}";
let oldDesa = "{{ request('desa') }}";
if (oldProv) {
$('#filter_kota').html('<option value="">Memuat...</option>').prop('disabled', true);
$.post("{{ url('/') }}/get-kota", {code: oldProv, _token: '{{ csrf_token() }}'}, function(data) {
$('#filter_kota').html('<option value="">Semua Kota</option>').prop('disabled', false);
$.each(data, function(key, val) {
let selected = (val.code == oldKota) ? 'selected' : '';
$('#filter_kota').append(`<option value="${val.code}" ${selected}>${val.name}</option>`);
});
if (oldKota) {
$('#filter_kecamatan').html('<option value="">Memuat...</option>').prop('disabled', true);
$.post("{{ url('/') }}/get-kecamatan", {code: oldKota, _token: '{{ csrf_token() }}'}, function(data) {
$('#filter_kecamatan').html('<option value="">Semua Kecamatan</option>').prop('disabled', false);
$.each(data, function(key, val) {
let selected = (val.code == oldKec) ? 'selected' : '';
$('#filter_kecamatan').append(`<option value="${val.code}" ${selected}>${val.name}</option>`);
});
if (oldKec) {
$('#filter_desa').html('<option value="">Memuat...</option>').prop('disabled', true);
$.post("{{ url('/') }}/get-desa", {code: oldKec, _token: '{{ csrf_token() }}'}, function(data) {
$('#filter_desa').html('<option value="">Semua Desa</option>').prop('disabled', false);
$.each(data, function(key, val) {
let selected = (val.code == oldDesa) ? 'selected' : '';
$('#filter_desa').append(`<option value="${val.code}" ${selected}>${val.name}</option>`);
});
});
}
});
}
});
}
});
</script>
<style>