Untitled
unknown
html
a year ago
57 kB
5
Indexable
<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 -->