pembuatan basic data surveyor

resources/views/surveyor/components/form-inspeksi.blade.php

@@ -3,7 +3,7 @@
 @endpush
 
 
-<form action="{{ isset($debitur->id) ? route('debitur.update', $debitur->id) : route('debitur.store') }}" method="POST"
+<form  id="debiturForm" action="{{ isset($debitur->id) ? route('debitur.update', $debitur->id) : route('debitur.store') }}" method="POST"
     class="grid gap-5">
     @if (isset($debitur->id))
         <input type="hidden" name="id" value="{{ $debitur->id }}">
@@ -478,6 +478,15 @@
         </div>
     </div>
 
+    <div class="flex justify-end gap-2" style="margin-right: 20px; margin-top: 20px">
+        <button type="submit" class="btn btn-success">
+            Save
+        </button>
+        <button type="submit" class="btn btn-primary">
+            Submit
+        </button>
+    </div>
+
 </form>
 
 
@@ -521,4 +530,71 @@
     window.onload = getUserLocation;
 </script>
 
+<script>
+    // Fungsi untuk menyimpan data ke localStorage saat ada perubahan input
+
+
+    const formElement = document.getElementById('debiturForm');
+
+    // Mengambil nilai dari localStorage saat halaman dimuat
+    window.onload = () => {
+        const storedData = localStorage.getItem('debiturData');
+        if (storedData) {
+            const formData = JSON.parse(storedData);
+            // Mengisi nilai untuk elemen select
+            for (const [key, value] of Object.entries(formData)) {
+                const inputElement = formElement.querySelector(`[name="${key}"]`);
+                if (inputElement) {
+                    if (inputElement.tagName === 'SELECT') {
+                        inputElement.value = value; // Atur nilai select
+                    } else if (inputElement.type === 'radio') {
+                        const radioButton = document.getElementById(`${key}${value.charAt(0).toUpperCase() + value.slice(1)}`);
+                        if (radioButton) {
+                            radioButton.checked = true; // Atur radio button yang sesuai sebagai checked
+                        }
+                    }
+                }
+            }
+        }
+    };
+
+    // Simpan data ke localStorage dalam bentuk JSON
+    formElement.addEventListener('change', () => {
+        const formData = {};
+        const inputs = formElement.querySelectorAll('input, select');
+
+        inputs.forEach(input => {
+            if (input.type === 'radio' && input.checked) {
+                formData[input.name] = input.value; // Hanya ambil nilai radio yang terpilih
+            } else if (input.type !== 'radio') {
+                formData[input.name] = input.value; // Ambil nilai dari elemen lain
+            }
+        });
+
+        localStorage.setItem('debiturData', JSON.stringify(formData)); // Simpan objek sebagai JSON
+    });
+
+    // Opsi: Reset localStorage saat form disubmit
+    formElement.onsubmit = () => {
+        localStorage.removeItem('debiturData'); // Menghapus data spesifik dari localStorage
+    };
+
+
+    // Opsi: Reset localStorage saat form disubmit
+    document.getElementById('debiturForm').onsubmit = (event) => {
+        event.preventDefault(); // Mencegah pengiriman form
+
+        // Menyimpan semua input ke localStorage
+        inputs.forEach(input => {
+            localStorage.setItem(input.name, input.value);
+        });
+
+        // Opsional: Tampilkan pesan bahwa data telah disimpan
+        alert('Data telah disimpan ke localStorage!');
+
+        // Jika ingin menghapus localStorage, uncomment baris di bawah
+        // localStorage.clear();
+    };
+</script>
+
 @endpush