EVOLUTION-NINJA

Edit File: user_profile1.php

<?php echo view('includes/header');?>
<link href="<?php echo base_url('public/assets/css/jquery-ui.css');?>" rel="stylesheet">
<link rel="stylesheet" href="<?php echo base_url('public/assets/toastr/toastr.min.css');?>">
<script type="text/javascript" src="<?php echo base_url('public/assets/toastr/toastr.min.js');?>"></script>
<script src="<?php echo base_url('public/assets/js/jquery-ui.js');?>"></script>
<div id="page-wrapper" style="background: aliceblue;">
    <div class="row">
        <div class="col-lg-12">
           <h3 style="padding-bottom:10px;border-bottom:2px dashed #ccc;margin-bottom:20px; font-weight:bold;text-align:center;">MY PROFILE</h3>
        </div>
        
        
        <a href="javascript:history.back()" class="btn btn-primary" style="float:right; margin-right:30px; margin-bottom: 20px;">Back</a>
    </div>

<div class="row my_header">
    <div class="container-fluid" >
         <div class="col-md-2" style="display: flex;flex-direction: column;justify-content: center;align-items: center;">

<?php 
            if($user_details->image == ""){
             ?>
                <img id="display_img" src="<?= base_url('public/assets/images/user-icon.jpg');?>" width="150px" height="150px" />
            <?php
            }
            else{
                $image_path = base_url('public/course_images') . '/' . $user_details->image;
            ?>
               <img id="display_img" src="<?=  $image_path; ?>" width="206px" height="206px" />
            <?php
            }
            ?>
        </div>

<div class="col-sm-10 col-md-10 col-lg-10 instructor_middle_right">
            <form class="form-horizontal" id="edit_profile">
                <input type="hidden" name="login_id" class="login_id" value="<?php echo $user_details->login_id; ?>"> 
               <div class="form-group">
                    <label class="control-label col-sm-1">User name:<span style="color:red;"> *</span></label>
                    <div class="col-sm-8 view_faculty">
                       <input class="form-control" type="text" name="user_name" pattern="[a-zA-Z ]+" value="<?php echo $user_details->full_name; ?>" required> 
                    </div>
                </div>

<div class="form-group">
                    <label class="control-label col-sm-1">Email:<span style="color:red;"> *</span></label>
                    <div class="col-sm-8 view_faculty">
                       <input class="form-control" type="email" name="email" value="<?php echo $user_details->email; ?>" required readonly> 
                    </div>
                </div>

<div class="form-group">
                    <label class="control-label col-sm-1">Phone Number:<span style="color:red;"> *</span></label>
                    <div class="col-sm-8 view_faculty">
                       <input class="form-control" type="text" name="phone_number" pattern="^[0-9]{10}$" maxlength= "10" minlength= "10" value="<?php echo $user_details->phone_number; ?>" required> 
                    </div>
                </div>
                
                <div class="form-group">
                    <label class="control-label col-sm-1">D.O.B<span style="color:red;"> *</span></label>
                    <div class="col-sm-3 view_faculty">
                       <input type="text" name="dob" id="dob" class="form-control" value="<?php echo $user_details->dob; ?>">
                    </div>
                    <label class="control-label col-sm-1">Age<span style="color:red;"> *</span></label>
                    <div class="col-sm-3 view_faculty">
                       <input type="text" name="age" class="form-control" readonly="" value="<?php echo $user_details->age; ?>">
                    </div>
                </div>
                
                <div class="form-group">
                    <label class="control-label col-sm-1">Blood Group<span style="color:red;"></span></label>
                    <div class="col-sm-8 view_faculty">
                       <select class="form-control" name="blood_group" value="<?php echo $user_details->blood_group ;?>">
                       <option value="<?php echo $user_details->blood_group; ?>">A+</option>
                      <option value="">Select</option>
                      <option value="A+">A+</option>
                      <option value="A-">A-</option>
                      <option value="B+">B+</option>
                      <option value="B-">B-</option>
                      <option value="AB+">AB+</option>
                      <option value="AB-">AB-</option>
                      <option value="O+">O+</option>
                      <option value="O-">O-</option>
                    </select> 
                    </div>
                </div>
                
                
                <div class="form-group">
                    <label class="control-label col-sm-1">Education<span style="color:red;"></span></label>
                    <div class="col-sm-8 view_faculty">
                       <input class="form-control" type="text" name="education" value="<?php echo $user_details->qualification ?>"> 
                    </div>
                </div>

<div class="form-group">
                    <label class="control-label col-sm-1">Address:<span style="color:red;"></span></label>
                    <div class="col-sm-8 view_faculty">
                       <textarea class="form-control" name="address"><?php echo $user_details->address; ?></textarea>   
                    </div>
                </div>

<div class="form-group">
                    <label class="control-label col-sm-1">Image:</label>
                  <div class="col-sm-8">
                    <input type="file" class="form-control form-control-file" onchange="document.getElementById('display_img').src = window.URL.createObjectURL(this.files[0])" name="profile_pic">
                  </div>
                </div>

<div class="form-group">
                    <div class="col-sm-8 view_faculty">
                       <button type="submit" class="col-md-offset-10 btn btn-primary submit">Update</button>
                    </div>
                </div>

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

</div>
<script type="text/javascript">
$(document).ready(function(){
    $('#dob').datepicker({ 
      changeMonth:true,
      changeYear:true,
      yearRange: "1940:c",
      maxDate: '0',
     // dateFormat: 'yy-mm-dd' 
      dateFormat: 'dd-mm-yy'
  });

$("input[name=dob]").change(function(){
    var dob  = $("input[name=dob]").val();
    var dob1 = dob.split("-").reverse().join("-");

dob1 = new Date(dob1);
    var today = new Date();
    var age = Math.floor((today-dob1) / (365.25 * 24 * 60 * 60 * 1000));
    $("input[name=age]").val(age);
    
  });
});
</script>

$('#edit_profile').submit(function (e) {
    e.preventDefault();
    console.log('Form submitted');
    formdata = new FormData($(this)[0]);
   
    $(".submit").attr('disabled', 'disabled');
    $(".submit").text("Updating...");

$.ajax({
        type: 'post',
        url: '<?php echo site_url("update_user_profile")?>',
        data: formdata,
        contentType: false,
        processData: false,
        success: function (response) {
            try {
                response = jQuery.parseJSON(response);
                toastr[response.result == 1 ? "success" : "error"](response.message);
                
                if (response.result == 1) {
                    $('#edit_profile')[0].reset();
                    $(".submit").text("Update");

window.location.reload();

} else if (response.result == 2) {
                    $('#edit_profile')[0].reset();
                    $(".submit").text("Update");
                    window.location = '<?php echo site_url("user-logout")?>';
                }
            } catch (e) {
                // Response is not JSON (probably when uploading a file)
                console.log("Not a JSON response:", response);
                toastr["success"]("updated successfully.");
                // window.location.reload();
            }

$(".submit").text("Update");
            $(".submit").removeAttr('disabled');
        },
        error: function (xhr, status, error) {
            toastr["error"]("Failed to update. Please try again.");
            console.error(xhr.responseText);
            $(".submit").text("Update");
            $(".submit").removeAttr('disabled');
        }
    });
});

</script>