feat: create edit modal & change NIK To Input Nik

main-dlh
Regiaaaaaa 2025-11-24 15:33:40 +07:00
parent f352792d11
commit 8ddaf32993
2 changed files with 83 additions and 6 deletions

View File

@ -37,7 +37,7 @@ namespace BpsRwApp.Controllers
<button data-id='{index + 1}' class='btn btn-sm rounded-full bg-white btn-detail-rumah'>Detail</button>
<button class='btn btn-sm rounded-full bg-white btn-edit-rumah'>Edit</button>
{(status == "Aktif"
? "<button class='btn btn-sm btn-warning btn-soft rounded-full btn-input-nik'>NIK</button>"
? "<button class='btn btn-sm btn-warning btn-soft rounded-full btn-input-nik'>Input Nik</button>"
: "")}
</div>"
};

View File

@ -167,11 +167,14 @@
<input name="nik" id="nik" class="input w-full" placeholder="Masukkan NIK" />
</fieldset>
</div>
<div class="col-span-3 flex items-end">
<button type="button" id="btn-cek-data" class="btn btn-primary w-full h-12 rounded-full text-white">
<span class="icon icon-fill me-1">save</span>
Cek Data
</button>
<div class="col-span-3">
<fieldset class="fieldset">
<legend class="fieldset-legend opacity-0">.</legend>
<button type="button" id="btn-cek-data" class="btn btn-info w-full rounded-full text-white">
<span class="icon icon-fill me-1">search</span>
Cek Data
</button>
</fieldset>
</div>
</div>
<div class="grid grid-cols-2 gap-4">
@ -242,6 +245,45 @@
</div>
</dialog>
<!-- Edit Modal -->
<dialog id="modal_edit" class="modal modal-bottom sm:modal-middle">
<div class="modal-box w-full sm:max-w-lg">
<div class="flex items-start justify-between">
<div>
<h3 class="text-lg font-semibold">Edit Rumah</h3>
<p class="text-sm text-gray-500">Perbarui informasi rumah sebelum menyimpan.</p>
</div>
<form method="dialog">
<button type="submit" class="btn btn-sm btn-circle btn-ghost">✕</button>
</form>
</div>
<form id="form-edit-rumah" class="space-y-4 mt-6">
<fieldset class="fieldset">
<legend class="fieldset-legend">No RT</legend>
<input id="edit-rt" name="rt" type="text" class="input w-full" placeholder="Masukkan No RT" />
</fieldset>
<fieldset class="fieldset">
<legend class="fieldset-legend">Nama Pemilik Rumah</legend>
<input id="edit-nama-pemilik" name="nama_pemilik" type="text" class="input w-full" placeholder="Masukkan nama pemilik rumah" />
</fieldset>
<fieldset class="fieldset">
<legend class="fieldset-legend">Alamat</legend>
<textarea id="edit-alamat" name="alamat" class="textarea w-full" rows="4" placeholder="Masukkan alamat"></textarea>
</fieldset>
<div class="modal-action">
<button type="button" class="btn rounded-full" onclick="modal_edit.close()">
<span class="icon me-1">cancel</span>
Batal
</button>
<button id="BtnUpdateRumahRw" type="submit" class="btn btn-primary rounded-full text-white">
<span class="icon me-1">save</span>
Simpan Perubahan
</button>
</div>
</form>
</div>
</dialog>
<script src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script src="https://cdn.datatables.net/2.3.4/js/dataTables.js"></script>
<script src="/plugins/datatables/dataTables.tailwindcss.js"></script>
@ -294,6 +336,14 @@
modal_input_nik.showModal();
});
$('#example tbody').on('click', '.btn-edit-rumah', function () {
let row = table.row($(this).closest('tr')).data();
$('#edit-rt').val(row.rt);
$('#edit-nama-pemilik').val(row.nama_pemilik);
$('#edit-alamat').val(row.alamat);
modal_edit.showModal();
});
$('#BtnSimpanRumahRw').on('click', function (e) {
e.preventDefault();
@ -321,6 +371,33 @@
});
});
$('#BtnUpdateRumahRw').on('click', function (e) {
e.preventDefault();
modal_edit.close();
Swal.fire({
title: 'Simpan Perubahan?',
text: "Pastikan semua data sudah benar.",
icon: 'question',
showCancelButton: true,
confirmButtonColor: '#22c55e',
cancelButtonColor: '#6b7280',
confirmButtonText: 'Simpan',
cancelButtonText: 'Batal'
}).then((result) => {
if (result.isConfirmed) {
Swal.fire({
title: 'Berhasil!',
text: 'Data Rumah berhasil diperbarui.',
icon: 'success',
confirmButtonText: 'OK',
confirmButtonColor: '#22c55e'
});
}
});
});
$('#BtnSimpanNik').on('click', function (e) {
e.preventDefault();