<style>
    .register-row {
        position: relative;
        display: flex;
        justify-content: space-between;
    }

    .passwrd-icon1 {
        position: absolute;
        top: 5px !important;
        right: 8px;
        cursor: pointer;
    }

    .upload-doc-btn-wrap {
        position: relative;
    }

    .error {
        color: red;
        padding-top: 5px;
        font-size: 12px;
    }

    .col-md-6.col-height {
        height: 50px !important;
    }
</style>
<div class="wraper responsive-width">

    <main class="container" id="main">

        <!----admin template section---->
        <div class="admin_tempblock">
            <div class="admin_tempsec">
                <div class="admin_sec">

                    <form id="addEditBatchForm" method="post" action="<?php echo base_url(); ?>admin/AddnewApplication" enctype="multipart/form-data">
                        <div class="col-md-8 px-0">
                            <div class="register-form">
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="subject_lhead"><?php echo $title; ?></div>
                                    </div>
                                </div>
                                <br>
                                <div class="card">
                                    <div class="card-body">
                                        <h5 class="card-title">Register</h5>
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="row">
                                                    <div class="col-md-6">
                                                        <div class="register-row">
                                                            <input type="text" name="sfname" class="sfname form-control" id="sfname" placeholder="First name" />
                                                        </div>
                                                        <label id="sfname-error" class="error" for="sfname"></label>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="register-row">
                                                            <input type="text" name="ssname" class="ssname form-control" id="ssname" placeholder="Second name" />
                                                        </div>
                                                        <label id="ssname-error" class="error" for="ssname"></label>
                                                    </div>

                                                </div>
                                            </div>
                                            <div class="col-md-12 pt-4">
                                                <div class="row">
                                                    <div class="col-md-6">
                                                        <div class="register-row">
                                                            <input type="text" name="semail" id="semail" class="semail form-control" placeholder="Email Address">
                                                        </div>
                                                        <label id="semail-error" class="error" for="semail"></label>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="register-row">
                                                            <input type="text" name="semailre" class="semailre form-control" id="semailre" placeholder="Re-Enter your Email address">
                                                        </div>
                                                        <label id="semailre-error" class="error" for="semailre"></label>
                                                    </div>

                                                </div>
                                            </div>
                                            <div class="col-md-12 pt-4">
                                                <div class="row">
                                                    <div class="col-md-6">
                                                        <div class="register-row">
                                                            <input type="password" name="spaswd" class="spaswd form-control" placeholder="Password" id="password3">
                                                            <span class="passwrd-icon1 icon-y" id="p_icon3">
                                                                <i class="far fa-eye"></i>
                                                            </span>
                                                        </div>
                                                        <label id="password3-error" class="error" for="password3"></label>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="register-row">
                                                            <input type="password" name="spaswdre" class="spaswdre form-control" id="password4" placeholder="Re-enter Password">
                                                            <span class="passwrd-icon1 icon-y" id="p_icon4">
                                                                <i class="far fa-eye"></i>
                                                            </span>
                                                        </div>
                                                        <label id="password4-error" class="error" for="password4"></label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-12 pt-4">
                                                <div class="row">
                                                    <div class="col-md-6">
                                                        <div class="register-row">
                                                            <input type="text" name="scontact" class="scontact form-control" id="scontact" placeholder="Contact number">
                                                        </div>
                                                        <label id="scontact-error" class="error" for="scontact"></label>
                                                    </div>

                                                    <div class="col-md-6">
                                                        <div class="register-row">
                                                            <div class="po-calendar">
                                                                <input type="text" name="sdob" id='sdob' class="nepal-date sdob form-control" placeholder="dd">
                                                                <i class="fas fa-calendar-alt cal-icon"></i>
                                                            </div>
                                                            <!-- <input type="date" name="sdob" class="sdob form-control" id="sdob" placeholder="dd"> -->

                                                        </div>
                                                        <label id="sdob-error" class="error" for="sdob"></label>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="register-row">
                                                            <div class="register-radio">
                                                                <label for="Male"><input type="radio" id="Male" name="sgender" value="Male"> Male </label>
                                                            </div>
                                                            <div class="register-radio">
                                                                <label for="Female"><input type="radio" id="Female" name="sgender" value="Female"> Female</label>
                                                            </div>
                                                            <div class="register-radio">
                                                                <label for="Other"><input type="radio" id="Other" name="sgender" value="Other"> Other</label>
                                                            </div>

                                                        </div>

                                                        <label id="sgender-error" class="error" for="sgender"></label>

                                                        <!-- sibling start  -->
                                                        <!-- <div class="register-radio">
                                                            <label for="sibling"><input type="checkbox" id="sibling" name="sibling" value="yes"> Has sibling? </label>
                                                        </div>
                                                        <div id="sibling_outer_div" style="display: none" class="mt-3">
                                                            <label class="" for="sibling_id">Sibling Id <span style="color:red">*</span></label>
                                                            <input type="text" name="sibling_id" id="sibling_id" class="form-control" placeholder="Sibling Id">
                                                        </div>
                                                        <label id="sibling_id_err" class="error"></label> -->
                                                        <!-- Dont Delete Below Code -->
                                                        <!-- <input type="hidden" name="sibling_parent_id" id="sibling_parent"> -->
                                                        <!-- Dont Delete Below Code -->
                                                        <!-- sibling end -->
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="card my-3">
                                    <div class="card-body">
                                        <h5 class="card-title">Additional details</h5>
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="row">
                                                    <div class="col-md-12 my-2">
                                                        <h6>Course Details</h6>
                                                    </div>

                                                    <div class="col-md-6 col-height">
                                                        <div class="register-row">
                                                            <select name="sbatch" class="sbatch form-control" id="sbatch">
                                                                <option value="">Select Batch</option>
                                                                <?php foreach ($batch as $c) { ?>
                                                                    <option value="<?= $c['id'] ?>"><?= $c['b_name'] ?></option>
                                                                <?php } ?>
                                                            </select>
                                                        </div>
                                                        <label id="sbatch-error" class="error" for="sbatch"></label>
                                                        <p id="batch_error" class="d-none text-danger" style="font-size:14px">Please Select Batch </p>
                                                    </div>

                                                    <div class="col-md-6 col-height">
                                                        <div class="register-row">
                                                            <select name="scourse" class="scourse form-control" id="scourse">
                                                                <option value="">Select Course</option>
                                                                <!-- <?php //foreach ($courses as $c) { 
                                                                        ?>
                                                                <option value="<?php  //echo $c['id'] 
                                                                                ?>"><?php //echo $c['course_name'] 
                                                                                                            ?></option>
                                                                <?php //} 
                                                                ?> -->
                                                            </select>

                                                        </div>
                                                        <label id="scourse-error" class="error" for="scourse"></label>
                                                        <p id="course_error" class="d-none text-danger" style="font-size:14px">Please Select Course </p>
                                                        <p id="course_error_msg" class="text-danger" style="font-size:14px"> </p>
                                                    </div>


                                                    <div class="col-md-6 col-height mt-3">
                                                        <div class="register-row">
                                                            <select name="s_section" class="s_section form-control" id="s_section">
                                                                <option value=''> Select Section </option>

                                                            </select>
                                                        </div>
                                                        <label id="s_section-error" class="error" for="s_section"></label>
                                                    </div>

                                                </div>
                                            </div>
                                            <div class="col-md-12 pt-4">
                                                <div class="row">
                                                    <div class="col-md-12 my-2">
                                                        <h6>Emergency Contact</h6>
                                                    </div>
                                                    <div class="col-md-6 col-height">
                                                        <div class="register-row">
                                                            <input type="text" name="semfname" class="semfname form-control" id="semfname" placeholder="Enter name">
                                                        </div>
                                                        <label id="semfname-error" class="error" for="semfname"></label>
                                                    </div>
                                                    <div class="col-md-6 col-height">
                                                        <div class="register-row">
                                                            <input type="text" name="semlname" class="semlname form-control" id="semlname" placeholder="Last Name">
                                                        </div>
                                                        <label id="semlname-error" class="error" for="semlname"></label>
                                                    </div>
                                                    <div class="col-md-6 col-height">
                                                        <div class="register-row">
                                                            <input type="text" name="semphone" class="semphone form-control" id="semphone" placeholder="Phone Number">
                                                        </div>
                                                        <label id="semphone-error" class="error" for="semphone"></label>
                                                    </div>

                                                </div>
                                            </div>
                                            <div class="col-md-12 pt-4">
                                                <div class="row">
                                                    <div class="col-md-12 my-2">
                                                        <h6>Address</h6>
                                                    </div>
                                                    <div class="col-md-6 col-height">
                                                        <div class="register-row">
                                                            <select name="scountry" class="scountry form-control" id="scountry">
                                                                <option value="">Country</option>
                                                                <option value="Nepal" selected>Nepal</option>
                                                                <option value="India">India</option>
                                                            </select>
                                                        </div>
                                                        <label id="scountry-error" class="error" for="scountry"></label>
                                                    </div>
                                                    <div class="col-md-6 col-height">
                                                        <div class="register-row">
                                                            <input type="text" name="sstate" class="sstate form-control" id="sstate" placeholder="Provinces/state">
                                                        </div>
                                                        <label id="sstate-error" class="error" for="sstate"></label>
                                                    </div>
                                                    <div class="col-md-6 col-height">
                                                        <div class="register-row">
                                                            <input type="text" name="saddress1" class="saddress1 form-control" id="saddress1" placeholder="Address 1">
                                                        </div>
                                                        <label id="saddress1-error" class="error" for="saddress1"></label>
                                                    </div>
                                                </div>

                                            </div>

                                            <div class="col-md-12 pt-4">
                                                <div class="row">
                                                    <div class="col-md-6 col-height">

                                                        <div class="register-row">
                                                            <input type="text" name="saddress2" class="saddress2 form-control" id="saddress2" placeholder="Address 2">
                                                        </div>
                                                        <label id="saddress2-error" class="error" for="saddress2"></label>
                                                    </div>
                                                    <div class="col-md-6 col-height">
                                                        <div class="register-row">
                                                            <input type="text" name="szipcode" class="szipcode form-control" id="szipcode" placeholder="PMB / Zip code">
                                                        </div>
                                                        <label id="szipcode-error" class="error" for="szipcode"></label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>



                                <div class="card my-3">
                                    <div class="card-body">
                                        <h5 class="card-title">Documents</h5>
                                        <label class="text-danger "> ** Accepted Only JPG and PNG</label>
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="row">
                                                    <div class="col-md-6">
                                                        <div class="upload-doc">
                                                            <label>Passport size photo</label>
                                                            <!-- <span id="uploaded-file">&nbsp</span> -->
                                                            <div class="upload-doc-btn-wrap">
                                                                <input type="file" name="photo" id="photo" name="No file uploaded" />
                                                                <label for="photo" class="upload-btn" id="uploadBtn1">Upload</label>
                                                                <label for="photo" class="upload-btn re-upload-btn" id="uploadBtn2">Upload</label>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="upload-doc">
                                                            <label>School certificate</label>

                                                            <!-- <span id="uploaded-file">&nbsp</span> -->
                                                            <div class="upload-doc-btn-wrap">

                                                                <input type="file" name="school" id="school" name="No file uploaded" accept=".png,.jpg*" />
                                                                <label for="school" class="upload-btn" id="uploadBtn3">Upload</label>
                                                                <label for="school" class="upload-btn re-upload-btn" id="uploadBtn4">Upload</label>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="upload-doc">
                                                            <label>Exam Results</label>
                                                            <!-- <span id="uploaded-file">&nbsp</span> -->
                                                            <div class="upload-doc-btn-wrap">
                                                                <input type="file" name="exam" id="exam" name="No file uploaded" accept=".png,.jpg*" />
                                                                <label for="exam" class="upload-btn" id="uploadBtn5">Upload</label>
                                                                <label for="exam" class="upload-btn re-upload-btn" id="uploadBtn6">Upload</label>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="col-md-6">
                                                        <div class="upload-doc">
                                                            <label>Medical Certificate</label>
                                                            <!-- <span id="uploaded-file">&nbsp</span> -->
                                                            <div class="upload-doc-btn-wrap">
                                                                <input type="file" name="medical" id="medical" name="No file uploaded" accept=".png,.jpg*" />
                                                                <label for="medical" class="upload-btn" id="uploadBtn7">Upload</label>
                                                                <label for="medical" class="upload-btn re-upload-btn" id="uploadBtn8">Upload</label>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>


                                        </div>
                                    </div>
                                </div>


                                <div class="card">
                                    <div class="card-body">
                                        <h5 class="card-title">Application fee</h5>
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="row">

                                                    <div class="col-md-4">
                                                        <div class="register-row">
                                                            <input type="text" name="totalfee" class="totalfee form-control" id="totalfee" readonly placeholder="Application Fee" />
                                                        </div>
                                                        <label id="totalfee-error" class="error" for="totalfee"></label>
                                                        <div id="fee-section"></div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="register-row">
                                                            <!-- <input type="text" name="payment_method" class="payment_method form-control" id="payment_method" placeholder="Payment Method" /> -->
                                                            <select name="payment_method" class="payment_method form-control" id="payment_method">
                                                                <option value="">-- Select --</option>
                                                                <option value="cash">Cash</option>
                                                                <option value="bank-transfer">Bank Transfer</option>
                                                            </select>
                                                        </div>
                                                        <label id="payment_method-error" class="error" for="payment_method"></label>
                                                    </div>
                                                    <div class="col-md-4 ">
                                                        <div class="register-row description_section d-none">
                                                            <input type="text" name="description" id="description" class="description form-control" placeholder="DD No.">
                                                        </div>

                                                        <div class="register-row discount_fine_section d-none">
                                                            <div class="register-row">
                                                                <select name="dicount_scholar" class="dicount_scholar form-control" onchange="add_dicount_scholar(this)" id="dicount_scholar">
                                                                    <option value="" selected>None</option>
                                                                    <option value="discount">Discount</option>
                                                                    <option value="scholarship">Scholarship</option>
                                                                </select>
                                                            </div>
                                                        </div>

                                                        <div id="discount_scholarship_div" class="pt-2">

                                                        </div>

                                                    </div>
                                                </div>
                                            </div>


                                        </div>
                                    </div>
                                </div>


                                <div class=" my-2">
                                    <div class="card-body">

                                        <div class="row text-center justify-content-center">
                                            <div class="col-md-8 align-self-center ">
                                                <div class="register-btn">
                                                    <button class="btn btn-success btn-sm pr-5 pl-5" type="submit" id="">Add</button>
                                                    <a href="<?= base_url(); ?>admin/get_application" class="btn btn-sm pr-5 pl-5" style="background-color:#032da1;color:white;">Back</a>
                                                </div>
                                            </div>


                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </form>

                </div>


            </div>
        </div>
        <!----admin template section end---->
    </main>
    <!--End right-top side-->

</div>
<script>
    $("#p_icon3").click(function() {

        $(this).toggleClass("icon-y");

        var input = $("#password3");
        if (input.attr("type") == "password") {
            input.attr("type", "text");
        } else {
            input.attr("type", "password");
        }
    });
    $("#p_icon4").click(function() {

        $(this).toggleClass("icon-y");

        var input = $("#password4");
        if (input.attr("type") == "password") {
            input.attr("type", "text");
        } else {
            input.attr("type", "password");
        }
    });

    $('#sbatch').change(function() {
        var sbatch = $(this).val();
        $('#totalfee').val('');
        var divData = '';
        if (sbatch != '' && sbatch != 0) {
            $('#batch_error').addClass("d-none");
            $.ajax({
                url: "<?php echo base_url(); ?>Admin/get_batch_course",
                method: "post",
                data: {
                    batch_id: sbatch,
                },
                dataType: "json",
                success: function(response) {

                    divData += "<option value=''> Select Course </option>";
                    if (response != '') {
                        $.each(response, function(i, coursedata) {
                            divData += "<option value='" + coursedata.id + "'>" + coursedata.course_name + "</option>";
                        });
                    } else {
                        divData += "<option value=''> -- No course's Found --</option>";
                        // $('#course_error_msg').text("Please create application fee for particular course");
                    }
                    $('#scourse').empty().append(divData);
                }
            });
        } else {
            $('#batch_error').removeClass("d-none");
        }
    });


    $('#scourse').change(function() {
        var course = $('#scourse option:selected').val();
        var batch = $('#sbatch option:selected').val();
        var divData = '';
        var div_data = '';
        var total_fee = '';
        $('#fee-section').html("");
        $('#total-fee').text();
        if (course != '' && course != 0) {
            $('#course_error').addClass("d-none");
            $.ajax({
                url: "<?php echo base_url(); ?>Admin/get_sectionbycourse",
                method: "post",
                data: {
                    course_id: course,
                    batch_id: batch
                },
                dataType: "json",
                success: function(response) {
                    // Application Fee code and Start from here 
                    if (response.application_fee != 0) {
                        var ParseData = JSON.parse(response.application_fee);
                        total_fee = (ParseData.amount != '') ? ParseData.amount : '';
                        // alert(total_fee);
                        $('#totalfee').val(total_fee);
                    } else {
                        div_data += '<div class="payment-row"><p class="text-danger"  style="font-size:14px"> Applicatfon Fee Not Found  </p></div>';
                        $('#totalfee').val(total_fee);
                    }
                    $('#fee-section').append(div_data);
                    // Application Fee code and End from here 

                    // section options code and start from here 

                    divData += "<option value=''> Select Section </option>";
                    if (response.sections != '') {
                        $.each(response.sections, function(i, sectiondata) {
                            divData += "<option value='" + sectiondata.section_id + "'>" + sectiondata.section_name + "</option>";
                        });
                    }
                    // $('#course_error_msg').text();
                    else {
                        divData += "<option value=''> -- No Section's Found --</option>";

                    }
                    $('#s_section').empty().append(divData);
                    // section options code here End from here 

                }
            });
        } else {
            $('#course_error').removeClass("d-none");
        }
    });






    // $('#sbatch').change(function() {
    //     var sbatch = $(this).val();
    //     var scourse = $('#scourse option:selected').val();
    //     // alert(scourse);
    //     var div_data = '';
    //     var total_fee = 0;
    //     $('#fee-section').html("");
    //     $('#total-fee').text();

    //     if (scourse != '' && scourse != 0) {
    //         $('#course_error').addClass("d-none");
    //         $.ajax({
    //             url: "<?php //echo base_url(); 
                            ?>Student/get_applicationfee",
    //             method: "post",
    //             data: {
    //                 batch_id: sbatch,
    //                 course_id: scourse
    //             },
    //             dataType: "json",
    //             success: function(data) {

    //                 if (data != 0) {
    //                     total_fee = (data.amount != '') ? data.amount : 0;
    //                     $('#totalfee').val(total_fee);
    //                 } else {
    //                     div_data += '<div class="payment-row"><p class="text-danger"  style="font-size:14px"> Applicatfon Fee Not Found  </p></div>';

    //                     $('#totalfee').val(total_fee);
    //                 }
    //                 $('#fee-section').append(div_data);
    //             }
    //         });
    //     } else {
    //         $('#course_error').removeClass("d-none");
    //     }
    // });

    // $('#scourse').change(function(){
    //     var course = $('#scourse option:selected').val();
    //     var divData='';
    //     if (course != '' && course != 0) {
    //         $('#course_error').addClass("d-none");
    //         $.ajax({
    //             url: "<?php //echo base_url(); 
                            ?>Admin/get_sectionbycourse",
    //             method: "post",
    //             data: {
    //                 course_id: course
    //             },
    //             dataType: "json",
    //             success: function(response) {
    //                 divData += "<option value=''> Select Section </option>";
    //                 if(response != ''){
    //                     $.each(response, function(i, sectiondata) {
    //                     divData += "<option value='"+sectiondata.section_id+"'>"+sectiondata.section_name+"</option>";
    //                     });
    //                 }
    //                 else {
    //                     divData += "<option value=''> -- No Section's Found --</option>";
    //                 }
    //                 $('#s_section').empty().append(divData);
    //             }
    //         });
    //     }
    //     else {
    //         $('#course_error').removeClass("d-none"); 
    //     }
    // });
</script>
<script>
    var description_section_validation = '';
    let discount_validation = '';
    $('#payment_method').change(function() {
        var payment = $('#payment_method :selected').val();

        if (payment == 'bank-transfer') {
            $('#discount_scholarship_div').empty();
            $('.description_section').removeClass('d-none');
            description_section_validation = 'required';
        } else {
            $('.description_section').addClass('d-none');
            description_section_validation = '';
        }

        if (payment == 'cash') {
            $('.discount_fine_section').removeClass('d-none');
            discount_validation = 'required';
        } else {
            $('.discount_fine_section').addClass('d-none');
            discount_validation = '';
        }


    });



    jQuery.validator.addMethod("fullnameregex", function(value, element) {
        return this.optional(element) || /^[a-zA-Z]{3,30}$/.test(value);
    }, 'Please enter alpha characters only ');

    jQuery.validator.addMethod("passwordregex", function(value, element) {
        return this.optional(element) || /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$#!%*?&])[A-Za-z\d@$!%*#?&]{6,16}$/.test(value);
    }, 'Your password must be atleast 6 characters long, which inculdes one upper case, one numerical value and one special character.');

    jQuery.validator.addMethod("emailregex", function(value, element) {
        return this.optional(element) || /^[a-zA-Z0-9._-]+@[a-zA-Z0-9-]+\.[a-zA-Z.]{2,8}$/.test(value);
    }, 'Email Address is invalid: Please enter a valid email address.');


    jQuery.validator.addMethod("phonenumberregex", function(value, element) {
        return this.optional(element) || /^[0-9]{8,14}$/.test(value);
    }, 'Please enter a 8-14 digits vaild phone number.');

    jQuery.validator.addMethod("zipregex", function(value, element) {
        return this.optional(element) || /^[0-9]{3,8}$/.test(value);
    }, 'Please enter 3 - 8 digits number: digits only allowed');

    jQuery.validator.addMethod("genral_regex", function(value, element) {
        return this.optional(element) || /^[a-zA-Z -#]{1,50}$/.test(value);
    }, 'Please enter alpha characters only');

    jQuery.validator.addMethod("alphanumeric_regex", function(value, element) {
        return this.optional(element) || /^[a-zA-Z0-9 -#]{1,50}$/.test(value);
    }, 'Please enter alpha characters only');

    var v = $("#addEditBatchForm").validate({

        ignore: ':hidden',

        rules: {
            sfname: {
                required: true,
                minlength: 3,
                maxlength: 30,
                fullnameregex: true,
            },
            ssname: {
                required: true,
                minlength: 1,
                genral_regex: true
            },
            semail: {
                required: true,
                email: true,
                emailregex: true
            },
            semailre: {
                required: true,
                equalTo: '[name="semail"]'
            },
            spaswd: {
                required: true,
                minlength: 6,
                maxlength: 12,
                passwordregex: true
            },
            spaswdre: {
                required: true,
                equalTo: '[name="spaswd"]'
            },
            scontact: {
                required: true,
                minlength: 8,
                maxlength: 14,
                phonenumberregex: true
            },
            sdob: "required",
            sgender: {
                required: true
            },
            scourse: {
                required: true
            },
            sbatch: {
                required: true
            },
            semfname: {
                required: true,
                genral_regex: true
            },
            semlname: {
                required: true,
                minlength: 1,
                genral_regex: true
            },
            semphone: {
                required: true,
                minlength: 8,
                maxlength: 14,
                phonenumberregex: true
            },
            scountry: {
                required: true,
                genral_regex: true

            },
            sstate: {
                required: true,
                genral_regex: true
            },
            saddress1: {
                required: true
            },
            szipcode: {
                required: true,
                zipregex: true
            },
            sibling_id: {
                required: true,
                alphanumeric_regex: true
            },
            // school: {
            //     required: true,
            // },
            // photo: {
            //     required: true,
            // },
            // exam: {
            //     required: true,
            // },
            // medical: {
            //     required: true,
            // },
            amount: {
                required: true
            },
            totalfee: 'required',
            payment_method: 'required'

        },
        messages: {
            semailre: {
                required: "Enter your Email",
                equalTo: "Please enter the same email address again.",
            },
            spaswdre: {
                equalTo: "Please enter the same password again.",
            },
            semphone: {
                minlength: "Please Enter a 8 digits valid phone Number",
                maxlength: "Please Enter a 14 digits valid phone Number",

            },
            scontact: {
                minlength: "Please Enter a 8 digits valid phone Number",
                maxlength: "Please Enter a 14 digits valid phone Number",

            },
            payment_method: {
                required: "Please Select Payment Method",
            },
            totalfee: {
                required: "Fees required",
            }



        },
        submitHandler: function(form, e) {
            e.preventDefault();
            var appFee = $('#totalfee').val();
            var cash = $("#payment_method option:selected").val();
            var dic = $("#dicount_scholar option:selected").val();

            if (cash === 'cash' && (dic === 'discount' || dic === 'scholarship')) {
                if (!$('.dynamic_discount').val()) {
                    $('.item_err').empty();
                    $('.dynamic_discount').after(
                        '<span class="item_err" style="color:red">Please enter amount </span>');

                } else if (parseInt($('.dynamic_discount').val()) > parseInt(appFee)) {
                    $('.item_err').empty();
                    $('.dynamic_discount').after(
                        '<span class="item_err" style="color:red">Please enter amount which is less than the current fee (' +
                        appFee + ')</span>');

                } else {
                    $('.item_err').empty();
                    form.submit();

                }

            } else {
                $('.item_err').empty();
                form.submit();
            }

        }

    });


    function add_dicount_scholar(ele) {

        $('#discount_scholarship_div').empty();
        if (ele.value == 'discount' || ele.value == 'scholarship') {
            $('#discount_scholarship_div').append(
                '<input type="text" onkeypress="return numbersOnlyValidation(event)" min="0" onkeyup="deductAmountFromTotalFee(this)" name="scOrDesc" class="dynamic_discount form-control" placeholder="Enter the amount" class="form-control" />'
            );
        }

    }


    const deductAmountFromTotalFee = (input_item) => {
        let deductAmt = (input_item.value) ? input_item.value : 0
        let totalfee = $('#totalfee').val();
        let TotalpayableAmt = (totalfee) ? totalfee : 0;

        if (parseInt(deductAmt) > parseInt(TotalpayableAmt)) {
            $('.item_err').empty();
            $(input_item).after(
                '<span class="item_err" style="color:red">Please enter amount which is less than the current fee (' +
                TotalpayableAmt + ')</span>');
        } else {
            $('.item_err').empty();
        }

    }




    function numbersOnlyValidation(e) {

        var keyCode = e.keyCode || e.which;

        //Regex for Valid Characters i.e. Alphabets and Numbers.
        var regex = /^[0-9]+$/;

        //Validate TextBox value against the Regex.
        var isValid = regex.test(String.fromCharCode(keyCode));

        return isValid;
    }
</script>
<script type="text/javascript">
    $(function() {
        $("#sibling").change(function() {
            if (this.checked) {
                $('#sibling_outer_div').show();
            } else {
                $('#sibling_outer_div').hide();
            }
        });

        $('#sibling_id').change(function() {
            let val = $(this).val();

            if (val.length > 0) {
                $.ajax({
                    url: '<?php echo base_url() ?>' + 'admin/ajax_check_if_exists',
                    data: {
                        value: val,
                        column: 'studentId',
                        table: 'students',
                        required: 'parent_username'
                    },
                    type: 'POST',
                    async: false,
                    success: function(data) {
                        console.log(data);
                        $('#sibling_id_err').empty();
                        if (data == 'failed') {
                            console.log('failed');
                            $('#sibling_id_err').text('There is no student with provided Id : ' + val);
                            $('#sibling_id').val('');
                        } else {
                            console.log(data);
                            $('#sibling_parent').val(data);
                        }
                    }
                });
            }
        })

    })
</script>