Update Image Using AJAX PHP - javascript

I am facing an issue with updating image to database using AJAX and a Modal, following are the details:
I have a main page named edit_employee.php, code below:
<!DOCTYPE html>
<?php
$ROOT='../../';
include('../config/db_connect.php');
require_once '../config/auth.php';
?>
<html lang="eng">
<head>
<title>Employee List | Employee Attendance Record System</title>
<?php include('../includes/header.php') ?>
</head>
<body>
<?php include('../includes/nav_bar.php') ?>
<div class="container-fluid admin" >
<div class="alert alert-success">Employee Center-Edit</div>
<div class="well col-lg-12 mt-5">
<!-- <button class="btn btn-success" type="button" id="new_emp_btn"><span class="fa fa-plus"></span> Add new </button> -->
<table id="table" class="table table-bordered table-striped">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Designation</th>
<th>Department</th>
<th>Joining Date</th>
<th>Picture</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php
$employee_qry=$conn->query("SELECT * FROM employee WHERE status='Active' ORDER BY employee_id ASC") or die(mysqli_error());
while($row=$employee_qry->fetch_array()){
?>
<tr>
<td><?php echo $row['employee_id']?></td>
<td><?php echo $row['first_name']?></td>
<td><?php echo $row['designation']?></td>
<td><?php echo $row['department']?></td>
<td><?php echo date("F d, Y", strtotime($row['doj'])) ?></td>
<td><img <?php echo 'src="data:image/jpeg;base64,'.base64_encode($row['picture'] ).'"' ?> height="50px" width="75px" /></td>
<td>
<center>
<button class="btn btn-sm btn-outline-success edit_employee" data-id="<?php echo $row['employee_id']?>" type="button"><i class="fa fa-edit"></i></button>
<button class="btn btn-sm btn-outline-danger remove_employee" data-id="<?php echo $row['employee_id']?>" type="button"><i class="fa fa-trash"></i></button>
</center>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</div>
<!--MODALS-->
<?php include ($_SERVER['DOCUMENT_ROOT'].'/astrahrms/admin/employees/modals/modal_editemp.php'); ?>
<?php include ($_SERVER['DOCUMENT_ROOT'].'/astrahrms/admin/employees/modals/modal_deleteemp.php'); ?>
<!--MODALS END-->
</body>
<!--SCRIPTS-->
<?php include ($_SERVER['DOCUMENT_ROOT'].'/astrahrms/admin/employees/scripts/edit_emp.php'); ?>
</html>
page has a button having class edit_employee which opens a modal on click, I used javascript and ajax for this (ajax contained in php include ($_SERVER['DOCUMENT_ROOT'].'/astrahrms/admin/employees/scripts/edit_emp.php')), below is the code for your reference:
<script>
$(document).ready(function(){
$('.edit_employee').click(function () {
var id=$(this).attr('data-id');
// AJAX request
$.ajax({
url: './functions/get_employee.php',
type: 'post',
data: {id:id},
success: function(response){
// Add response in Modal body
$('.modal-body').html(response);
// Display Modal
$('#editmodal').modal('show');
}
});
});
});
</script>
This opens a modal with some employee information and employee image, I put this modal in get_employee.php, code below for your reference:
<style>
label{
display: inline-block;
width: 155px;
text-align: right;
}
.form-control{
display: inline-block !important;
}
.profile-pic-div{
height: 120px;
width: 120px;
position: relative;
top: 100px;
left: auto;
margin-left: 350px;
transform: translate(-50%,-50%);
overflow: hidden;
border-top: 7px solid rgb(12, 189, 189);
display:table-cell;
}
#photo{
height: 100%;
width: 100%;
}
#file{
display: none;
}
#uploadBtn{
height: 30px;
width: 100%;
position: absolute;
top: 140px;
left: auto;
transform: translateX(-50%);
text-align: center;
background: rgba(0, 0, 0, 0.7);
color: wheat;
line-height: 30px;
font-family: sans-serif;
font-size: 15px;
cursor: pointer;
display: none;
z-index: 9999;
}
.col-auto img{
background-color:rgb(12, 189, 189);
width: 5%;
cursor: pointer;
padding: 3px;
}
</style>
<!-- PICTURE sCRIPT -->
<script type="text/javascript">
$(document).ready(function(){
$('#editmodal').on('hidden.bs.modal', function (e) {
location.reload();
});
});
//declearing html elements
const imgDiv = document.querySelector('.profile-pic-div');
const img = document.querySelector('#photo');
const file = document.querySelector('#file');
const uploadBtn = document.querySelector('#uploadBtn');
//if user hover on img div
imgDiv.addEventListener('mouseenter', function(){
uploadBtn.style.display = "inline-block";
});
//if we hover out from img div
imgDiv.addEventListener('mouseleave', function(){
uploadBtn.style.display = "none";
});
//lets work for image showing functionality when we choose an image to upload
//when we choose a foto to upload
file.addEventListener('change', function(){
//this refers to file
const choosedFile = this.files[0];
if (choosedFile) {
const reader = new FileReader(); //FileReader is a predefined function of JS
reader.addEventListener('load', function(){
img.setAttribute('src', reader.result);
});
reader.readAsDataURL(choosedFile);
}
});
</script>
<?php
$ROOT='../../';
include '../../config/db_connect.php';
$id=$_POST['id'];
include_once('../../config/db_connect.php');
if (!$conn) {
die('Could not connnect: ' . mysqli_error($conn));
}
$query="SELECT * FROM employee WHERE employee_id = '$id'";
$result = mysqli_query($conn,$query);
$row = $result->fetch_array();
?>
<div class="container-fluid">
<ul class="nav nav-tabs text-success" id="myTab">
<li class="nav-item">
<a class="nav-link text-info border_bottom border_bottom_info active" data-toggle="tab" href="#personal">Personal Information</a>
</li>
<li class="nav-item">
<a class="nav-link text-info" data-toggle="tab" href="#company">Company Information</a>
</li>
<li class="nav-item">
<a class="nav-link text-info" data-toggle="tab" href="#payroll">Payroll Information</a>
</li>
<li class="nav-item">
<a class="nav-link text-info" data-toggle="tab" href="#incentives">Benefits/Incentives</a>
</li>
</ul>
</div>
<div class="tab-content container-fluid" id="myTabContent">
<!--Personal Information-->
<div class="tab-pane fade show active" id="personal">
<div class="well col-lg-12" id="displaydata">
<!--CONTENT HERE-->
<div class="row">
<div class="col-lg-6 float-left">
<div class="col-auto mt-3">
<label for="" class="mr-2">First Name: </label>
<input type="text" class=" form-control w-50 " id="firstname" name="firstname" required value="<?php echo $row['first_name'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Last Name: </label>
<input type="text" class=" form-control w-50 " id="lastname" name="lastname" required value="<?php echo $row['last_name'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">CNIC Number: </label>
<input type="text" class=" form-control w-50 " id="cnic" name="cnic" required value="<?php echo $row['cnic'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Permanent Address: </label>
<input type="text" class=" form-control w-50 " id="paddress" name="paddress" required value="<?php echo $row['permanent_address'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Local Address: </label>
<input type="text" class=" form-control w-50 " id="laddress" name="laddress" required value="<?php echo $row['local_address'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Mobile Number: </label>
<input type="text" class=" form-control w-50 " id="mobile" name="mobile" required value="<?php echo $row['mobile'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Emergency Number: </label>
<input type="text" class=" form-control w-50 " id="emergency" name="emergency" required value="<?php echo $row['emergency_contact'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Qualification: </label>
<input type="text" class=" form-control w-50 " id="qualification" name="qualification" required value="<?php echo $row['qualification'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Date of Birth: </label>
<input type="date" class=" form-control w-50 " id="dob" name="dob" required value="<?php echo date('Y-m-d', strtotime($row['dob'])) ?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Blood Group: </label>
<select class="w-50 my-1 form-control" style="cursor:pointer;" id="bg">
<option selected><?php echo $row['blood_group'];?></option>
<option value="A+">A+</option>
<option value="O+">O+</option>
<option value="B+">B+</option>
<option value="AB+">AB+</option>
<option value="A-">A-</option>
<option value="O-">O-</option>
<option value="B-">B-</option>
<option value="AB-">AB-</option>
</select>
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Special Notes: </label>
<input type="text" class=" form-control w-50 " id="sn" name="sn" required value="<?php echo $row['note'];?>">
</div>
</div>
<div class="">
<div class="form-group col-auto">
<label for="file" id="uploadBtn" class="mr-2">Employee Picture</label>
<div class="profile-pic-div">
<img <?php echo 'src="data:image/jpeg;base64,'.base64_encode($row['picture'] ).'"' ?> id="photo" >
<input type="file" name="ProfileImage" id="file" />
</div>
</div>
</div>
</div>
<div class="modal-footer mt-1">
<button data-id="<?php echo $row['employee_id'];?>" class="btn btn-success persinfo" name="persinfo" id="<?php echo $row['employee_id'];?>"><span class="glyphicon glyphicon-save"></span>Save & Next</button>
</div>
</div>
</div>
<!-- Company Information-->
<div class="tab-pane fade show" id="company">
<div class="well col-lg-12" id="displaydata1">
<!--CONTENT HERE-->
<div class="row">
<div class="col-lg-6 float-left">
<div class=" col-auto mt-3">
<label for="" class="mr-2">Employee ID: </label>
<input type="text" class=" form-control w-50 my-1 " name="employeeid" id="employeeid" required value="<?php echo $row['employee_id'];?>" disabled>
<!-- <img src="https://img.icons8.com/ios-filled/50/000000/settings.png" alt=""> -->
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Select Block: </label>
<select class="w-50 form-control" style="cursor:pointer;" id="sblock">
<option selected><?php echo $row['block'];?></option>
</select>
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Select Department: </label>
<select class="w-50 form-control" style="cursor:pointer;" id="sdpt">
<option selected><?php echo $row['department'];?></option>
</select>
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Select Designation: </label>
<select class="w-50 form-control" style="cursor:pointer;" id="sdesig">
<option selected ><?php echo $row['designation'];?></option>
</select>
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Employee Type: </label>
<select class="w-50 form-control" style="cursor:pointer;" id="semptyp">
<option selected><?php echo $row['employee_type'];?></option>
</select>
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Email: </label>
<input type="text" class=" form-control w-50 " id="email" name="email" required value="<?php echo $row['email'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Date of Joining: </label>
<input type="date" class=" form-control w-50 " id="doj" name="doj" required value="<?php echo date('Y-m-d', strtotime($row['doj']));?>">
</div>
</div>
<div class="col-lg-6 float-left">
<h5 class="mt-3 ml-3" style="color:#636c78;">Employee Shift Information</h5>
<div class="col-auto mt-3">
<label for="" class="mr-2">Set Shift: </label>
<select class="form-control w-50" style="cursor:pointer;">
<option selected><?php echo $row['shift'];?></option>
</select>
</div>
<?php
$shid=$row['shift'];
$query1="SELECT * FROM tbl_shifts WHERE shift_id ='$shid'";
$result1 = mysqli_query($conn,$query1);
$row1 = $result1->fetch_array();
?>
<div class="col-auto mt-1">
<label for="" class="mr-2">Start Time: </label>
<input type="time" class=" form-control w-50 " id="stime" name="stime" value="<?php echo date('H:i', strtotime($row1['st_tm']));?>" required>
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">End Time: </label>
<input type="time" class=" form-control w-50 " id="etime" name="etime" value="<?php echo date('H:i', strtotime($row1['end_tm']));?>" required>
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Weekday: </label>
<select class="form-control w-50" style="cursor:pointer;">
<option selected><?php echo $row1['weekday'];?></option>
<option>Monday</option>
<option>Tuesday</option>
<option>Wednesday</option>
<option>Thursday</option>
<option>Friday</option>
<option>Saturday</option>
<option>Sunday</option>
</select>
</div>
</div>
</div>
<div class="modal-footer mt-5">
<button class="btn btn-success" name="save_emp" id="save_emp"><span class="glyphicon glyphicon-save"></span>Save & Next</button>
</div>
</div>
</div>
<!-- Payroll Information-->
<div class="tab-pane fade show" id="payroll">
<div class="well col-lg-12" id="displaydata1">
<!--CONTENT HERE-->
<?php
$empid=$row['employee_id'];
$query2="SELECT * FROM emp_salary WHERE employee_id ='$empid'";
$result2 = mysqli_query($conn,$query2);
$row2 = $result2->fetch_array();
?>
<div class="row">
<div class="col-lg-6 float-left">
<h5 class="mt-3 ml-3" style="color:#636c78;">Monthly Salary Information</h5>
<div class="col-auto mt-3">
<label for="" class="mr-2">Gross Salary: </label>
<input type="text" class=" form-control w-50 " id="gsalary" name="gsalary" placeholder="0" required value="<?php echo $row2['gross_salary'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Basic Salary: </label>
<input type="text" class=" form-control w-50 " id="bsalary" name="bsalary" placeholder="0" required value="<?php echo $row2['basic_salary'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">House Rent Allowance: </label>
<input type="text" class=" form-control w-50 " id="hra" name="hra" placeholder="0" required value="<?php echo $row2['hra'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Utility Allowance: </label>
<input type="text" class=" form-control w-50 " id="ua" name="ua" placeholder="0" required value="<?php echo $row2['ua'];?>">
</div>
</div>
<?php
$query3="SELECT * FROM emp_allowed_leaves WHERE employee_id ='$empid'";
$result3 = mysqli_query($conn,$query3);
$row3 = $result3->fetch_array();
?>
<div class="col-lg-6 float-left">
<h5 class="mt-3 ml-3" style="color:#636c78;">Allowed Leaves Information</h5>
<div class="col-auto mt-3">
<label for="" class="mr-2">Annual Leaves: </label>
<input type="text" class=" form-control w-50 " id="aleaves" name="aleaves" placeholder="0" required value="<?php echo $row3['annual'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Casual Leaves: </label>
<input type="text" class=" form-control w-50 " id="cleaves" name="cleaves" placeholder="0" required value="<?php echo $row3['casual'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Sick Leaves: </label>
<input type="text" class=" form-control w-50 " id="sleaves" name="sleaves" placeholder="0" required value="<?php echo $row3['sick'];?>">
</div>
<div class="col-auto mt-1">
<label for="" class="mr-2">Maternity Leaves: </label>
<input type="text" class=" form-control w-50 " id="mleaves" name="mleaves" placeholder="0" required value="<?php echo $row3['maternity'];?>">
</div>
</div>
</div>
<div class="modal-footer mt-5">
<button class="btn btn-success" name="save_emp" id="save_emp"><span class="glyphicon glyphicon-save"></span>Save & Next</button>
</div>
</div>
</div>
<!-- Incentives Information-->
<div class="tab-pane fade show" id="incentives">
<div class="well col-lg-12" id="displaydata1">
<!--CONTENT HERE-->
<?php
$query4="SELECT * FROM emp_benefits WHERE employee_id ='$empid'";
$result4 = mysqli_query($conn,$query4);
$row4 = $result4->fetch_array();
?>
<div class="col-lg-6 float-left check">
<h5 class="mt-3 ml-3" style="color:#636c78;">Company Allowed Benefits</h5>
<div class="col-auto mt-3 ml-4">
<input class="form-check-input" type="checkbox" name="gli" id="gli" onclick="return myfun()" value="gli" <?php if ($row4['gli'] == '1') echo "checked='checked'"; ?>>
<label class="form-check-inline" style="width: 150px;" style="text-align:left;">Group Life Insurance</label>
</div>
<div class="col-auto mt-1 ml-4">
<input class="form-check-input" type="checkbox" name="eobi" id="eobi" onclick="return myfun()" value="eobi" <?php if ($row4['eobi'] == '1') echo "checked='checked'"; ?>>
<label class="form-check-label" for="inlineRadio2" style="text-align:left;">EOBI </label>
</div>
<div class="col-auto mt-1 ml-4">
<input class="form-check-input" type="checkbox" name="pessi" id="pessi" onclick="return myfun()" value="pessi" <?php if ($row4['pessi'] == '1') echo "checked='checked'"; ?>>
<label class="form-check-label" for="inlineRadio2" style="text-align:left;">PESSI </label>
</div>
<div class="col-auto mt-1 mb-5 ml-4">
<input class="form-check-input" type="checkbox" name="overtime" id="overtime" onclick="return myfun()" value="overtime" <?php if ($row4['overtime'] == '1') echo "checked='checked'"; ?>>
<label class="form-check-label" for="inlineRadio2" style="text-align:left;">Overtime </label>
</div>
</div>
<div class="col-lg-6 float-left check">
<h5 class="mt-3 ml-3" style="color:#636c78;">Other Incentives</h5>
</div>
<div class="modal-footer mt-5">
<button class="btn btn-success" name="save_emp" id="save_emp"><span class="glyphicon glyphicon-save"></span>Save & Close</button>
</div>
</div>
</div>
<!--Employee Panel Ends-->
</div>
<!-- SCRIPT -->
<script src="../scripts/app.js"></script>
<?php include ($_SERVER['DOCUMENT_ROOT'].'/astrahrms/admin/employees/scripts/edit_emp.php'); ?>
<?php
// echo json_encode($data);
$conn->close();
?>
now I want to update the image in this opened modal on clicking button named persinfo, I want to assign all the values, in modal including newly selected image (using input named file, see code), to variables in AJAX and then call page update_employee.php page to execute the update query to change employee information and newly selected image in the opened modal.
Code for update_employee.php for your reference
include '../../config/db_connect.php';
$id = $_POST['id'];
$firstname = $_POST['firstname'];
$lastname = $_POST['lastname'];
$cnic = $_POST['cnic'];
$paddress = $_POST['paddress'];
$laddress = $_POST['laddress'];
$mobile = $_POST['mobile'];
$emergency = $_POST['emergency'];
$qualification = $_POST['qualification'];
$dob = $_POST['dob'];
$bloodgroup = $_POST['bloodgroup'];
$notes = $_POST['notes'];
$query_run= $conn->query("UPDATE employee SET first_name='$firstname', last_name='$lastname', cnic='$cnic', permanent_address='$paddress', local_address='$laddress',mobile='$mobile',emergency_contact='$emergency',dob='$dob', qualification='$qualification',blood_group='$bloodgroup',note='$notes' WHERE employee_id='$id'");
if ($query_run) {
echo json_encode(array("statusCode"=>200));
}
else {
echo json_encode(array("statusCode"=>201));
}
mysqli_close($conn);
?>
Can anybody help me with this?
Regards

Related

how to echo the data of a table row in a modal?

what I want to do is that the table( in perfiles.php) is related to the modal, when pressing the edit button in a row, the modal opens with their respective data already loaded from the DB and echo in each input
if you need more details please tell me, do not class it as bad, cause im not the best to clarify my questions and i try
//perfiles.php
<?php
include 'api/conexion.php';
$perfil = mysqli_query($conexion, "SELECT * FROM perfil where usuario = '$_SESSION[usuario]'");
?>
<table id="datatables" class="table table-striped table-no-bordered table-hover" cellspacing="0" width="100%" style="width:100%">
<thead>
<tr>
<th class="text-center">#</th>
<th>Nombre</th>
<th>Cuit</th>
<th>Tipo Persona</th>
<th class="text-right">Cierre de ejercicio</th>
<th class="text-right">Acciones</th>
</thead>
<tbody>
<?php while($reg = mysqli_fetch_array($perfil)) { ?>
<tr id="<?php echo " tr_ ".$reg['id']; ?>">
<td class="row_factura" data-id="<?php echo $reg['usuario'] ?>">
<?php echo $reg['id']; ?>
</td>
<td class="row_factura" data-id="<?php echo $reg['usuario'] ?>">
<?php echo $reg['nombre']; ?>
</td>
<td class="row_factura" data-id="<?php echo $reg['usuario'] ?>">
<?php echo $reg['cuit']; ?>
</td>
<td class="row_factura" data-id="<?php echo $reg['usuario'] ?>">
<?php echo $reg['tipo_persona']; ?>
</td>
<td class="row_factura text-right" data-id="<?php echo $reg['usuario'] ?>">
<?php echo $reg['cierre_ejercicio']; ?>
</td>
<td class="td-actions text-right">
<button type="button" rel="tooltip" class="btn btn-info" data-original-title="" title="ver/editar perfil" data-toggle="modal" data-target="#modal_ajustes_perfil" href="#">
<i class="material-icons">person</i>
</button>
<button type="button" rel="tooltip" class="btn btn-success" data-original-title="" title="ver/editar impuestos" data-toggle="modal" data-target="#modal_ajustes_impuestos" href="#">
<i class="material-icons">edit</i>
</button>
<button id="<?php echo $reg['id'] ?>" type="button" rel="tooltip" class="btn btn-danger" onclick="mod('<?php echo $reg['id']; ?>', 'perfiles');" data-original-title="" title="eliminar perfil">
<i class="material-icons">close</i>
</button>
</td>
</tr>
<?php } ?>
</tbody>
</table>
//modal
<div class="modal fade" id="modal_ajustes_perfil" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="card">
<div class="card-header card-header-icon" data-background-color="blue">
<i class="material-icons">perm_identity</i>
</div>
<div class="card-content">
<h4 class="card-title">Datos del Perfil -
<small class="category">Completar perfil</small>
</h4>
<form>
<div class="row">
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Nombre</label>
<input type="text" class="form-control" disabled>
</div>
</div>
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Cuit</label>
<input type="text" class="form-control" disabled>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Tipo persona</label>
<input type="email" class="form-control" disabled>
</div>
</div>
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Cierre del ejercicio</label>
<input type="text" class="form-control" disabled>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group label-floating">
<label class="control-label">Dirección</label>
<input type="text" class="form-control" disabled>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Email</label>
<input type="text" class="form-control">
</div>
</div>
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Telefono</label>
<input type="text" class="form-control">
</div>
</div>
</div>
If you have issues in Getting all rows for each username from mysql Database? I have re written the code, Kindly replace it.
//perfiles.php
<?php
include 'api/conexion.php';
$perfil = mysqli_query($conexion, "SELECT * FROM `perfil` WHERE `usuario` = '$_SESSION[usuario]'");
?>
<table id="datatables" class="table table-striped table-no-bordered table-hover" cellspacing="0" width="100%" style="width:100%">
<thead>
<tr>
<th class="text-center">#</th>
<th>Nombre</th>
<th>Cuit</th>
<th>Tipo Persona</th>
<th class="text-right">Cierre de ejercicio</th>
<th class="text-right">Acciones</th>
</thead>
<tbody>
<?php while($row = mysqli_fetch_array($perfil, MYSQLI_ASSOC)) {
foreach($row as $reg){
?>
<tr id="<?php echo " tr_ ".$reg['id']; ?>">
<td class="row_factura" data-id="<?php echo $reg['usuario'] ?>">
<?php echo $reg['id']; ?>
</td>
<td class="row_factura" data-id="<?php echo $reg['usuario'] ?>">
<?php echo $reg['nombre']; ?>
</td>
<td class="row_factura" data-id="<?php echo $reg['usuario'] ?>">
<?php echo $reg['cuit']; ?>
</td>
<td class="row_factura" data-id="<?php echo $reg['usuario'] ?>">
<?php echo $reg['tipo_persona']; ?>
</td>
<td class="row_factura text-right" data-id="<?php echo $reg['usuario'] ?>">
<?php echo $reg['cierre_ejercicio']; ?>
</td>
<td class="td-actions text-right">
<button type="button" rel="tooltip" class="btn btn-info" data-original-title="" title="ver/editar perfil" data-toggle="modal" data-target="#modal_ajustes_perfil" href="#">
<i class="material-icons">person</i>
</button>
<button type="button" rel="tooltip" class="btn btn-success" data-original-title="" title="ver/editar impuestos" data-toggle="modal" data-target="#modal_ajustes_impuestos" href="#">
<i class="material-icons">edit</i>
</button>
<button id="<?php echo $reg['id'] ?>" type="button" rel="tooltip" class="btn btn-danger" onclick="mod('<?php echo $reg['id']; ?>', 'perfiles');" data-original-title="" title="eliminar perfil">
<i class="material-icons">close</i>
</button>
</td>
</tr>
<?php } } ?>
</tbody>
</table>
Below is for Modal... You need to provide your Db Structure to Edit the rest of things.. what are the fields to be filled for what with the screenshot
//modal
<?php
include 'api/conexion.php';
$perfil = mysqli_query($conexion, "SELECT * FROM `perfil` WHERE `usuario` = '$_SESSION[usuario]'");
?>
<?php while($row = mysqli_fetch_array($perfil, MYSQLI_ASSOC)) { ?>
<div class="modal fade" id="modal_ajustes_perfil" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="card">
<div class="card-header card-header-icon" data-background-color="blue">
<i class="material-icons">perm_identity</i>
</div>
<div class="card-content">
<h4 class="card-title">Datos del Perfil -
<small class="category">Completar perfil</small>
</h4>
<form>
<div class="row">
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Nombre</label>
<input type="text" class="form-control" value="<?php echo $reg['nombre']; ?>" disabled>
</div>
</div>
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Cuit</label>
<input type="text" class="form-control" value="<?php echo $reg['cuit']; ?>" disabled>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Tipo persona</label>
<input type="email" class="form-control" value="<?php echo $reg['tipo_persona']; ?>" disabled>
</div>
</div>
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Cierre del ejercicio</label>
<input type="text" class="form-control" value="<?php echo $reg['cierre_ejercicio']; ?>" disabled>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group label-floating">
<label class="control-label">Dirección</label>
<input type="text" class="form-control" disabled>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Email</label>
<input type="text" class="form-control" value="<?php echo $reg['email']; ?>">
</div>
</div>
<div class="col-md-6">
<div class="form-group label-floating">
<label class="control-label">Telefono</label>
<input type="text" class="form-control" value="<?php echo $reg['telefono']; ?>">
</div>
</div>
</div>
<?php } ?>

how can i validate the checkbox?

<form target="_self" id="immunization_info_form" class="form-validation save_immune25 update_immune25" role="form" method="POST" enctype="multipart/form-data">
<div class="form-group row" style="margin-top:10px;height:50px;">
<div class="checkbox checkbox-styled col-md-offset-1 col-md-4">
<label style="font-size:15px;"><input type="checkbox" id="checkbox25" name="ch" class="checkbx" value="25">
<span>Hepatitis A vaccine</span></label>
</div>
<div class="form-group col-md-4">
<!-- Date input -->
<input class="form-control edit25" id="date25" name="date" placeholder="Enter Date" value="<?php echo $date[25]; ?>" type="text" required>
</div>
</div>
<div class="row" style="padding:15px;">
<div class="col-md-3 col-md-offset-1">
<div class="form-group">
<h3 style="color:orange;">Clinic Name</h3><br>
<input name="clinic_name" id="clinic" class="form-control edit25" type="text" value="<?php echo $clinic_name[25]; ?>" required>
<label for="clinic_name"></label>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<h3 style="color:orange;">Name of the Health practitioner</h3><br>
<input name="hp_name" id="hp" class="form-control edit25" type="text" value="<?php echo $practitioner[25]; ?>" required>
<label for="hp_name"></label>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<h3 style="color:orange;">Lot no. of Vaccine</h3><br>
<input name="lotno" id="lot" class="form-control edit25" type="text" value="<?php echo $lotno[25]; ?>" required>
<label for="lotno"></label>
</div>
</div>
<div class="row col-md-offset-1">
<div class="col-md-6 text-right">
<input type="button" name="submit" value="SAVE" class="save btn btn-lg btn-primary ink-reaction justify" id="save_immune25">
</div>
</div>
</div>
</form>
i have added my html code also..
$('.save').on('click', function() {
var chk = $(this).parent().parent().parent().parent().parent().find('input [name="ch"]').attr('class');
if ($("." + chk).attr('checked', false)) {
alert("please check the checkbox");
} else {
alert("you have checked the checkbox");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
i have tried with this code and getting the alert "please check the checkbox" for both conditions if and else.
i just want to validate the checkbox whether it is checked or not .. if checked means it should display the relevant message if not checked also should display the message.
There are two things i am noticing:
Instead use .closest() against .parent() multiple times.
Do not set the attribute in the if condition, instead of .attr() use .prop().
You can change to this
var chk = $(this).closest('form').find('input[name="ch"]');// use form if you have one.
if (!$(chk).prop('checked')) {
$('.save').on('click', function() {
var chk = $(this).closest('form').find('input[name="ch"]');
if (!$(chk).prop('checked')) {
alert("please check the checkbox");
} else {
alert("you have checked the checkbox");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form target="_self" id="immunization_info_form" class="form-validation save_immune25 update_immune25" role="form" method="POST" enctype="multipart/form-data">
<div class="form-group row" style="margin-top:10px;height:50px;">
<div class="checkbox checkbox-styled col-md-offset-1 col-md-4">
<label style="font-size:15px;"><input type="checkbox" id="checkbox25" name="ch" class="checkbx" value="25">
<span>Hepatitis A vaccine</span></label>
</div>
<div class="form-group col-md-4">
<!-- Date input -->
<input class="form-control edit25" id="date25" name="date" placeholder="Enter Date" value="<?php echo $date[25]; ?>" type="text" required>
</div>
</div>
<div class="row" style="padding:15px;">
<div class="col-md-3 col-md-offset-1">
<div class="form-group">
<h3 style="color:orange;">Clinic Name</h3><br>
<input name="clinic_name" id="clinic" class="form-control edit25" type="text" value="<?php echo $clinic_name[25]; ?>" required>
<label for="clinic_name"></label>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<h3 style="color:orange;">Name of the Health practitioner</h3><br>
<input name="hp_name" id="hp" class="form-control edit25" type="text" value="<?php echo $practitioner[25]; ?>" required>
<label for="hp_name"></label>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<h3 style="color:orange;">Lot no. of Vaccine</h3><br>
<input name="lotno" id="lot" class="form-control edit25" type="text" value="<?php echo $lotno[25]; ?>" required>
<label for="lotno"></label>
</div>
</div>
<div class="row col-md-offset-1">
<div class="col-md-6 text-right">
<input type="button" name="submit" value="SAVE" class="save btn btn-lg btn-primary ink-reaction justify" id="save_immune25">
</div>
</div>
</div>
</form>

error after reload div using jquery load

I have a div with id content
here is my script
<script>
$(document).ready(function(){
$("#avt").fileinput();
$('#updateuser').on('submit', function (e) {
e.preventDefault();
if($('#pwd').val() == $('#repwd').val()){
var formData = new FormData($(this)[0]);
$.ajax({
type: 'post',
url: 'user/edit',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (data) {
$("#content").load(location.href + " #content");
}
});
}else{
$('#errordisplay').html(' <div class="alert alert-danger alert-dismissible"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> <h4><i class="icon fa fa-ban"></i> Alert!</h4> Nhập lại password không đúng!Xin nhập lại!</div>');
}
});
});
</script>
enter image description here
at the first click update,data updated but I look like the javascript not working anymore and css error.
here is image when page normal
enter image description here
here is content div
<div class="body-content outer-top-xs" id="content">
<div class="container">
<div class="row">
<div class="col-md-5">
<div class="box wow fadeInUp outer-bottom-xs animated" style="visibility: visible; animation-name: fadeInUp;">
<h3 class="section-title">Thông Tin Người Dùng</h3>
<div class="box-body outer-top-xs">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<img src="<?= upload_url() ?>/avt/<?= $info['avatar'] ?>" class="img-responsive img-circle" ></div>
</div>
<div class="row">
<hr>
<span class="text-bold">Họ và Tên : </span><span class="text-muted"><?= $info['fullname'] ?> ( <?= $info['username'] ?>)</span>
<hr>
<span class="text-bold">Ngày Đăng Kí : </span><span class="text-muted"><?= $info['date_register'] ?></span>
<hr>
</div>
</div>
<!-- /.sidebar-widget-body -->
</div></div>
<div class="col-md-7">
<div class="box wow fadeInUp outer-bottom-xs animated" style="visibility: visible; animation-name: fadeInUp;">
<h3 class="section-title">Cập Nhật Thông Tin</h3>
<div class="box-body outer-top-xs">
<form class="form-horizontal" id="updateuser">
<div class="box-body">
<div class="form-group">
<label for="avt" class="col-sm-2 control-label">Avatar</label>
<div class="col-sm-10">
<input name="img" class="file" type="file" >
</div>
</div>
<div class="form-group">
<label for="username" class="col-sm-2 control-label">Username</label>
<div class="col-sm-4">
<input class="form-control" id="username" name="username" placeholder="Username" type="text" readonly="readonly" value="<?= $info['username'] ?>">
<input id="uid" name="uid" type="hidden" readonly="readonly" value="<?= $info['userid'] ?>">
</div>
<label for="fullname" class="col-sm-2 control-label">Họ Tên </label>
<div class="col-sm-4">
<input class="form-control" id="fullname" name="fullname" placeholder="Fullname" type="text" value="<?= $info['fullname'] ?>">
</div>
</div>
<div class="form-group">
<label for="pwd" class="col-sm-2 control-label">New Pwd</label>
<div class="col-sm-4">
<input class="form-control" id="pwd" name="pwd" placeholder="Password" type="password" >
</div>
<label for="repwd" class="col-sm-2 control-label">Reinput</label>
<div class="col-sm-4">
<input class="form-control" id="repwd" name="repwd" placeholder=" Retype Password" type="password">
</div>
</div>
<div class="form-group">
<label for="email" class="col-sm-2 control-label">Email *</label>
<div class="col-sm-4">
<input class="form-control" required id="email" name="email" placeholder="Email" type="email" value="<?= $info['email'] ?>">
</div>
<label for="addr" class="col-sm-2 control-label">Địa Chỉ</label>
<div class="col-sm-4">
<input class="form-control" id="addr" name="addr" placeholder="Địa Chỉ" type="text" value="<?= $info['address'] ?>">
</div>
</div>
<div class="form-group">
<label for="gender" class="col-sm-2 control-label">Giới Tính</label>
<div class="col-sm-10">
<label class="col-sm-3 radio-inline"><input type="radio" name="gender" value="0" <?php if($info['gender'] ==0) echo 'checked' ?> >Nam</label>
<label class="col-sm-3 radio-inline"><input type="radio" name="gender" value="1" <?php if($info['gender'] ==1) echo 'checked' ?>>Nữ</label>
<label class="col-sm-3 radio-inline"><input type="radio" name="gender" value="2" <?php if($info['gender'] ==2) echo 'checked' ?>>Khác</label>
</div>
</div>
<div class="form-group">
<label for="phone" class="col-sm-2 control-label">SĐT</label>
<div class="col-sm-4">
<input class="form-control" id="phone" name="phone" placeholder="Số Điện Thoại" type="text" value="<?= $info['phone'] ?>">
</div>
<label for="group" class="col-sm-2 control-label">Group</label>
<div class="col-sm-4">
<select class="form-control" id="group" name="group">
<?php foreach($listgroup as $item): ?>
<option value="<?= $item['groupid'] ?>" <?php if($info['groupid'] ==$item['groupid']) echo 'selected' ?>><?= $item['name'] ?></option>
<?php endforeach ?>
</select>
</div>
</div>
</div>
<!-- /.box-body -->
<div class="box-footer">
<button type="submit" class="btn bg-tit pull-right">Update</button>
</div>
<!-- /.box-footer -->
</form>
</div>
<!-- /.sidebar-widget-body -->
</div></div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
</div>
$("#content").load(location.href + " #content");
should be
$("#content").load(location.href + " #content > *");

How to show the edit form and selected value in option field

Here i want to do,some one click edit button means, i want show the edit form in same page and in that edit form i want to show already what value wrote,that value i want to display in that form field,here i did for truck name becauze this one for input=text ,but next field i am not able to show which state already he selected,how can do this
<?php
$sql = "SELECT * FROM trucks WHERE status !='1' ORDER BY reg_date DESC";
$result = mysql_query($sql);
$cat=array();
while($row = mysql_fetch_array($result)){
echo '<tr>
<td>'.$row["truck_name"].'</td>
<td>'.Getstate($row["state_id"]).'</td>
<td>'.Getcity($row["city_id"]).'</td>
<td class="col-medium center">
<div class="btn-group btn-group-xs ">
<a class="btn btn-inverse" style="cursor:pointer;" onclick="show_edit_menu(\''.$row["id"].'\',\''.$row["truck_name"].'\',\''.$row["state_id"].'\',\''.$row["city_id"].'\')"><i class="fa fa-edit icon-only"></i>Edit</a>
<a class="btn btn-danger" onclick="truck_deletemenu('.$row["id"].')"><i class="fa fa-times icon-only"></i>Delete</a>
</div>
</td>
</tr>';
}
?><?php
$sql = "SELECT * FROM trucks WHERE status !='1' ORDER BY reg_date DESC";
$result = mysql_query($sql);
$cat=array();
while($row = mysql_fetch_array($result)){
echo '<tr>
<td>'.$row["truck_name"].'</td>
<td>'.Getstate($row["state_id"]).'</td>
<td>'.Getcity($row["city_id"]).'</td>
<td class="col-medium center">
<div class="btn-group btn-group-xs ">
<a class="btn btn-inverse" style="cursor:pointer;" onclick="show_edit_menu(\''.$row["id"].'\',\''.$row["truck_name"].'\',\''.$row["state_id"].'\',\''.$row["city_id"].'\')"><i class="fa fa-edit icon-only"></i>Edit</a>
<a class="btn btn-danger" onclick="truck_deletemenu('.$row["id"].')"><i class="fa fa-times icon-only"></i>Delete</a>
</div>
</td>
</tr>';
}
?>
<script>
function show_edit_menu(id,t_name,state_id,city_id){
$("#show_edit_menu").show();
$("#tid").val(id);//truck auto id
$("#tname").val(t_name);//Truck Name
$("#state").val(state_id);//state id
console.log(t_name);//i got truck name value here
console.log(state_id);//i got state name value here
}
</script>
<!--edit part here-->
<div class="portlet" id="show_edit_menu" style="display:none;">
<div class="portlet-heading dark">
<div class="portlet-title">
<h4>Edit Menu</h4>
</div>
<div class="portlet-widgets">
<a data-toggle="collapse" data-parent="#accordion" href="#f-3"><i class="fa fa-chevron-down"></i></a>
</div>
<div class="clearfix"></div>
</div>
<div id="f-3" class="panel-collapse collapse in">
<div class="portlet-body">
<form class="form-horizontal" role="form" id="edit_form" method="post" enctype="multipart/form-data">
<div class="form-group">
<label class="col-sm-2 control-label">Truck Name<span class="require">*</span></label>
<div class="col-sm-8">
<input type="text" class="form-control" value="" name="tname" id="tname">
<input type="hidden" class="form-control" value="" name="tid" id="tid">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">State<span class="require">*</span></label>
<div class="col-sm-8">
<select class="form-control intro-form-fixer state" required="" id="state" name="state" data-msg-required="Please enter your State" value="" aria-required="true">
<option value="1"> I want to show which state i selected</option>
</select>
<!--<input type="hidden" id="state" name="state" value="" />-->
</div>
</div>
<div class="form-actions">
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="button" class="btn btn-primary" onclick="edit_menu()">Submit</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
Try this:
$("#state option[value='"+state_id+"']").attr("selected", true);
instead of
$("#state").val(state_id);

how to populate the fields in my bootstrap modal from clicking a row in the view table in codeigniter

I have this bootstrap3 modal that is called when I click a certain row in a table and shows the details of a student supposedly ready for editing. But the problem is the details doesn't appear in the fields where I put the value via ajax. By the way I am using Codeigniter as my php framework.
I am looking for solutions for days now but still can't find the right answer for my problem...
This is my Controller
public function getStudent(){
$data = array();
$id = $this->input->post('stud_id');
$this->load->model('studentModel');
$data = $this->studentModel->getStudent($id);
echo $data;
}
Model
public function getStudent($id){
$query = array();
$this->db->select('*');
$this->db->from('stud_bio');
$this->db->where('stud_id', $id);
$query = $this->db->get();
return $query->result();
}
View
<div class="container">
<div class="row">
<div class="table table-responsive">
<table class="table table-hover table-striped table-condensed table-bordered">
<thead class="header">
<tr>
<th>Name</th>
<th>Gender</th>
<th>Marital Status</th>
<th>Name of Spouse</th>
<th>Number of Children</th>
<th>Date of Birth</th>
<th>Contact Number</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<?php foreach($data as $row){ ?>
<tr data-toggle="modal" href="#editStudent" data-id="<?php echo $row->stud_id?>" class="editStudent">
<td><?php echo $row->name?></td>
<td><?php if($row->gender == 1){echo "Male";}else{echo "Female";} ?></td>
<td><?php if($row->marital_status == 1){echo "Single";}else{echo "Married";}?></td>
<td><?php echo $row->spouse_name ?></td>
<td><?php echo $row->no_of_children ?></td>
<td><?php echo $row->DOB ?></td>
<td><?php echo $row->contactNo ?></td>
<td><?php echo $row->email ?></td>
<?php }?>
</tbody>
</table>
</div>
</div>
Modal
<div class="container">
<div class="row">
<div class="modal fade" id="editStudent" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<?=form_open(base_url('admin/studentController/editStudent'))?>
<div class="form-horizontal">
<div class="modal-header"><!--HEADER-->
<button class="btn btn-primary close" data-dismiss="modal" aria-hidden="true">×</button>
<h4>Edit Student</h4>
</div><!--end of HEADER-->
<div class="modal-body"><!--BODY-->
<!--Name-------------------------------------------->
<div class="form-group">
<label for="edit_fullname" class="col-sm-2 control-label">Fullname</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="edit_fullname" name="edit_fullname" placeholder="Name">
</div>
<label class="radio-inline has-error">
<?php echo form_error('edit_fullname','*<span3 class="help-inline">','</span3>'); ?>
</label>
</div><!--end of NAME -->
<!--Gender------------------------------------------>
<div class="form-group">
<label class="col-sm-2 control-label">Gender</label>
<div class="col-sm-4">
<label for="edit_male" class="radio-inline">
<input type="radio" name="edit_genderRadio" value="1" id="edit_male"/>Male
</label>
<label for="edit_female" class="radio-inline">
<input type="radio" name="edit_genderRadio" value="2" id="edit_female"/>Female
</label>
</div>
<label class="radio-inline has-error">
<?php echo form_error('edit_genderRadio','*<span3 class="help-inline">','</span3>'); ?>
</label>
</div>
<!--Civil Status----------------------------------->
<div class="form-group">
<label class="col-sm-2 control-label">Civil Status</label>
<div class="col-sm-4">
<label for="edit_S" class="radio-inline">
<input type="radio" name="edit_civilRadio" value="1"<?=set_radio('civilRadio', '1')?> id="edit_S"/>Single
</label>
<label for="edit_M" class="radio-inline">
<input type="radio" name="edit_civilRadio" value="2"<?=set_radio('civilRadio', '2')?> id="edit_M"/>Married
</label>
</div>
<label class="radio-inline has-error">
<?php echo form_error('edit_civilRadio','*<span3 class="help-inline">','</span3>'); ?>
</label>
</div>
<!--If Married Spouse name--------------------------------->
<div class="form-group">
<label for="edit_spouseName" class="col-sm-2 control-label">Spouse Name</label>
<div class="col-sm-4">
<input type="text" name="edit_spouseName" id="edit_spouseName" class="form-control" placeholder="Spouse name"/>
</div>
<label class="radio-inline has-error">
<?php echo form_error('edit_spouseName','*<span3 class="help-inline">','</span3>'); ?>
</label>
</div>
<!--Children #------------------------------------------------->
<div class="form-group">
<label for="edit_numChildren" class="col-sm-2 control-label">Number of Children</label>
<div class="col-md-2">
<input type="text" class="form-control" name="edit_numChildren" id="edit_numChildren" placeholder="- - -"/>
</div>
<label class="radio-inline has-error">
<?php echo form_error('edit_numChildren','*<span3 class="help-inline">','</span3>'); ?>
</label>
</div>
<!--Date of birth--------------------------------------------------->
<div class="form-group">
<label for="edit_DOB" class="col-sm-2 control-label">Date of Birth</label>
<div class="col-sm-4">
<div class='input-group date' data-date-format="yyyy/mm/dd">
<input type='text' class="form-control" readonly="" name="edit_DOB" id="edit_DOB" />
<span class="input-group-addon">
<i class="fa fa-calendar"></i>
</span>
</div>
</div>
<label class="radio-inline has-error">
<?php echo form_error('edit_DOB','*<span3 class="help-inline">','</span3>');?>
</label>
</div>
<!--Email----------------------------------------------------------->
<div class="form-group">
<label for="edit_email" class="col-sm-2 control-label">Email</label>
<div class="col-sm-4">
<input type="email" id="edit_email" name="edit_email" class="form-control" placeholder="Enter email.."/>
</div>
<label class="radio-inline has-error">
<?php echo form_error('edit_email','*<span3 class="help-inline">','</span3>');?>
</label>
</div>
<!--Contact Number--------------------------------------------------------->
<div class="form-group">
<label for="edit_contactNo" class="col-sm-2 control-label">Contact No.</label>
<div class="col-sm-4">
<input type="text" id="edit_contactNo" name="edit_contactNo" class="form-control" placeholder="Contact No." />
</div>
<label class="radio-inline has-error">
<?php echo form_error('edit_contactNo','*<span3 class="help-inline">','</span3>');?>
</label>
</div>
</div> <!--end of BODY-->
<div class="modal-footer"><!--FOOTER-->
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary">Save</button>
</div><!--end of FOOTER-->
</div><!--end of form-horizontal -->
<?=form_close()?>
</div>
</div>
</div>
</div>
Script
<script type="text/javascript">
$(document).ready(function(){
var id_edit = $(this).data('id');
var base_url = <?php echo base_url('admin/studentController/getStudent');?>;
$('.editStudent').click(function (){
$.ajax({
url: base_url,
type: 'POST',
data: { 'stud_id': id_edit},
dataType: 'JSON';
success: function(result){
$('.modal-body #edit_fullname').val(result[0].name);
$('.modal-body .edit_genderRadio').val(result[0].gender);
$('.modal-body .edit_civilStatus').val(result[0].marital_status);
$('.modal-body #edit_spouseName').val(result[0].spouse_name);
$('.modal-body #edit_numChildren').val(result[0].no_of_children);
$('.modal-body .edit_DOB').val(result[0].DOB);
$('.modal-body #edit_email').val(result[0].email);
$('.modal-body #edit_contactNo').val(result[0].contactNo);
}
});
});
});
</script>

Categories

Resources