Add support for multiple detail sertifikat
Enhanced the request validation, model, and Blade template to support multiple detail sertifikat entries, which are now encoded in JSON format. Additionally, added a dynamic form for entry, including delete functionality for each sertifikat entry.
This commit is contained in:
@@ -63,6 +63,7 @@
|
||||
public function update(PemilikJaminanRequest $request, $id, $pemilik)
|
||||
{
|
||||
$validate = $request->validated();
|
||||
|
||||
if ($validate) {
|
||||
try {
|
||||
$pemilik = PemilikJaminan::find($pemilik);
|
||||
@@ -88,6 +89,7 @@
|
||||
$districts = District::where('city_code', $pemilik->city_code)->get();
|
||||
$villages = Village::where('district_code', $pemilik->district_code)->get();
|
||||
$hubunganPemilik = HubunganPemilikJaminan::all();
|
||||
$detailSertifikat = $pemilik->detail_sertifikat;
|
||||
|
||||
return view(
|
||||
'lpj::pemilik_jaminan.form',
|
||||
@@ -99,6 +101,7 @@
|
||||
'villages',
|
||||
'hubunganPemilik',
|
||||
'pemilik',
|
||||
'detailSertifikat'
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@@ -26,6 +26,7 @@
|
||||
'address' => 'nullable|string',
|
||||
'postal_code' => 'nullable|string|max:10',
|
||||
'status' => 'nullable|boolean',
|
||||
'detail_sertifikat' => 'nullable|string|max:255',
|
||||
];
|
||||
|
||||
//$rules['nomor_id'] = 'nullable|max:16|unique:pemilik_jaminan,nomor_id,debiture_id,' . $this->debiture_id;
|
||||
@@ -41,4 +42,26 @@
|
||||
{
|
||||
return true;
|
||||
}
|
||||
|
||||
public function prepareForValidation() {
|
||||
|
||||
$detailSertifikat = [];
|
||||
$names = $this->input('detail_sertifikat.name', []);
|
||||
$nomorIds = $this->input('detail_sertifikat.nomor_id', []);
|
||||
|
||||
foreach ($names as $index => $name) {
|
||||
if (isset($nomorIds[$index])) {
|
||||
$detailSertifikat[] = [
|
||||
'name' => $name,
|
||||
'nomor_id' => $nomorIds[$index]
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
$this->merge([
|
||||
'detail_sertifikat' => json_encode($detailSertifikat),
|
||||
]);
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@@ -30,7 +30,8 @@ class PemilikJaminan extends Base
|
||||
'status',
|
||||
'authorized_at',
|
||||
'authorized_status',
|
||||
'authorized_by'
|
||||
'authorized_by',
|
||||
'detail_sertifikat',
|
||||
];
|
||||
|
||||
public function province()
|
||||
|
||||
@@ -79,7 +79,7 @@
|
||||
@enderror
|
||||
</div>
|
||||
<div class="flex flex-wrap items-baseline w-full">
|
||||
<input class="input @error('nomor_id') border-danger bg-danger-light @enderror" type="number" name="nomor_id" value="{{ $debitur->nomor_id ?? '' }}" placeholder="Nomor ID/KTP">
|
||||
<input class="input @error('nomor_id') border-danger bg-danger-light @enderror" type="number" name="nomor_id" value="{{ $pemilik->nomor_id ?? '' }}" placeholder="Nomor ID/KTP">
|
||||
@error('nomor_id')
|
||||
<em class="alert text-danger text-sm">{{ $message }}</em>
|
||||
@enderror
|
||||
@@ -88,8 +88,29 @@
|
||||
</div>
|
||||
</div>
|
||||
<div id="nama_sertifikat">
|
||||
@if(isset($detailSertifikat))
|
||||
@foreach(json_decode($detailSertifikat) as $sertifikat)
|
||||
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 mb-5">
|
||||
<label class="form-label max-w-56">
|
||||
Nama Lengkap
|
||||
</label>
|
||||
<div class="flex flex-wrap items-baseline w-full">
|
||||
<div class="flex flex-col lg:flex-row gap-2 w-full">
|
||||
<div class="flex flex-wrap items-baseline w-full">
|
||||
<input class="input" type="text" id="name" name="detail_sertifikat[name][]" value="{{ $sertifikat->name }}" placeholder="Nama Pemilik Jaminan">
|
||||
|
||||
</div>
|
||||
<div class="flex flex-wrap items-baseline w-full">
|
||||
<input class="input" type="number" name="detail_sertifikat[nomor_id][]" value="{{ $sertifikat->nomor_id }}" placeholder="Nomor ID/KTP">
|
||||
|
||||
</div>
|
||||
<button type="button" class="btn btn-danger btn-xs delete-button">Hapus</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
@endif
|
||||
</div>
|
||||
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||
<label class="form-label max-w-56">
|
||||
|
||||
@@ -253,41 +274,46 @@
|
||||
</div>
|
||||
@endsection
|
||||
|
||||
|
||||
@push('scripts')
|
||||
<script>
|
||||
document.getElementById('tambah_sertifikat').addEventListener('click', function() {
|
||||
const namaSertifikatDiv = document.getElementById('nama_sertifikat');
|
||||
const newDiv = document.createElement('div');
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
const namaSertifikatDiv = document.getElementById("nama_sertifikat");
|
||||
|
||||
// Function to add delete event listeners to existing buttons
|
||||
function addDeleteListeners() {
|
||||
document.querySelectorAll(".delete-button").forEach(button => {
|
||||
button.addEventListener("click", function() {
|
||||
this.closest(".flex.items-baseline.flex-wrap.lg\\:flex-nowrap.gap-2\\.5.mb-5").remove();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Add delete listeners to existing buttons
|
||||
addDeleteListeners();
|
||||
|
||||
document.getElementById("tambah_sertifikat").addEventListener("click", function() {
|
||||
const newDiv = document.createElement("div");
|
||||
newDiv.className = "flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 mb-5";
|
||||
newDiv.innerHTML = `
|
||||
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 mb-5">
|
||||
<label class="form-label max-w-56">
|
||||
Nama Lengkap
|
||||
</label>
|
||||
<div class="flex flex-wrap items-baseline w-full">
|
||||
<div class="flex flex-col lg:flex-row gap-2 w-full">
|
||||
<div class="flex flex-wrap items-baseline w-full">
|
||||
<input class="input @error('name') border-danger bg-danger-light @enderror" type="text" id="name" name="name[]" value="" placeholder="Nama Pemilik Jaminan">
|
||||
@error('name')
|
||||
<em class="alert text-danger text-sm">{{ $message }}</em>
|
||||
@enderror
|
||||
<input class="input" type="text" name="detail_sertifikat[name][]" value="" placeholder="Nama Pemilik Jaminan">
|
||||
</div>
|
||||
<div class="flex flex-wrap items-baseline w-full">
|
||||
<input class="input @error('nomor_id') border-danger bg-danger-light @enderror" type="number" name="nomor_id[]" value="" placeholder="Nomor ID/KTP">
|
||||
@error('nomor_id')
|
||||
<em class="alert text-danger text-sm">{{ $message }}</em>
|
||||
@enderror
|
||||
<input class="input" type="number" name="detail_sertifikat[nomor_id][]" value="" placeholder="Nomor ID/KTP">
|
||||
</div>
|
||||
<button type="button" class="btn btn-danger btn-xs delete-button">Hapus</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
namaSertifikatDiv.appendChild(newDiv);
|
||||
|
||||
// Event listener untuk tombol hapus
|
||||
newDiv.querySelector('.delete-button').addEventListener('click', function() {
|
||||
namaSertifikatDiv.removeChild(newDiv);
|
||||
// Add delete listener to the new button
|
||||
addDeleteListeners();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user