Untitled
html
a month ago
57 kB
4
Indexable
Never
<div class="modal fade" id="editModal" data-bs-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true"> <style> .form-style { background-color: white !important; } .addstylemodal { background-color: whitesmoke; } .radio-inputsedit { position: relative; display: flex; flex-wrap: wrap; border-radius: 0.5rem; background-color: #EEE; box-sizing: border-box; box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.06); padding: 0.25rem; width: 300px; font-size: 14px; -webkit-user-select: none; /* Safari */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* IE10+/Edge */ user-select: none; /* Standard syntax */ } .radio-inputsedit .radio { flex: 1 1 auto; text-align: center; } .radio-inputsedit .radio input { display: none; } .radio-inputsedit .radio .name { display: flex; cursor: pointer; align-items: center; justify-content: center; border-radius: 0.5rem; border: none; padding: .5rem 0; color: rgba(51, 65, 85, 1); transition: all .15s ease-in-out; } #form1Abtnedit:checked+.name { background-color: #0acf97; color: white; font-weight: 600; } .form2Abtnedit:checked+.name { background-color: #4687ff !important; color: white !important; font-weight: 600 !important; } .form3Abtnedit:checked+.name { background-color: #ff6b6b; color: white; font-weight: 600; } /* */ #form1Aedit input[type="text"]:focus, #form1Aedit input[type="number"]:focus, #form1Aedit input[type="radio"]:focus, #form1Aedit select:focus, #form1Aedit textarea:focus { border: 1.8px solid #0acf97; color: black; } #form2Aedit input[type="text"]:focus, #form2Aedit input[type="number"]:focus, #form2Aedit select:focus, #form2Aedit textarea:focus { border: 1.8px solid #2c8ef8; color: black; } #form3Aedit input[type="text"]:focus, #form3Aedit input[type="number"]:focus, #form3Aedit select:focus, #form3Aedit textarea:focus { border: 1.8px solid #fa5c7c; color: black; } </style> <div class="modal-dialog modal-lg"> <div class="modal-content addstylemodal"> <div class="modal-header" style="flex-direction: column-reverse; border: none"> <img src="assets/images/logo2.png" alt="" height="70"> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-hidden="true"></button> </div> <div class="modal-body" style="text-transform: uppercase; color: black; font-size: 12px"> <div class="row justify-content-center"> <div class="radio-inputsedit"> <label class="radio"> <input type="radio" name="radioedit" class="form1Abtnedit" id="form1Abtnedit"> <span class="name" id="formname"></span> </label> <label class="radio"> <input type="radio" name="radioedit" class="form2Abtnedit" id="form2Abtnedit"> <span class="name" id="formname2a"></span> </label> <label class="radio"> <input type="radio" name="radioedit" class="form3Abtnedit" id="form3Abtnedit"> <span class="name" id="formname3a"></span> </label> </div> </div> <form action="" method="post" id="form1Aedit" class="needs-validation" novalidate> <input type="hidden" name="id" id="id"> <div class="row mt-3"> <div class="col-lg-4"> <div class="mb-1 position-relative" id="dateInputpickerupdate"> <label class="form-label">Date</label> <input type="text" data-date-autoclose="true" class="form-control" id="updatedateInput" name="updatedateInput" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#dateInputpickerupdate" required> </div> </div> <div class="col-lg-4"> <div class="mb-1"> <label for="pageNumberInput" class="form-label">Page Number</label> <input type="text" id="updatepageNumberInput" name="updatepageNumberInput" class="form-control" required> </div> </div> <div class="col-lg-4"> <div class="mb-1"> <label for="updatebookNumberInput" class="form-label">Book Number</label> <input type="text" id="updatebookNumberInput" name="updatebookNumberInput" class="form-control" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="updateregistryNumberInput" class="form-label">Registry Number</label> <input type="text" id="updateregistryNumberInput" name="updateregistryNumberInput" class="form-control" required> </div> </div> <div class="col-lg-6"> <div class="mb-1 position-relative" id="dateRegInputpickerupdate"> <label class="form-label">Date of Registration</label> <input type="text" data-date-autoclose="true" class="form-control" id="updateregistrationDateInput" name="updateregistrationDateInput" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#dateRegInputpickerupdate" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="updatechildNameInput" class="form-label">Name of Child</label> <input type="text" id="updatechildNameInput" name="updatechildNameInput" class="form-control" oninput="this.value = this.value.toUpperCase()" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="updatesexInput" class="form-label">Sex</label> <input type="text" id="updatesexInput" name="updatesexInput" class="form-control capslockview" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1 position-relative" id="dateBirInputpickerupdate"> <label class="form-label">Date of Birth</label> <input type="text" data-date-autoclose="true" class="form-control" id="updatebirthDateInput" name="updatebirthDateInput" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#dateBirInputpickerupdate" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="updatebirthPlaceInput" class="form-label">Place of Birth</label> <input type="text" id="updatebirthPlaceInput" name="updatebirthPlaceInput" onchange="handleChange()" class="form-control capslockview" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="updatemotherNameInput" class="form-label">Name of Mother</label> <input type="text" id="updatemotherNameInput" onchange="handleChange()" name="updatemotherNameInput" class="form-control capslockview" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="updatemotherCitizenshipInput" class="form-label">Citizenship of Mother</label> <input type="text" id="updatemotherCitizenshipInput" name="updatemotherCitizenshipInput" class="form-control capslockview" onchange="handleChange()" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="updatefatherNameInput" class="form-label">Name of Father</label> <input type="text" id="updatefatherNameInput" onchange="handleChange()" name="updatefatherNameInput" class="form-control capslockview" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="updatefatherCitizenshipInput" class="form-label">Citizenship of Father</label> <input type="text" id="updatefatherCitizenshipInput" onchange="handleChange()" name="updatefatherCitizenshipInput" class="form-control capslockview" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="updatemarriageDateInput" class="form-label">Parents Date of Marriage</label> <div class="dropdown"> <select id="updatemarriageDateInput" name="updatemarriageDateInput" class="form-select" required> <option value="Parents Date of Marriage" selected>Married </option> <option value="Not Married">Not Married</option> <option value="Not Applicable">Not Applicable</option> <option value="No Entry">No Entry</option> <option value="No Column">No Column</option> </select> <div class="row justify-content-center"> <div class="col-md-10"> <div class="mb-2 position-relative" id="updatemarriagedate" style="margin-top: 5px;"> <input type="text" data-date-autoclose="true" class="form-control" placeholder="Date of Marriage" id="updatemarriage" name="updatemarriage" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#updatemarriagedate" style="display: none;" required> </div> </div> </div> </div> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="updatemarriagePlaceInput" class="form-label">Place of Marriage of Parents</label> <input type="text" id="updatemarriagePlaceInput" onchange="handleChange()" name="updatemarriagePlaceInput" class="form-control capslockview" required> </div> </div> <script> </script> </div> <div class="row justify-content-center"> <div class="col-lg-6"> <div class="mb-1"> <label for="updateissued" class="form-label">Issued To</label> <input type="text" id="updateissued" name="updateissued" onchange="handleChange()" class="form-control capslockview" required> </div> </div> </div> <div class="row justify-content-center"> <div class="col-md-10"> <div class="mb-3"> <label for="updateremarksTextarea" class="form-label">Remarks</label> <textarea class="form-control" id="updateremarksTextarea" name="updateremarksTextarea" rows="3"></textarea> </div> </div> </div> <div class="row"> <div class="col-lg-4"> <div class="mb-1"> <label for="updateamountPaidInput" class="form-label">Amount Paid</label> <input type="text" id="updateamountPaidInput" name="updateamountPaidInput" class="form-control" required> </div> </div> <div class="col-lg-4"> <div class="mb-1"> <label for="updateorNumberInput" class="form-label">O.R. Number</label> <input type="text" id="updateorNumberInput" name="updateorNumberInput" class="form-control" required> </div> </div> <div class="col-lg-4"> <div class="mb-1 position-relative" id="datePaidInputpickerupdate"> <label class="form-label">Date Paid</label> <input type="text" data-date-autoclose="true" class="form-control" id="updatedatePaidInput" name="updatedatePaidInput" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#datePaidInputpickerupdate" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="updateverify" class="form-label">Verified By</label> <input type="text" id="updateverify" name="updateverify" oninput="this.value = this.value.toUpperCase()" class="form-control" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="updatemcr" class="form-label">Municipal Civil Registrar</label> <input type="text" id="updatemcr" name="updatemcr" oninput="this.value = this.value.toUpperCase()" class="form-control" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="updatedesignation" class="form-label">Designation</label> <div class="dropdown"> <select id="updatedesignation" name="updatedesignation" class="form-select" required> <option value="" selected disabled></option> <option value="Administrative Aide I">Administrative Aide I</option> <option value="Administrative Aide II">Administrative Aide II</option> <option value="Administrative Aide III">Administrative Aide III</option> <option value="Administrative Assistant I">Administrative Assistant I</option> <option value="Others">Others</option> </select> <div class="row justify-content-center"> <div class="col-md-10"> <input type="text" class="form-control" id="updatecustomInput" name="updatecustomInput" placeholder="Position" style="display: none; margin-top: 5px" /> </div> </div> </div> </div> </div> <div class="col-lg-6"> <div class="mt-3"> <p id="filefolder" style="font-family: monospace; text-align: center; font-size: 15px"> </p> </div> </div> </div> <div class="row justify-content-end" style="margin: 30px;"> <button class="buttonx" type="button" data-bs-dismiss="modal"> <i class="mdi mdi-cancel"></i> </button> <button class="button" type="submit"> Update → </button> <style> .buttonx { --font-color: #323232; --bg-color: #fff; --main-color: #323232; width: 50px; height: 40px; border-radius: 5px; border: 2px solid var(--main-color); background-color: var(--bg-color); box-shadow: 4px 4px var(--main-color); margin-right: 10px; font-size: 17px; font-weight: 600; color: var(--font-color); cursor: pointer; } .buttonx:focus { --bg-color: #fa5c7c; background-color: var(--bg-color); color: white; } .buttonx:hover { --bg-color: #fa5c7c; background-color: var(--bg-color); color: white; } .buttonx:active { box-shadow: 0px 0px var(--main-color); transform: translate(3px, 3px); } </style> <style> .button { --font-color: #323232; --bg-color: #fff; --main-color: #323232; width: 120px; height: 40px; border-radius: 5px; border: 2px solid var(--main-color); background-color: var(--bg-color); box-shadow: 4px 4px var(--main-color); font-size: 17px; font-weight: 600; color: var(--font-color); cursor: pointer; } .button:focus { --bg-color: #0acf97; background-color: var(--bg-color); color: white; } .button:hover { --bg-color: #0acf97; background-color: var(--bg-color); color: white; } .button:active { box-shadow: 0px 0px var(--main-color); transform: translate(3px, 3px); } </style> </div> </form> <!-- 2A EDIT --> <form action="" method="post" id="form2Aedit" class="needs-validation" novalidate> <input type="hidden" name="id2a" id="id2a" required> <div class="row mt-3"> <div class="col-lg-4"> <div class="mb-1 position-relative" id="2adateInputpickeredit"> <label class="form-label">Date</label> <input type="text" data-date-autoclose="true" class="form-control" id="2adateedit" name="2adateedit" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#2adateInputpickeredit" required> </div> </div> <div class="col-lg-4"> <div class="mb-1"> <label for="2apageedit" class="form-label">Page Number</label> <input type="number" id="2apageedit" name="2apageedit" class="form-control" required> </div> </div> <div class="col-lg-4"> <div class="mb-1"> <label for="2abookedit" class="form-label">Book Number</label> <input type="number" id="2abookedit" name="2abookedit" class="form-control" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="2aregistryedit" class="form-label">Registry Number</label> <input type="text" id="2aregistryedit" name="2aregistryedit" class="form-control" required> </div> </div> <div class="col-lg-6"> <div class="mb-1 position-relative" id="2adorInputpickeredit"> <label class="form-label">DATE OF REGISTRATION</label> <input type="text" data-date-autoclose="true" class="form-control" id="2adoredit" name="2adoredit" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#2adorInputpickeredit" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="2aNodedit" class="form-label">Name of Deceased</label> <input type="text" id="2aNodedit" name="2aNodedit" oninput="this.value = this.value.toUpperCase()" class="form-control" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="2aSexedit" class="form-label">Sex</label> <input type="text" id="2aSexedit" name="2aSexedit" class="form-control" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="2aAgeedit" class="form-label">Age</label> <input type="text" id="2aAgeedit" name="2aAgeedit" class="form-control" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="2aCSedit" class="form-label">Civil Status</label> <input type="text" id="2aCSedit" name="2aCSedit" class="form-control" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="2aCitiedit" class="form-label">Citizenship</label> <input type="text" id="2aCitiedit" name="2aCitiedit" class="form-control" required> </div> </div> <div class="col-lg-6"> <div class="mb-1 position-relative" id="2adobInputpickeredit"> <label class="form-label">Date of Death</label> <input type="text" data-date-autoclose="true" class="form-control" id="2adobedit" name="2adobedit" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#2adobInputpickeredit" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="2apodedit" class="form-label">Place of Death</label> <input type="text" id="2apodedit" name="2apodedit" class="form-control" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="2acodedit" class="form-label">Cause of Death</label> <input type="text" id="2acodedit" name="2acodedit" class="form-control" required> </div> </div> </div> <!-- new 2a--> <div class="row justify-content-center"> <div class="col-lg-6"> <div class="mb-1"> <label for="2aissuededit" class="form-label">Issued To</label> <input type="text" id="2aissuededit" name="2aissuededit" onchange="handleChange()" class="form-control capslockview" required> </div> </div> </div> <div class="row justify-content-center"> <div class="col-md-10"> <div class="mb-3"> <label for="2aremarksTextareaedit" class="form-label">Remarks</label> <textarea class="form-control" id="2aremarksTextareaedit" name="2aremarksTextareaedit" rows="3"></textarea> </div> </div> </div> <div class="row"> <div class="col-lg-4"> <div class="mb-1"> <label for="amountPaidInput2aedit" class="form-label">Amount Paid</label> <input type="text" id="amountPaidInput2aedit" name="amountPaidInput2aedit" class="form-control" required> </div> </div> <div class="col-lg-4"> <div class="mb-1"> <label for="2aorNumberInputedit" class="form-label">O.R. Number</label> <input type="text" id="2aorNumberInputedit" name="2aorNumberInputedit" class="form-control" required> </div> </div> <div class="col-lg-4"> <div class="mb-1 position-relative" id="2adatePaidInputpickeredit"> <label class="form-label">Date Paid</label> <input type="text" data-date-autoclose="true" class="form-control" id="2adatePaidInputedit" name="2adatePaidInputedit" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#2adatePaidInputpickeredit" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="2averifyedit" class="form-label">Verified By</label> <input type="text" id="2averifyedit" name="2averifyedit" value="<?php echo $userData['verified']; ?>" oninput="this.value = this.value.toUpperCase()" class="form-control" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="2amcredit" class="form-label">Municipal Civil Registrar</label> <input type="text" id="2amcredit" name="2amcredit" oninput="this.value = this.value.toUpperCase()" value="ISMAEL D. MALICDEM, JR." class="form-control" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="2adesignationedit" class="form-label">Designation</label> <div class="dropdown"> <select id="2adesignationedit" name="2adesignationedit" class="form-select" required> <option value="" selected disabled></option> <option value="Administrative Aide I">Administrative Aide I</option> <option value="Administrative Aide II">Administrative Aide II</option> <option value="Administrative Aide III">Administrative Aide III</option> <option value="Administrative Assistant I">Administrative Assistant I</option> <option value="Others">Others</option> </select> <div class="row justify-content-center"> <div class="col-md-10"> <input type="text" class="form-control" id="2acustomInputedit" name="2acustomInputedit" placeholder="Position" style="display: none; margin-top: 5px" /> </div> </div> </div> </div> </div> <div class="col-lg-6"> <div class="mt-3"> <p id="filefolder2a" style="font-family: monospace; text-align: center; font-size: 15px"></p> </div> </div> </div> <div class="row justify-content-end" style="margin: 30px;"> <button class="buttonx" type="button" data-bs-dismiss="modal"> <i class="mdi mdi-cancel"></i> </button> <button class="button" type="submit"> Update → </button> <style> .buttonx { --font-color: #323232; --bg-color: #fff; --main-color: #323232; width: 50px; height: 40px; border-radius: 5px; border: 2px solid var(--main-color); background-color: var(--bg-color); box-shadow: 4px 4px var(--main-color); font-size: 17px; margin-right: 10px; font-weight: 600; color: var(--font-color); cursor: pointer; } .buttonx:focus { --bg-color: #fa5c7c; background-color: var(--bg-color); color: white; } .buttonx:hover { --bg-color: #fa5c7c; background-color: var(--bg-color); color: white; } .buttonx:active { box-shadow: 0px 0px var(--main-color); transform: translate(3px, 3px); } </style> <style> .button { --font-color: #323232; --bg-color: #fff; --main-color: #323232; width: 120px; height: 40px; border-radius: 5px; border: 2px solid var(--main-color); background-color: var(--bg-color); box-shadow: 4px 4px var(--main-color); font-size: 17px; font-weight: 600; color: var(--font-color); cursor: pointer; } .button:focus { --bg-color: #0acf97; background-color: var(--bg-color); color: white; } .button:active { box-shadow: 0px 0px var(--main-color); transform: translate(3px, 3px); } </style> </div> </form> <!-- 3A FORM --> <form method="post" id="form3Aedit" class="needs-validation" novalidate> <input type="hidden" name="id3a" id="id3a"> <div class="row mt-3"> <div class="col-lg-4"> <div class="mb-1 position-relative" id="3adateInputpickeredit"> <label class="form-label">Date</label> <input type="text" data-date-autoclose="true" class="form-control" id="3adateedit" name="3adateedit" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#3adateInputpickeredit" required> </div> </div> <div class="col-lg-4"> <div class="mb-1"> <label for="3apagenumedit" class="form-label">Page Number</label> <input type="number" name="3apagenumedit" id="3apagenumedit" class="form-control"> </div> </div> <div class="col-lg-4"> <div class="mb-1"> <label for="3abooknumedit" class="form-label">Book Number</label> <input type="number" name="3abooknumedit" id="3abooknumedit" class="form-control"> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="3agroomnameedit" class="form-label">Name of Husband</label> <input type="text" name="3agroomnameedit" id="3agroomnameedit" class="form-control" oninput="this.value = this.value.toUpperCase()" > </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="3abridenameedit" class="form-label">Name of Wife</label> <input type="text" name="3abridenameedit" id="3abridenameedit" class="form-control" oninput="this.value = this.value.toUpperCase()" > </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="3aageedit" class="form-label">Age</label> <input type="text" name="3agroomageedit" id="3agroomageedit" class="form-control"> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="3aageedit" class="form-label">Age</label> <input type="text" name="3abrideageedit" id="3abrideageedit" class="form-control"> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="3acitizenedit" class="form-label">Citizenship</label> <input type="text" name="3agroomcitizenedit" id="3agroomcitizenedit" class="form-control"> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="simpleinput" class="form-label">Citizenship</label> <input type="text" name="3abridecitizenedit" id="3abridecitizenedit" class="form-control"> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="simpleinput" class="form-label">Civil Status</label> <input type="text" name="3agroomciviledit" id="3agroomciviledit" class="form-control"> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="simpleinput" class="form-label">Civil Status</label> <input type="text" name="3abrideciviledit" id="3abrideciviledit" class="form-control"> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="simpleinput" class="form-label">Mother</label> <input type="text" name="3agroommotheredit" id="3agroommotheredit" class="form-control"> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="simpleinput" class="form-label">Mother</label> <input type="text" name="3abridemotheredit" id="3abridemotheredit" class="form-control"> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="simpleinput" class="form-label">Father</label> <input type="text" name="3agroomfatheredit" id="3agroomfatheredit" class="form-control"> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="simpleinput" class="form-label">Father</label> <input type="text" name="3abridefatheredit" id="3abridefatheredit" class="form-control"> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="simpleinput" class="form-label">Registry Number</label> <input type="text" name="3aregistrynumedit" id="3aregistrynumedit" class="form-control"> </div> </div> <div class="col-lg-6"> <div class="mb-1 position-relative" id="3adateInputpickerregedit"> <label class="form-label">Date of Registration</label> <input type="text" data-date-autoclose="true" class="form-control" id="3adateregedit" name="3adateregedit" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#3adateInputpickerregedit" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1 position-relative" id="3adateInputpickermaredit"> <label class="form-label">Date of Marriage</label> <input type="text" data-date-autoclose="true" class="form-control" id="3adatemarriageedit" name="3adatemarriageedit" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#3adateInputpickermaredit" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="simpleinput" class="form-label">Place of Marriage</label> <input type="text" name="3aplacemarriageedit" id="3aplacemarriageedit" class="form-control"> </div> </div> </div> <!-- new --> <div class="row justify-content-center"> <div class="col-lg-6"> <div class="mb-1"> <label for="3aissued" class="form-label">Issued To</label> <input type="text" id="3aissuededit" name="3aissuededit" onchange="handleChange()" class="form-control capslockview" required> </div> </div> </div> <div class="row justify-content-center"> <div class="col-md-10"> <div class="mb-3"> <label for="3aremarks" class="form-label">Remarks</label> <textarea class="form-control" id="3aremarksedit" name="3aremarksedit" rows="3"></textarea> </div> </div> </div> <div class="row"> <div class="col-lg-4"> <div class="mb-1"> <label for="amountPaidInput3a" class="form-label">Amount Paid</label> <input type="text" id="amountPaidInput3aedit" name="amountPaidInput3aedit" class="form-control" required> </div> </div> <div class="col-lg-4"> <div class="mb-1"> <label for="3aorNumber" class="form-label">O.R. Number</label> <input type="text" id="3aorNumberedit" name="3aorNumberedit" class="form-control" required> </div> </div> <div class="col-lg-4"> <div class="mb-1 position-relative" id="3adatePaidInputpickeredit"> <label class="form-label">Date Paid</label> <input type="text" data-date-autoclose="true" class="form-control" id="3adatePaidedit" name="3adatePaidedit" data-provide="datepicker" data-date-format="MM dd, yyyy" data-date-container="#3adatePaidInputpickeredit" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="3averify" class="form-label">Verified By</label> <input type="text" id="3averifyedit" name="3averifyedit" oninput="this.value = this.value.toUpperCase()" class="form-control" required> </div> </div> <div class="col-lg-6"> <div class="mb-1"> <label for="3amcr" class="form-label">Municipal Civil Registrar</label> <input type="text" id="3amcredit" name="3amcredit" oninput="this.value = this.value.toUpperCase()" value="ISMAEL D. MALICDEM, JR." class="form-control" required> </div> </div> </div> <div class="row"> <div class="col-lg-6"> <div class="mb-1"> <label for="3adesignation" class="form-label">Designation</label> <div class="dropdown"> <select id="3adesignationedit" name="3adesignationedit" class="form-select" required> <option value="" selected disabled></option> <option value="Administrative Aide I">Administrative Aide I</option> <option value="Administrative Aide II">Administrative Aide II</option> <option value="Administrative Aide III">Administrative Aide III</option> <option value="Administrative Assistant I">Administrative Assistant I</option> <option value="Others">Others</option> </select> <div class="row justify-content-center"> <div class="col-md-10"> <input type="text" class="form-control" id="3acustomInputedit" name="3acustomInputedit" placeholder="Position" style="display: none; margin-top: 5px" /> </div> </div> </div> </div> </div> <div class="col-lg-6"> <div class="mt-3"> <p id="filefolder3a" style="font-family: monospace; text-align: center; font-size: 15px"></p> </div> </div> </div> <div class="row justify-content-end" style="margin: 30px;"> <button class="buttonx" type="button" data-bs-dismiss="modal"> <i class="mdi mdi-cancel"></i> </button> <button class="button" type="submit"> Update → </button> <style> .buttonx { --font-color: #323232; --bg-color: #fff; --main-color: #323232; width: 50px; height: 40px; border-radius: 5px; border: 2px solid var(--main-color); background-color: var(--bg-color); box-shadow: 4px 4px var(--main-color); font-size: 17px; margin-right: 10px; font-weight: 600; color: var(--font-color); cursor: pointer; } .buttonx:focus { --bg-color: #fa5c7c; background-color: var(--bg-color); color: white; } .buttonx:hover { --bg-color: #fa5c7c; background-color: var(--bg-color); color: white; } .buttonx:active { box-shadow: 0px 0px var(--main-color); transform: translate(3px, 3px); } </style> <style> .button { --font-color: #323232; --bg-color: #fff; --main-color: #323232; width: 120px; height: 40px; border-radius: 5px; border: 2px solid var(--main-color); background-color: var(--bg-color); box-shadow: 4px 4px var(--main-color); font-size: 17px; font-weight: 600; color: var(--font-color); cursor: pointer; } .button:focus { --bg-color: #0acf97; background-color: var(--bg-color); color: white; } .button:active { box-shadow: 0px 0px var(--main-color); transform: translate(3px, 3px); } </style> </div> </form> </div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal -->