<?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">Job 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 } ?>

                  
						
						 <div class="row mb-3">
                            <div class="col-md-4">
                                <label class="form-label" style="color:#8a7c7c;"> Job Application for Which POST <font color="red">*</font></label>
                                 <input type="text" class="form-control" name="postname" value="" placeholder="Enter POST" required>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" style="color:#8a7c7c;">Job Application for Which POST (OTHER)</label>
                                <input type="text" class="form-control" name="postname2" value="" placeholder="Enter POST OTHER" >
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" style="color:#8a7c7c;">Job Application for Which POST (OTHER)</label>
                                <input type="text" class="form-control" name="postname3" value="" placeholder="Enter POST OTHER" >
                            </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" maxlength="6" 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 </label>
        <select id="birthDay" name="birth_day" class="form-control"  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 </label>
        <select id="birthMonth" name="birth_month" class="form-control"  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 </label>
        <select id="birthYear" name="birth_year" class="form-control"  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 <font color="red">*</font></label>
        <input type="text" id="age" name="age" class="form-control" required>
    </div>

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

<div class="row mb-3">
                            <div class="col-md-3">
                                 <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-3">
                                <label class="form-label" style="color:#8a7c7c;">Other Education</label>
                                <input type="text" class="form-control" name="otheredu" placeholder="Enter">
                            </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-4">
    <label class="form-label" style="color:#8a7c7c;">Previous Experience <font color="red">*</font></label>
    <select name="prevexp" class="form-control" required id="prevexp" onchange="toggleExperienceFields()">
        <option value="">Select</option>
        <option value="Yes">Yes</option>
        <option value="No">No</option>
    </select>
</div>

<!-- Experience fields container -->
<div id="experienceFields" style="display: none;">
    <div class="row">
        <div class="col-md-3">
            <label class="form-label" style="color:#8a7c7c;">Company Name</label>
            <input type="text" class="form-control" name="company_name1" placeholder="Enter">
        </div>
        <div class="col-md-3">
            <label class="form-label" style="color:#8a7c7c;">Which Type of Experience</label>
            <input type="text" class="form-control" name="typ_exp1" placeholder="Enter">
        </div>
        <div class="col-md-2">
            <label class="form-label" style="color:#8a7c7c;">POST</label>
            <input type="text" class="form-control" name="post1" placeholder="Enter">
        </div>
        <div class="col-md-2">
            <label class="form-label" style="color:#8a7c7c;">Duration</label>
            <input type="text" class="form-control" name="duration1" placeholder="Enter">
        </div>
		<div class="col-md-2">
            <label class="form-label" style="color:#8a7c7c;">Type (Year/Month)</label>
             <select name="duration_type1" class="form-control"  id="duration_type1">
        <option value="">Select</option>
        <option value="Month">Month</option>
        <option value="No">Years</option>
    </select>
        </div>

        <div class="col-md-3">
            <label class="form-label" style="color:#8a7c7c;">Company Name</label>
            <input type="text" class="form-control" name="company_name2" placeholder="Enter">
        </div>
        <div class="col-md-3">
            <label class="form-label" style="color:#8a7c7c;">Which Type of Experience</label>
            <input type="text" class="form-control" name="typ_exp2" placeholder="Enter">
        </div>
        <div class="col-md-2">
            <label class="form-label" style="color:#8a7c7c;">POST</label>
            <input type="text" class="form-control" name="post2" placeholder="Enter">
        </div>
        <div class="col-md-2">
            <label class="form-label" style="color:#8a7c7c;">Duration</label>
            <input type="text" class="form-control" name="duration2" placeholder="Enter">
        </div>
		<div class="col-md-2">
            <label class="form-label" style="color:#8a7c7c;">Type (Year/Month)</label>
             <select name="duration_type2" class="form-control"  id="duration_type2">
        <option value="">Select</option>
        <option value="Month">Month</option>
        <option value="No">Years</option>
    </select>
        </div>

        <div class="col-md-3">
            <label class="form-label" style="color:#8a7c7c;">Company Name</label>
            <input type="text" class="form-control" name="company_name3" placeholder="Enter">
        </div>
        <div class="col-md-3">
            <label class="form-label" style="color:#8a7c7c;">Which Type of Experience</label>
            <input type="text" class="form-control" name="typ_exp3" placeholder="Enter">
        </div>
        <div class="col-md-2">
            <label class="form-label" style="color:#8a7c7c;">POST</label>
            <input type="text" class="form-control" name="post3" placeholder="Enter">
        </div>
        <div class="col-md-2">
            <label class="form-label" style="color:#8a7c7c;">Duration</label>
            <input type="text" class="form-control" name="duration3" placeholder="Enter">
        </div>
		<div class="col-md-2">
            <label class="form-label" style="color:#8a7c7c;">Type (Year/Month)</label>
             <select name="duration_type3" class="form-control"  id="duration_type3">
        <option value="">Select</option>
        <option value="Month">Month</option>
        <option value="No">Years</option>
    </select>
        </div>
    </div>
</div>

<script>
function toggleExperienceFields() {
    var dropdown = document.getElementById("prevexp");
    var experienceFields = document.getElementById("experienceFields");

    if (dropdown.value === "Yes") {
        experienceFields.style.display = "block";
    } else {
        experienceFields.style.display = "none";
    }
}
</script>

                        </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="other_ability" class="form-control" id="otherAbility" onchange="toggleAbilityInfo()">
        <option value="">Select</option>
        <option value="Yes">Yes</option>
        <option value="No">No</option>
    </select>
</div>

<div class="col-md-3" id="abilityInfoField" style="display: none;">
    <label class="form-label" style="color:#8a7c7c;">Ability Information</label>
    <input type="text" class="form-control" name="ability_info" placeholder="Enter">
</div>

<script>
function toggleAbilityInfo() {
    var dropdown = document.getElementById("otherAbility");
    var abilityField = document.getElementById("abilityInfoField");

    if (dropdown.value === "Yes") {
        abilityField.style.display = "block";
    } else {
        abilityField.style.display = "none";
    }
}
</script>

                            <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" maxlength="10" 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" maxlength="10" 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"  maxlength="12" 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 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>	
<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>
<?php include("footer.php");?>