EVOLUTION-NINJA

Edit File: student_edit.php

<?php echo view('includes/home_sidebar');?>
<style>
    /* uplaod image styles------  */
    .div-img--contents {
        width: 180px;
        height: 180px;
    }
    #leftDiv{
    height: 1100px !important;
}
    .img-wrapper {
        width: 100%;
        height: 100%;
        border: 0.5px solid #ccc;
        position: relative;

}

.img-wrapper .img--upload {
        width: 100%;
        height: 100%;
        overflow: hidden;
        position: absolute;

}

.img-wrapper .img--upload #up-img {
        width: 180PX;
        height: 180PX;
        /* object-fit: contain; */

}

.custom-btn {
        background-color: #0065A3;
        color: white;
        border: none;
        outline: none;
        width: 100%;
        padding: 4px 10px;
        margin: 0;
        margin-top: 8px;

}

.custom-btn:hover {
        background-color: #0065A3;
        color: white;

}

@media only screen and (max-width:728px) {

.div-img--contents {
            width: 157px;
            height: 157px;
            margin-bottom: 57PX;
        }
    }
    .star-mad {
        color: #c83434;
    font-size: 20px;
    position: relative;
    top: 2px;
}
#add-more-file {
    position: absolute;
    right: -13px;
    top: 120px !important;
    font-size: 24px;
}
</style>
<main id="rightDiv">
    <div class="container-fluid">
        <div class="row">

<div class="col-sm-12">
                
                <section class="Add-student  ">
                    <button class="btn add-stud">Edit Enroll Students / Admission Application &nbsp;
                        
                    </button>

<button class="btn back-butt" onclick="goBack()"><i class="fa fa-arrow-left"
                            aria-hidden="true"></i>&nbsp;Back</button>

</section>

<section class="mt-3 mb-5">
                    <form id="studentapplicatonupdate">
                        <div class="student-education-detail">
                            <div class="detail-names  mt-2">
                                <h6>Header  </h6>
                                <input type='hidden' value='<?php echo $id ;?>' name='id' />
                                <select class="form-select" id="header" name="header_name"  >
                                </select>
                            </div>
                            <div class="detail-names">
                                <h6>Value <span class="star-mad">*</span></h6>
                                <select class="form-select inp-boxes-fee" id="description" name="value_name" required>
                                </select>
                            </div>
                            <div class="detail-names mt-2">
                                <h6>Fees</h6>
                                <input type="text" class="form-control mt-1" value="<?php echo $total_fees ;?>" name="total_fees" id="fees" >
                            </div>
                            <div class="detail-names  mt-2">
                                <h6>Duration (In Hours)</h6>
                                <input type="text" class="form-control" value="<?php echo $duration ;?>" name="duration" id="duration" >
                            </div>

</div>

<div class="student-form-detail-entry">
                            <div class="input-fields-student-form a1"><label for="First-Name">First
                                    Name <span class="star-mad">*</span></label></br><input type="text" placeholder="" value="<?php echo $first_name ;?>" name="first_name" id="First-Name"
                                    class="inp-boxes form-control" required /></div>
                            <div class="input-fields-student-form a2 mt-2"><label for="Last-Name">Last
                                    Name </label></br><input type="text" placeholder="" value="<?php echo $last_name ;?>" name="last_name" id="Last-Name"
                                    class="inp-boxes form-control mt-1"  /></div>
                            <div class="input-fields-student-form a3"><label for="date">Date
                                    (dd/mm/yyyy) <span class="star-mad">*</span></label></br><input type="date" value="<?php echo $date ;?>" name="date" id="date"
                                    class="inp-boxes form-control" required /></div>
                            <div class="input-fields-student-form a4">

<div class="div-img--contents">
                                    <label for="">Upload Photo</label>
                                    <div class="img-wrapper inp-boxes">
                                        <div class="img--upload">
                                            <img src="<?php echo base_url('public/assets/studentimages/').$profile_image;?>" alt="" id="up-img"   >
                                        </div>
                                    </div>
                                    <input type="file" class="default-btn" id='input-img' value='<?php echo $profile_image;?>' name="profile-image" hidden>
                                    <button type="button" class="custom-btn btn"
                                        onclick="referDefaultBtn()">UPLOAD</button>
                                </div>

</div>

<div class="input-fields-student-form a5"><label for="dob">DOB
                                    (dd/mm/yyyy) <span class="star-mad">*</span></label></br><input type="date" placeholder="" value="<?php echo $dob ;?>" name="dob" id="dob"
                                    class="inp-boxes form-control   " required /></div>
                            <div class="input-fields-student-form a6"><label for="Email">Email <span class="star-mad">*</span></label></br><input
                                    type="email" placeholder="" name="email" id="Email" value="<?php echo $email ;?>" class="inp-boxes form-control "
                                    required /></div>
                            <div class="input-fields-student-form a7"><label for="student-gender">Gender <span class="star-mad">*</span></label></br>
                                <select class="form-select inp-boxes" name="gender" id="student-gender" required>

<option  value="">Select</option>
                                    <option value="male" <?php echo $gender=='male' ? 'selected' :'' ?>>Male</option>
                                    <option value="female" <?php echo $gender=='female' ? 'selected' :'' ?>>Female</option>
                                </select>
                            </div>
                            <div class="input-fields-student-form a8"><label for="phone">Mobile <span class="star-mad">*</span></label></br>
                            <input type="tel" placeholder="" id="phone" oninput="validateInputnum(this)" name="mobile_no" maxlength="10" value="<?php echo $mobile_no ;?>"
                                    class="inp-boxes form-control  " required /></div>
                            <div class="input-fields-student-form a9"><label
                                    for="student-aualification">Qualification <span class="star-mad">*</span></label></br><input type="text"
                                    name="qualification" placeholder="" value="<?php echo $qualification;?>" id="student-aualification"
                                    class="inp-boxes form-control " required /></div>
                            <div class="input-fields-student-form a10"><label for="student-source">Source <span class="star-mad">*</span></label></br>
                                <select class="form-select inp-boxes" id="student-source" name="source" required>
                                    <option  value="">Select</option>
                                    <option value="Online" <?php echo $source=='Online' ? 'selected' :'' ?>>Online</option>
                                    <option value="Offline" <?php echo $source=='Offline' ? 'selected' :'' ?>>Offline</option>
                                </select>
                            </div>
                            <div class="input-fields-student-form a11"><label for="student-address">
                                    Address <span class="star-mad">*</span></label></br>
                                    <textarea name="address" id="student-address" class="form-control" required><?php echo htmlspecialchars($address); ?></textarea>
                                
                            </div>
                            <div class="input-fields-student-form a12  mt-2"><label
                                    for="student-profession">Profession </label></br>
                                <select class="form-select inp-boxes" id="student-profession" name="profession"> 
                                    <option  value="">Select</option>
                                    <option value="IT" <?php echo $profession=='IT' ? 'selected' :'' ?>>IT</option>
                                    <option value="NON-IT" <?php echo $profession=='NON-IT' ? 'selected' :'' ?>>NON-IT</option>
                                </select>
                            </div>
                            <div class="input-fields-student-form a13"><label for="student-city">City <span class="star-mad">*</span></label></br>
                                <input class="form-control inp-boxes" value="<?php echo $city;?>" id="student-city" name="city" required />
                            </div>
                            <div class="input-fields-student-form a14"><label for="student-country">Country <span class="star-mad">*</span></label></br>

<option  value="">Select</option>
                                    <option value="India"<?php echo $country=="India" ? 'selected' : '' ;?> >India</option>
                                </select> -->
                            </div>
                            <div class="input-fields-student-form a15 mt-2"><label for="student-status">Status </label></br>
                                <select class="form-select inp-boxes mt-1" id="student-status" name="status" >

<option  value="">Select</option>
                                    <option value="Employed" <?php echo $status=='Employed' ? 'selected':'';?>>Employed</option>
                                    <option value="unEmployed" <?php echo $status=='unEmployed' ? 'selected':'';?>>Unemployed</option>
                                </select>
                            </div>
                            <div class="input-fields-student-form a16"><label for="course-offered-tostudents">Course
                                    Offered  <span class="star-mad">*</span></label></br><input type="text" placeholder="" name="course_offered" value="<?php echo $course_offered;?>"
                                    id="course-offered-tostudents" class="inp-boxes form-control   " required /></div>
                            <div class="input-fields-student-form a17"><label for="Counselor Name">Counselor
                                    Name  <span class="star-mad">*</span></label></br><input type="text" placeholder="" name="counselor_name" value="<?php echo $counselor_name;?>"
                                    id="Counselor Name" class="inp-boxes form-control   " required /></div>
                            <div class="input-fields-student-form a18  mt-2"><label for="College-Company Name">College / Company
                                    Name   </label></br><input type="text" placeholder="" name="company_name" value="<?php echo $company_name;?>"
                                    id="College-Company Name" class="inp-boxes form-control   "  /></div>
                            <div class="input-fields-student-form a19  mt-2"><label
                                    for="student-Remarks">Remarks   </label></br><input type="text" name="remarks" value="<?php echo $remarks;?>"
                                    placeholder="" id="student-Remarks" class="inp-boxes form-control   "  />
                            </div>

<div class="input-fields-student-form a20  mt-2"><label
                                    for="student-Remarks">Aadhar No   </label></br><input type="text" placeholder="" oninput="validateInputnumadhar(this)"
                                    id="student-Remarks" name="adhaar_no" maxlength="14" class="inp-boxes form-control" required value="<?php echo $adhaar_no;?>"/></div>

<div class="input-fields-student-form a22" id="more-file-div">
                                    <?php
                                    $documentList = explode(',', $documents);
                                    ?>
                                    <div class="input-fields-student-form a23">
                                        <label>Existing Documents</label><br>
                                        <ul>
                                            <?php 
                                            $documentList = explode(',', $documents);
                                            foreach ($documentList as $doc): ?>
                                                <li>
                                                    <a href="public/assets/studentdocuments/<?php echo $doc; ?>" target="_blank"><?php echo $doc; ?></a>
                                                </li>
                                            <?php endforeach; ?>
                                        </ul>
                                    </div>
                                    <label for="more-files-upload">Upload documents</label></br>
                                    <input type="file" name="document[]" class="form-control" > <i class="fa fa-plus-square-o"
                                        aria-hidden="true" id="add-more-file"></i>
                                    <div id="file-add-div"></div>
                                    
                                    </div>    
                               
                                      
                        <div class="input-fields-student-form a21"><button type="submit"
                                class="submit-student-form" id='app-btn'>Update</button>
                        </div>
                        </div>
                    </form>
                </section>

</div>

</div>
    </div>
</main>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.10.8/dist/sweetalert2.all.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/sweetalert2@11.10.8/dist/sweetalert2.min.css" rel="stylesheet">
<script>
    // Application form 
    $(document).ready(function () {
        $('#studentapplicatonupdate').submit(function (e) {
            e.preventDefault();
            if ($('#up-img').attr('src') == '') {
                Swal.fire({
                    icon: 'error',
                    title: 'Please upload a profile picture',
                    showConfirmButton: true
                });
                return;
            }
            var formdata = new FormData($(this)[0]);
            $('#app-btn').text('updatting...');
            $('#app-btn').attr('disabled', 'disabled');
            $.ajax({
                type: 'post',
                url: '<?php echo base_url("application-form-update");?>',
                data: formdata,
                contentType: false,
                processData: false,
                success: function (response) {
                    if (response.result == 1) {
                        Swal.fire({ icon: "success", title: response.message, showConfirmButton: false, timer: 2000 });
                        $('#studentapplicatonupdate')[0].reset();
                        $('#up-img').attr('src', '').attr('hidden', true);
                        $('#datatable').DataTable().ajax.reload();
                        window.location.href = '<?php echo base_url("student-list");?>';
                    } else {
                        Swal.fire({ icon: "error", title: response.message, showConfirmButton: false, timer: 1000 });
                    }
                    $('#app-btn').removeAttr('disabled').text("update");
                },
                error: function (xhr, textStatus, errorThrown) {
                    console.error(xhr.responseText);
                    Swal.fire({ icon: "error", title: "An error occurred", showConfirmButton: false, timer: 1000 });
                },
                complete: function () {
                    $('#app-btn').removeAttr('disabled').text("update");
                }
            });
        });
    });
    var selectedheader='<?php echo $header_name?>';
    var selectedvalue='<?php echo $value_name?>';
    //course select
    $(document).ready(function () {
        $.ajax({
            type: 'GET',
            url: '<?php echo base_url("get-header");?>',
            dataType: 'json',
            success: function (response) {
                if (response.result == 1) {
                    var options = response.data;
                    var selectElement = $('#header');
                    selectElement.empty();
                    $('#header').html('<option value="" selected >Select course</option>');
                    $.each(options, function (index, option) {
                        if(option.id!=36){
                            selectElement.append($('<option>', {
                            value: option.id,
                            text: option.header_name
                        }));
                        }
                    });
                    selectElement.val(selectedheader).trigger('change');
                } else {
                    $('#header').html('<option value="">Course not found</option>');
                }
            },
            error: function (xhr, status, error) {
                console.error(xhr.responseText);
            }
        });
        // Second select dropdown
        $('#header').change(function () {
            var headerId = $(this).val();
            $.ajax({
                type: 'GET',
                url: '<?php echo base_url("get-value");?>?id=' + headerId,
                dataType: 'json',
                success: function (response) {
                    if (response.result == 1) {
                        var options = response.data;
                        var selectElement = $('#description');
                        selectElement.empty();
                        $('#description').html('<option value="" selected >Select value</option>');
                        $.each(options, function (index, option) {
                            selectElement.append($('<option>', {
                                value: option.id,
                                text: option.value_name
                            }));
                        });
                        selectElement.val(selectedvalue).trigger('change');
                    } else {
                        $('#description').html('<option value="">value not found</option>');
                    }
                },
                error: function (xhr, status, error) {
                    console.error(xhr.responseText);
                }
            });
        });
        // fee details
        $('#description').change(function () {
            var valueId = $(this).val();
            $.ajax({
                type: 'GET',
                url: '<?php echo base_url("get-fees");?>?id=' + valueId,
                dataType: 'json',
                success: function (response) {
                    if (response.result == 1) {
                        var feedata = response.data[0];
                        $('#fees').val(feedata.fees);
                        $('#duration').val(feedata.duration);
                    } else {
                        $('#fees').val('NOT FOUND');
                        $('#duration').val('NOT FOUND');
                    }
                },
                error: function (xhr, status, error) {
                    console.error(xhr.responseText);
                }
            });
        });
    })
</script>

const rightDivHeight = rightDiv.offsetHeight;

leftDiv.style.height = rightDivHeight + 'px';
    };

</script>

<script>
    function goBack() {
        window.location.href = "<?php echo base_url('student-list');?>";
    }
</script>

<script>
    let defaultButton = document.querySelector(".default-btn");
    let customButton = document.querySelector(".custom-btn");
    let image = document.getElementById("up-img");

function referDefaultBtn() {
        defaultButton.click();
    }
    function cancelUpload() {
        image.src = "";
        defaultButton.value = "";
    }
    defaultButton.addEventListener("change", function () {
        const file = this.files[0];
        if (file) {
            let reader = new FileReader();
            reader.onload = function () {
                const result = reader.result;
                image.hidden = false;

image.src = result;
            }
            reader.readAsDataURL(file);
        }
    });
</script>
<script>
    let more_file = document.querySelector("#add-more-file");
    let fil = document.querySelector("#file-add-div");
    more_file.addEventListener("click", function files_add() {
        var inpp = document.createElement(`input`);
        inpp.classList.add('form-control');
        inpp.type = 'file';
        inpp.name = 'document[]';
        fil.appendChild(inpp);
    }) 
</script>

<script>
    function validateInputnum(inputField) {
      var regex = /^[0-9\s\+]+$/;
      var inputValue = inputField.value;
      if (!regex.test(inputValue)) {
        inputField.value = inputValue.replace(/[^0-9\s\+]/g, '');
		toastr.error('Only numerical numbers,space and + are allowed.');
      }
    }
  </script>

<script> 
    function validateInputnumadhar(inputField) {
      var regex = /^[0-9\s]+$/;
      var inputValue = inputField.value;
      if (!regex.test(inputValue)) {
        inputField.value = inputValue.replace(/[^0-9\s]/g, '');
		toastr.error('Only numerical numbers,space are allowed.');
      }
    }
  </script>

<script type="text/javascript" src="<?php echo base_url('public/assets/js/intlTelInput.js');?>"></script>
    <script>
        var input = document.querySelector("#phone");
        window.intlTelInput(input, {
          autoPlaceholder: "on",
          utilsScript: "js/utils.js",
        }); 
      </script>