<?php
error_reporting(0);
include("admin/common/app_function.php");
include("admin/config.php");
include("header.php");
//index_header($title); 
?>



<br/>
	<div class="container-fluid py-5">
    <div class="row justify-content-center">
        <div class="col-lg-10 col-md-12">
            <div class="card shadow-sm border-0">
                <div class="card-header bg-primary text-white">
                    <h4 class="mb-0 text-center">Application Form</h4>
                </div>
                <div class="card-body p-4">
                    <form class="container" autocomplete="off" action="submit_form.php" method="post" enctype="multipart/form-data">
                        <p class="text-primary fw-bold">APPLICATION DETAILS</p>

                        <!-- Notification -->
                        <?php if ($_GET['flag'] == "send") { ?>
                            <div class="alert alert-success" role="alert">
                                Your Enquiry Successfully Sent!
                            </div>
                        <?php } ?>

                        <!-- Job Application Details -->
                        <div class="row mb-3">
                            <div class="col-md-8">
                                <label class="form-label" style="color:#8a7c7c;">For Which Job Application</label>
                                <input type="text" class="form-control" name="postname" value="Urgent Need <?php echo $_GET['job_name']; ?>" readonly>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" style="color:#8a7c7c;">Appointed</label>
                                <br>
                                <input type="radio" id="appointmentYes" name="appointed" value="Yes" onclick="toggleDateInput()"> Yes &nbsp;
                                <input type="radio" id="appointmentNo" name="appointed" value="No" checked onclick="toggleDateInput()"> No
                            </div>
                        </div>

                        <!-- Appointment Date -->
                        <div class="row mb-3" id="dateInputRow" style="display: none;">
                            <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;">Appointment Date/Time</label>
                                <input type="date" name="appointment_date" style="border:1px solid #ddd;">
								<input type="time" name="appointment_time" style="border:1px solid #ddd;">
                            </div>
                        </div>

                        <!-- Applicant Details -->
                        <div class="row mb-3">
                            <div class="col-md-12">
                                <label class="form-label" style="color:#8a7c7c;">Applicant Full Name <font color="red">*</font></label>
                                <input type="text" class="form-control" name="applicant_name" placeholder="Enter Full Name" maxlength="50" required>
                            </div>
                        </div>

                        <!-- Applicant Address -->
                        <div class="row mb-3">
                            <div class="col-md-12">
                                <label class="form-label" style="color:#8a7c7c;">Permanent Address <font color="red">*</font></label>
                                <textarea class="form-control" name="address_permanant" rows="2" placeholder="Enter Address" maxlength="100" required></textarea>
                            </div>
                        </div>

                        <div class="row mb-3">
                            <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;">Town <font color="red">*</font></label>
                                <input type="text" class="form-control" name="town" placeholder="Enter Town" required>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;">Taluka <font color="red">*</font></label>
                                <input type="text" class="form-control" name="taluka" placeholder="Enter Taluka" required>
                            </div>
                            <div class="col-md-2">
                                <label class="form-label" style="color:#8a7c7c;">District <font color="red">*</font></label>
                                <input type="text" class="form-control" name="district" placeholder="Enter District" required>
                            </div>
							 <div class="col-md-2">
                                <label class="form-label" style="color:#8a7c7c;">State <font color="red">*</font></label>
                                <input type="text" class="form-control" name="state" placeholder="Enter State" required>
                            </div>
							 <div class="col-md-2">
                                <label class="form-label" style="color:#8a7c7c;">Pincode </label>
                                <input type="text" class="form-control" name="pincode" maxlength="6" placeholder="Enter Pincode" >
                            </div>
                        </div>

					
						<div class="row mb-3">
    <div class="col-md-12">
        <input type="checkbox" id="sameAddressCheckbox" onclick="copyAddress()"> Permanent Address is same as Local Address.
    </div>
</div>
						
                        <div class="row mb-3">
                            <div class="col-md-12">
                                <label class="form-label" style="color:#8a7c7c;">Local Address <font color="red">*</font></label>
                                <textarea class="form-control" name="local_address" rows="2" placeholder="Enter Local Address" maxlength="100" required></textarea>
                            </div>
                        </div>
						<div class="row mb-3">
                            <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;">Town <font color="red">*</font></label>
                                <input type="text" class="form-control" name="town_local" placeholder="Enter Town" required>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;">Taluka <font color="red">*</font></label>
                                <input type="text" class="form-control" name="taluka_local" placeholder="Enter Taluka" required>
                            </div>
                            <div class="col-md-2">
                                <label class="form-label" style="color:#8a7c7c;">District <font color="red">*</font></label>
                                <input type="text" class="form-control" name="district_local" placeholder="Enter District" required>
                            </div>
							 <div class="col-md-2">
                                <label class="form-label" style="color:#8a7c7c;">State <font color="red">*</font></label>
                                <input type="text" class="form-control" name="state_local" placeholder="Enter State" required>
                            </div>
							 <div class="col-md-2">
                                <label class="form-label" style="color:#8a7c7c;">Pincode </label>
                                <input type="text" class="form-control" name="pincode_local" maxlength="6" placeholder="Enter Pincode" >
                            </div>
                        </div>
					
						
 <hr><p class="text-primary fw-bold">PERSONAL DETAILS</p>
                        <!-- Additional Details -->
                        <div class="row mb-3">
                            <div class="col-md-4">
                                <label class="form-label" style="color:#8a7c7c;">Reference By</label>
                                <input type="text" class="form-control" name="reference_by" placeholder="Enter Reference">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" style="color:#8a7c7c;">Gender </label>
                                <select name="gender" class="form-control" >
                                    <option value="">Select</option>
                                    <option value="Male">Male</option>
                                    <option value="Female">Female</option>
                                </select>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" style="color:#8a7c7c;">Marital Status </label>
                                <select name="mstatus" class="form-control" >
                                    <option value="">Select</option>
                                    <option value="Married">Married</option>
                                    <option value="Unmarried">Unmarried</option>
                                    <option value="Widowed">Widowed</option>
                                    <option value="Divorced">Divorced</option>
                                </select>
                            </div>
                        </div>

                        <!-- Date of Birth -->
                       <div class="row mb-3">
    <div class="col-md-2">
        <label class="form-label" style="color:#8a7c7c;">Birth Day <font color="red">*</font></label>
        <select id="birthDay" name="birth_day" class="form-control" required onchange="calculateAge()">
            <option value="">Select</option>
            <!-- Generate options dynamically -->
            <script>
                for (let i = 1; i <= 31; i++) {
                    document.write(`<option value="${i}">${i}</option>`);
                }
            </script>
        </select>
    </div>
    <div class="col-md-2">
        <label class="form-label" style="color:#8a7c7c;">Birth Month <font color="red">*</font></label>
        <select id="birthMonth" name="birth_month" class="form-control" required onchange="calculateAge()">
            <option value="">Select</option>
            <!-- Generate options dynamically -->
            <script>
                const months = [
                    "January", "February", "March", "April", "May", "June",
                    "July", "August", "September", "October", "November", "December"
                ];
                months.forEach((month, index) => {
                    document.write(`<option value="${index + 1}">${month}</option>`);
                });
            </script>
        </select>
    </div>
    <div class="col-md-2">
        <label class="form-label" style="color:#8a7c7c;">Birth Year <font color="red">*</font></label>
        <select id="birthYear" name="birth_year" class="form-control" required onchange="calculateAge()">
            <option value="">Select</option>
            <!-- Generate options dynamically -->
            <script>
                const currentYear = new Date().getFullYear();
                for (let year = currentYear; year >= 1900; year--) {
                    document.write(`<option value="${year}">${year}</option>`);
                }
            </script>
        </select>
    </div>
	
    <div class="col-md-2">
        <label class="form-label" style="color:#8a7c7c;">Age</label>
        <input type="text" id="age" name="age" class="form-control" readonly>
    </div>

</div>
<hr><p class="text-primary fw-bold">EXPERIENCE DETAILS</p>

<div class="row mb-3">
                            <div class="col-md-2">
                                 <label class="form-label" style="color:#8a7c7c;">Education <font color="red">*</font></label>
                                <select name="education" class="form-control" required>
                                    <option value="">Select</option>
								    <option value="4th">4th</option>
									<option value="5th">5th</option>
									<option value="6th">6th</option>
									<option value="7th">7th</option>
									<option value="8th">8th</option>
									<option value="9th">9th</option>
                                    <option value="10th">10th</option>
                                    <option value="12th">12th</option>
									<option value="B.A. Apear">B.A. Apear</option>
									 <option value="B.A.">B.A.</option>
									 <option value="B.A. I">B.A. I</option>
									 <option value="B.A. II">B.A. II</option>
									<option value="B.A. II">B.A. III Apeared</option>
								       <option value="BBA">BBA</option>
									   <option value="M.Sc"> M.Sc</option>
									  <option value="B.tech"> B.tech</option>
									   <option value="D.Pharm"> D.Pharm</option>
									   
									   <option value="FYBA"> FYBA</option>
									   <option value="A.M."> A.M.</option>
									   <option value="B.Com"> B.Com</option>
									   <option value="M.A"> M.A</option>
									   <option value="B.Com III"> B.Com III</option>
									   <option value="B.Sc"> B.Sc</option>
									  <option value="B.Sc. (C.S)"> B.Sc. (C.S)</option>
									  <option value="B.Sc. (C.S)"> B. Sc. II</option>
										  <option value="D.Ed"> D.Ed</option>
										   <option value="BPEI"> BPEI</option>
									   . <option value="Graduation"> Graduation</option>
									
                                </select>
                            </div>
                            <div class="col-md-2">
    <label class="form-label" style="color:#8a7c7c;">Height <font color="red">*</font></label>
    <select name="height" class="form-control" required>
        <option value="">Select</option>
        <!-- Generate options dynamically -->
        <script>
            for (let feet = 4; feet <= 7; feet++) { // Loop for feet (4' to 7')
                for (let inches = 0; inches < 12; inches++) { // Loop for inches (0" to 11")
                    const height = `${feet}'${inches}"`;
                    const value = feet + inches / 12; // Convert to decimal (e.g., 5'6" => 5.5)
                    document.write(`<option value="${value.toFixed(2)}">${height}</option>`);
                }
            }
        </script>
    </select>
</div>

                            <div class="col-md-2">
                                <label class="form-label" style="color:#8a7c7c;">Pre. Experience <font color="red">*</font></label>
                                <select name="prevexp" class="form-control" required>
                                    <option value="">Select</option>
                                    <option value="Yes">Yes</option>
                                    <option value="No">No</option>
                                  </select>
                            </div>
							 <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;">Type of Experience</label>
                                <input type="text" class="form-control" name="typ_exp" placeholder="Enter">
                            </div>
							 <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;"> Experience Where</label>
                                <input type="text" class="form-control" name="exp_where" placeholder="Enter">
                            </div>
                        </div>

	<hr><p class="text-primary fw-bold">OTHER ABILITY DETAILS</p>					
						
					<div class="row mb-3">
                            <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;">Other Ability if Any </label>
                                <select name="orther_ability" class="form-control" >
                                    <option value="">Select</option>
                                    <option value="Yes">Yes</option>
                                    <option value="No">No</option>
                                   </select>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;">Four Wheeler driving License</label>
                                <select name="driving_lic" class="form-control" >
                                    <option value="">Select</option>
                                    <option value="Yes">Yes</option>
                                    <option value="No">No</option>
                                </select>
                            </div>
                            <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;">Gun License </label>
                                <select name="gun_lic" class="form-control" >
                                    <option value="">Select</option>
                                    <option value="Yes">Yes</option>
                                    <option value="No">No</option>
                                    
                                </select>
                            </div>
							<div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;"> Own Gun/Revalvar </label>
                                <select name="own_gun" class="form-control" >
                                    <option value="">Select</option>
                                    <option value="Yes">Yes</option>
                                    <option value="No">No</option>
                                 </select>
                            </div>
							
							 
                        </div>
	
					<div class="row mb-3">
					<div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;"> Shift Preference </label>
                                <select name="shift_pre" class="form-control" >
                                    <option value="">Select</option>
                                    <option value="8H">8H</option>
                                    <option value="12H">12H</option>
                                     <option value="Night">Night</option>
									  <option value="Day">Day</option>
									   <option value="Any">Any</option>
                                </select>
                            </div>
					 <div class="col-md-3">
                                <label class="form-label" style="color:#8a7c7c;"> Salary Expectation</label>
                                <input type="text" class="form-control" name="salary_expe" placeholder="Enter">
                            </div>
					
					 </div>
					 
					 <hr><p class="text-primary fw-bold">CONTACT DETAILS</p>	
					 <div class="row mb-3">
					   <div class="col-md-3">
					         <label class="form-label" style="color:#8a7c7c;"> Mobile No <font color="red">*</font></label>
                               <input type="text" class="form-control" name="mobile" placeholder="Enter" required>
                            </div>
					<div class="col-md-3">
					         <label class="form-label" style="color:#8a7c7c;"> Alternate Mobile No</label>
                               <input type="text" class="form-control" name="alt_mobile" placeholder="Enter">
                            </div>
					<div class="col-md-3">
					         <label class="form-label" style="color:#8a7c7c;"> Email Id</label>
                               <input type="text" class="form-control" name="email" placeholder="Enter" >
                            </div>
					
					 <div class="col-md-3">
					         <label class="form-label" style="color:#8a7c7c;"> Aadharcard No </label>
                               <input type="text" class="form-control" name="aadharcardno" placeholder="Enter" >
                            </div>
					
					 </div>
						 </div>
                        <!-- Resume Upload 
                        <div class="row mb-3">
                            <div class="col-md-6">
                                <label class="form-label" style="color:#8a7c7c;">Upload Resume</label>
                                <input type="file" class="form-control" name="resume_path" accept=".pdf,.doc,.docx" required>
                            </div>
                        </div>-->

                        <!-- Submit Button -->
                        <div class="row">
                            <div class="col-md-12 text-center">
                                <input type="hidden" name="jobid" value="<?php echo $_GET['id']; ?>">
                                <button type="submit" class="btn btn-primary px-5">Submit Form</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

			<BR/>
			
<script>
    function copyAddress() {
        let isChecked = document.getElementById("sameAddressCheckbox").checked;

        document.getElementsByName("local_address")[0].value = isChecked ? document.getElementsByName("address_permanant")[0].value : "";
        document.getElementsByName("town_local")[0].value = isChecked ? document.getElementsByName("town")[0].value : "";
        document.getElementsByName("taluka_local")[0].value = isChecked ? document.getElementsByName("taluka")[0].value : "";
        document.getElementsByName("district_local")[0].value = isChecked ? document.getElementsByName("district")[0].value : "";
        document.getElementsByName("state_local")[0].value = isChecked ? document.getElementsByName("state")[0].value : "";
        document.getElementsByName("pincode_local")[0].value = isChecked ? document.getElementsByName("pincode")[0].value : "";

        // Disable local address fields when checkbox is checked
        document.getElementsByName("local_address")[0].readOnly = isChecked;
        document.getElementsByName("town_local")[0].readOnly = isChecked;
        document.getElementsByName("taluka_local")[0].readOnly = isChecked;
        document.getElementsByName("district_local")[0].readOnly = isChecked;
        document.getElementsByName("state_local")[0].readOnly = isChecked;
        document.getElementsByName("pincode_local")[0].readOnly = isChecked;
    }
</script>

<script>
    function calculateAge() {
        const day = parseInt(document.getElementById("birthDay").value);
        const month = parseInt(document.getElementById("birthMonth").value);
        const year = parseInt(document.getElementById("birthYear").value);

        if (!day || !month || !year) {
            document.getElementById("age").value = ""; // Clear the age field if input is incomplete
            return;
        }

        const today = new Date();
        const birthDate = new Date(year, month - 1, day); // Month is 0-indexed
        let age = today.getFullYear() - birthDate.getFullYear();
        const monthDiff = today.getMonth() - birthDate.getMonth();

        if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < birthDate.getDate())) {
            age--; // Adjust for cases where the birthday hasn't occurred yet this year
        }

        document.getElementById("age").value = age; // Display the calculated age
    }
</script>
				<script>
document.addEventListener("DOMContentLoaded", function () {
    // Populate Days (1-31)
    const daySelect = document.getElementById("birthDay");
    for (let day = 1; day <= 31; day++) {
        const option = document.createElement("option");
        option.value = day;
        option.textContent = day;
        daySelect.appendChild(option);
    }

    // Populate Months (1-12)
    const monthSelect = document.getElementById("birthMonth");
    const months = [
        "January", "February", "March", "April", "May", "June",
        "July", "August", "September", "October", "November", "December"
    ];
    months.forEach((month, index) => {
        const option = document.createElement("option");
        option.value = index + 1; // Month values are 1-12
        option.textContent = month;
        monthSelect.appendChild(option);
    });

    // Populate Years (1900 - Current Year)
    const yearSelect = document.getElementById("birthYear");
    const currentYear = new Date().getFullYear();
    for (let year = currentYear; year >= 1980; year--) {
        const option = document.createElement("option");
        option.value = year;
        option.textContent = year;
        yearSelect.appendChild(option);
    }
});


</script>
<script>
function toggleDateInput() {
    const dateInputRow = document.getElementById("dateInputRow");
    const isYesSelected = document.getElementById("appointmentYes").checked;

    // Show the date input if "Yes" is selected, hide it otherwise
    dateInputRow.style.display = isYesSelected ? "block" : "none";
}

</script>	
<?php include("footer.php");?>