How to insert value in table by ID? - javascript

i have php code and mysql database and i have one problem, for example i have item with name Subaru with ID 1 and also Ford with ID 2 when i try to add event for Subaru it's not adding value to ID 1 its adding to ID 2(to last ID it can be other.) i want to make like this, when i press button with ID 1 its inserting value to ID 1 and when i select for example ID 5 its adding value to ID 5. There is my php code also my database sql. i think you understand me, My English is not so good...
there is my code and database here
<a href="#out<?php echo $id;?>" data-toggle="modal">
<button type='button' class='btn btn-default btn-sm'><span class='glyphicon glyphicon-minus' aria-hidden='true'></span></button>
</a>
<a href="#add<?php echo $id;?>" data-toggle="modal">
<button type='button' class='btn btn-success btn-sm'><span class='glyphicon glyphicon-plus' aria-hidden='true'></span></button>
</a>
<a href="#edit<?php echo $id;?>" data-toggle="modal">
<button type='button' class='btn btn-warning btn-sm'><span class='glyphicon glyphicon-edit' aria-hidden='true'></span></button>
</a>
<a href="#delete<?php echo $id;?>" data-toggle="modal">
<button type='button' class='btn btn-danger btn-sm'><span class='glyphicon glyphicon-trash' aria-hidden='true'></span></button>
</a>
</td>
<!--In Stock/s Modal -->
<div id="add<?php echo $id; ?>" class="modal fade" role="dialog">
<div class="modal-dialog modal-lg">
<!-- Modal content-->
<div class="modal-content">
<form method="post" class="form-horizontal" role="form">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Add Stocks</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label class="control-label col-sm-2" for="item_name">Item Name:</label>
<div class="col-sm-3">
<input type="hidden" name="add_stocks_id" value="<?php echo $id; ?>">
<input type="text" class="form-control" id="item_name" name="item_name" placeholder="Item Name" required readonly value="<?php echo $item_name; ?>"> </div>
<label class="control-label col-sm-2" for="item_code">Item Code:</label>
<div class="col-sm-2">
<input type="text" class="form-control" id="item_code" name="item_code" placeholder="Item Code" required readonly value="<?php echo $item_code; ?>" autocomplete="off"> </div>
<label class="control-label col-sm-1" for="dr_no">DR #:</label>
<div class="col-sm-2">
<input type="text" class="form-control" id="dr_no" name="dr_no" placeholder="DR #" autocomplete="off">
</div>
</div>
<br>
<br>
<div class="form-group">
<label class="control-label col-sm-2" for="item_name">Quantity:</label>
<div class="col-sm-4">
<input type="number" class="form-control" id="quantity" name="quantity" placeholder="Quantity" autocomplete="off" required min="1"> </div>
<label class="control-label col-sm-2" for="item_name">Remarks:</label>
<div class="col-sm-4">
<textarea class="form-control" id="remarks" name="remarks" placeholder="Remarks"></textarea>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="event">Event:</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="item_name" name="event" placeholder="Event">
</div>
</div>
<br>
<br>
<br>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary" name="add_inventory"><span class="glyphicon glyphicon-plus"></span> Add</button>
<button type="button" class="btn btn-warning" data-dismiss="modal"><span class="glyphicon glyphicon-remove-circle"></span> Cancel</button>
</div>
</form>
</div>
</div>
</div>
<div id="out<?php echo $id; ?>" class="modal fade" role="dialog">
<div class="modal-dialog modal-lg">
<form method="post" class="form-horizontal" role="form">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Out Stocks</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label class="control-label col-sm-2" for="item_name">Item Name:</label>
<div class="col-sm-2">
<input type="hidden" name="minus_stocks_id" value="<?php echo $id; ?>">
<input type="text" class="form-control" id="item_name" name="item_name" placeholder="Item Name" required readonly value="<?php echo $item_name; ?>"> </div>
<label class="control-label col-sm-2" for="item_code">Item Code:</label>
<div class="col-sm-2">
<input type="text" class="form-control" id="item_code" name="item_code" placeholder="Item Code" required readonly value="<?php echo $item_code; ?>"> </div>
<label class="control-label col-sm-2" for="dr_no">DR No.:</label>
<div class="col-sm-2">
<input type="text" class="form-control" id="dr_no" name="dr_no" placeholder="DR No." autocomplete="off" required autofocus> </div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="item_name">Quantity:</label>
<div class="col-sm-4">
<input type="number" class="form-control" id="quantity" name="quantity" placeholder="Quantity" autocomplete="off" required max="<?php echo $qty; ?>" min="1"> </div>
<label class="control-label col-sm-2" for="received_by" data-toggle="tooltip" title="Unit of Measurement">Receive By:</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="received_by" name="received_by" autocomplete="off" required> </div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="item_name">Remarks:</label>
<div class="col-sm-10">
<textarea class="form-control" id="remarks" name="remarks" placeholder="Remarks"></textarea>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary" name="minus_inventory"><span class="glyphicon glyphicon-plus"></span> Out</button>
<button type="button" class="btn btn-warning" data-dismiss="modal"><span class="glyphicon glyphicon-remove-circle"></span> Cancel</button>
</div>
</div>
</form>
</div>
</div>
<div id="changepass" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<form action="" method="post">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Change Password</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label class="control-label col-sm-2" for="name">Current:</label>
<div class="col-sm-10">
<input type="password" class="form-control" name="current_password" required placeholder="Current Password" autofocus autocomplete="off"> </div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="name">New:</label>
<div class="col-sm-10">
<input type="password" class="form-control" name="new_password" required placeholder="New Password" autocomplete="off"> </div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="name">Repeat:</label>
<div class="col-sm-10">
<input type="password" class="form-control" name="repeat_password" required placeholder="Repeat Password" autocomplete="off"> </div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary" name="change_pass">Update</button>
</div>
</div>
</form>
</div>
</div>
</div>
<div id="edit<?php echo $id; ?>" class="modal fade" role="dialog">
<form method="post" class="form-horizontal" role="form">
<div class="modal-dialog modal-lg">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Edit Item</h4>
</div>
<div class="modal-body">
<input type="hidden" name="edit_item_id" value="<?php echo $id; ?>">
<div class="form-group">
<label class="control-label col-sm-2" for="item_name">Item Name:</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="item_name" name="item_name" value="<?php echo $item_name; ?>" placeholder="Item Name" required autofocus> </div>
<label class="control-label col-sm-2" for="item_code">Item Code:</label>
<div class="col-sm-4">
<input type="text" readonly class="form-control" id="item_code" name="item_code" value="<?php echo $item_code; ?>" placeholder="Item Code" required> </div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="item_description">Description:</label>
<div class="col-sm-4">
<textarea cclass="form-control" id="item_description" name="item_description" placeholder="Description" required style="width: 100%;">
<?php echo $item_description; ?>
</textarea>
</div>
<label class="control-label col-sm-2" for="item_category">Category:</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="item_category" name="item_category" value="<?php echo $item_category; ?>" placeholder="Category" required> </div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary" name="update_item"><span class="glyphicon glyphicon-edit"></span> Edit</button>
<button type="button" class="btn btn-warning" data-dismiss="modal"><span class="glyphicon glyphicon-remove-circle"></span> Cancel</button>
</div>
</div>
</div>
</form>
</div>
<!--Delete Modal -->
<div id="delete<?php echo $id; ?>" class="modal fade" role="dialog">
<div class="modal-dialog">
<form method="post">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Delete</h4>
</div>
<div class="modal-body">
<input type="hidden" name="delete_id" value="<?php echo $id; ?>">
<div class="alert alert-danger">Are you Sure you want Delete <strong>
<?php echo $item_name; ?>?</strong> </div>
<div class="modal-footer">
<button type="submit" name="delete" class="btn btn-danger"><span class="glyphicon glyphicon-trash"></span> YES</button>
<button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove-circle"></span> NO</button>
</div>
</div>
</div>
</form>
</div>
</div>
</tr>
<?php
}
if(isset($_POST['change_pass'])){
$sql = "SELECT password FROM tbl_user WHERE username='$session_username'";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
if($row['password'] != $current_password){
echo "<script>window.alert('Invalid Password');</script>";
$passwordErr = '<div class="alert alert-warning"><strong>Password!</strong> Invalid.</div>';
} elseif($new_password != $repeat_password) {
echo "<script>window.alert('Password Not Match!');</script>";
$passwordErr = '<div class="alert alert-warning"><strong>Password!</strong> Not Match.</div>';
} else{
$sql = "UPDATE tbl_user SET password='$new_password' WHERE username='$session_username'";
if ($conn->query($sql) === TRUE) {
echo "<script>window.alert('Password Successfully Updated');</script>";
} else {
echo "Error updating record: " . $conn->error;
}
}
}
} else {
$usernameErr = '<div class="alert alert-danger"><strong>Username</strong> Not Found.</div>';
$username = "";
}
}
//Update Items
if(isset($_POST['update_item'])){
$edit_item_id = $_POST['edit_item_id'];
$item_name = $_POST['item_name'];
$item_code = $_POST['item_code'];
$item_category = $_POST['item_category'];
$item_description = $_POST['item_description'];
$sql = "UPDATE tbl_garage SET
item_name='$item_name',
item_code='$item_code',
item_category='$item_category',
item_description='$item_description'
WHERE id='$edit_item_id' ";
if ($conn->query($sql) === TRUE) {
echo '<script>window.location.href="inventory.php"</script>';
} else {
echo "Error updating record: " . $conn->error;
}
}
if(isset($_POST['delete'])){
// sql to delete a record
$delete_id = $_POST['delete_id'];
$sql = "DELETE FROM tbl_garage WHERE id='$delete_id' ";
if ($conn->query($sql) === TRUE) {
$sql = "DELETE FROM tbl_inventory WHERE id='$delete_id' ";
if ($conn->query($sql) === TRUE) {
$sql = "DELETE FROM tbl_inventory WHERE id='$delete_id' ";
echo '<script>window.location.href="inventory.php"</script>';
} else {
echo "Error deleting record: " . $conn->error;
}
} else {
echo "Error deleting record: " . $conn->error;
}
}
}
//Add Item
if(isset($_POST['add_item'])){
$item_name = $_POST['item_name'];
$item_code = $_POST['item_code'];
$item_category = $_POST['item_category'];
$item_description = $_POST['item_description'];
$sql = "INSERT INTO tbl_garage (item_name,item_code,item_description,item_category,item_critical_lvl,item_date)VALUES ('$item_name','$item_code','$item_description','$item_category','$item_critical_lvl','$date')";
if ($conn->query($sql) === TRUE) {
$add_inventory_query = "INSERT INTO tbl_inventory(item_name,item_code,date,qty)VALUES ('$item_name','$item_code','$date','0')";
if ($conn->query($add_inventory_query) === TRUE) {
echo '<script>window.location.href="inventory.php"</script>';
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
}
if(isset($_POST['add_inventory'])){
$add_stocks_id = clean($_POST['add_stocks_id']);
$remarks = clean($_POST["remarks"]);
$quantity = clean($_POST['quantity']);
$event = clean($_POST['event']);
$sql = "INSERT INTO tbl_events(date,item_name,item_code,qty,remarks,event)VALUES ('$date_time','$item_name','$item_code','$quantity','$remarks','$event')";
if ($conn->query($sql) === TRUE) {
$add_inv = "UPDATE tbl_inventory SET qty=(qty + '$quantity') WHERE id='$add_stocks_id' ";
if ($conn->query($add_inv) === TRUE) {
echo '<script>window.location.href="inventory.php"</script>';
} else {
echo "Error updating record: " . $conn->error;
}
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
}
if(isset($_POST['minus_inventory'])) {
$minus_stocks_id = clean($_POST['minus_stocks_id']);
$remarks = clean($_POST["remarks"]);
$quantity = clean($_POST['quantity']);
$sql = "INSERT INTO tbl_events(date,item_name,item_code,qty, sender_receiver,in_out, remarks)VALUES ('$date_time','$item_name','$item_code','$quantity','$received_by','out','$remarks')";
if ($conn->query($sql) === TRUE) {
$add_inv = "UPDATE tbl_inventory SET qty=(qty - '$quantity') WHERE id='$minus_stocks_id' ";
if ($conn->query($add_inv) === TRUE) {
echo '<script>window.location.href="inventory.php"</script>';
} else {
echo "Error updating record: " . $conn->error;
}
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
}
?>
</tbody>
</table>
</div>
<!--Add Item Modal -->
<div id="add" class="modal fade" role="dialog">
<div class="modal-dialog modal-lg">
<!-- Modal content-->
<div class="modal-content">
<form method="post" class="form-horizontal" role="form">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Add Item</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label class="control-label col-sm-2" for="item_name">Item Name:</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="item_name" name="item_name" placeholder="Item Name" autocomplete="off" autofocus required> </div>
<label class="control-label col-sm-2" for="item_code">Item Code:</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="item_code" name="item_code" placeholder="Item Code" autocomplete="off" required> </div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="item_category">Category:</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="item_category" name="item_category" placeholder="Item Category" autocomplete="off" required> </div>
<label class="control-label col-sm-2" for="item_critical_lvl">Critical Level:</label>
<div class="col-sm-4">
<input type="number" class="form-control" id="item_critical_lvl" name="item_critical_lvl" autocomplete="off" required> </div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="item_sub_category">Description:</label>
<div class="col-sm-10">
<textarea class="form-control" id="item_description" name="item_description" autocomplete="off" required></textarea>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary" name="add_item"><span class="glyphicon glyphicon-plus"></span> Add</button>
<button type="button" class="btn btn-warning" data-dismiss="modal"><span class="glyphicon glyphicon-remove-circle"></span> Cancel</button>
</div>
</form>
</div>
</div>
</div>

Related

How to auto compute values from database using JavaScript

I want to auto compute the remaining stock from inventory by typing in the input type named used. What I want to happen is after I type a number in 'Withdrawn' it should subtract to quantity then show the result to remaining stock. The values came from the database.
Here's what I did but I didn't work I don't know why can you please help me? I am still a beginner btw so correct my code if it looks wrong. Thank you
list.php:
<div class="modal fade" id="updatebtnmodal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Update Used</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<form id="myForm" action="<?php echo base_url().'admin/inventory/updateused/'.$inv['i_id'];?>" method="POST"
class="form-container mx-auto shadow-container" style="width:80%" enctype="multipart/form-data">
<div class="form-group">
<input type="hidden" name="update_id" id="update_id">
<label for="cname">Category</label>
<input type="text" class="form-control my-2
<?php echo (form_error('name') != "") ? 'is-invalid' : '';?>" name="cname" id="cname"
placeholder="Enter Item name" value="<?php echo set_value('cname',$inv['cat_id']); ?>" readonly>
<?php echo form_error('cname'); ?>
<span></span>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<input type="hidden" name="update_id" id="update_id">
<label for="name">Item Name</label>
<input type="text" class="form-control my-2
<?php echo (form_error('name') != "") ? 'is-invalid' : '';?>" name="name" id="name"
placeholder="Enter Item name" value="<?php echo set_value('name'); ?>" readonly>
<?php echo form_error('name'); ?>
<span></span>
</div>
<div class="form-group">
<label for="d_date">Delivered Date</label>
<input type="text" class="form-control my-2
<?php echo (form_error('d_date') != "") ? 'is-invalid' : '';?>" id="d_date" name="d_date"
placeholder="Delivered Date" value="<?php echo set_value('d_date'); ?>"readonly>
<?php echo form_error('d_date'); ?>
<span></span>
</div>
<div class="form-group">
<label for="used">Withdrawn</label>
<input type="number" class="form-control my-2
<?php echo (form_error('used') != "") ? 'is-invalid' : '';?>" id="used" name="used" class="used" onchange="calc()"
placeholder="Enter No. Withdrawn Items" value="<?php echo set_value('used'); ?>">
<?php echo form_error('used'); ?>
<span></span>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="quantity">Quantity</label>
<input type="number" class="form-control my-2
<?php echo (form_error('quantity') != "") ? 'is-invalid' : '';?>" id="quantity" name="quantity" class="quantity"
placeholder="Enter Quantity" value="<?php echo set_value('quantity'); ?>">
<?php echo form_error('quantity'); ?>
<span></span>
</div>
<div class="form-group">
<label for="exp_date">Expiration Date</label>
<input type="text" class="form-control my-2
<?php echo (form_error('e_date') != "") ? 'is-invalid' : '';?>" id="e_date" name="e_date"
placeholder="Expiration Date" value="<?php echo set_value('e_date'); ?>"readonly>
<?php echo form_error('e_date'); ?>
<span></span>
</div>
<div class="form-group">
<label for="rem_qty">Remaining Stock</label>
<input type="number" class="form-control my-2
<?php echo (form_error('rem_qty') != "") ? 'is-invalid' : '';?>" id="rem_qty" name="rem_qty" class="rem_qty"
placeholder="Enter No. Remaining Stock" >
<?php echo form_error('rem_qty'); ?>
<span></span>
</div>
</div>
</div>
<button type="submit" name="updatedata" class="btn btn-primary ml-2">Make Changes</button>
Back
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
Js:
function calc() {
var quantity = document.getElementById("quantity").innerHTML;
var used = document.getElementById("used").value;
var rem_qty = parseFloat(quantity) - used
if (!isNaN(rem_qty))
document.getElementById("rem_qty").innerHTML = rem_qty
}
Try this javascript code
function calc() {
var quantity = document.getElementById("quantity").value;
var used = document.getElementById("used").value;
var rem_qty = 0;
if(quantity >= used){
rem_qty = parseFloat(quantity) - used;
}
if(rem_qty != 0){
document.getElementById("rem_qty").value = rem_qty
}
}
I hope this code will help you out.

Populate modal with a mysql query reult data

i have an html page that shows data populated from mysql database.
I give to user choice to edit records. I would like to use a modal form that, when pressed edit, it open up and display data result from mysql db and realated to a certain "id".
Can you help me to achieve this?
Reading on web i've understood that i have to use jquery, but i cannot find a way.
For now i tried as following:
<form method="post">
<div class="modal fade" id="edit_grp" tabindex="-1" role="dialog" aria-labelledby="edit_grpLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="edit_grpLabel">Modifica Interno</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="recipient-name" class="col-form-label">Sequenza Chiamata</label>
<input type="text" class="form-control" name="edit_grp_pos" id="edit_grp_pos" value="<?php echo $row[0]['grp_pos']; ?>">
</div>
<div class="form-group">
<label for="message-text" class="col-form-label">Nome</label>
<input type="email" class="form-control" name="edit_grp_name" id="edit_grp_name" value="<?php echo $row[0]['grp_name']; ?>">
</div>
<div class="form-group">
<label for="message-text" class="col-form-label">Interno</label>
<input type="tel" class="form-control" name="edit_grp_phone" id="edit_grp_phone" value="<?php echo $row[0]['grp_phone']; ?>">
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" name="submit" value="submit" id="submit_edit_grp" class="btn btn-primary" onClick="closeAll()">Modifica</button>
</div>
</div>
</div>
</div>
</form>
EDIT 1:
I'am having some tests.
For now 've changed code like this:
`
<form method="post">
<div class="modal fade" id="edit_grp" tabindex="-1" role="dialog" aria-labelledby="edit_grpLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="edit_grpLabel">Modifica Interno</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" id="phone_details">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" name="submit" value="submit" id="submit_edit_grp" class="btn btn-primary" onClick="closeAll()">Modifica</button>
</div>
</div>
</div>
</div>
</form>
`
`
$(document).on('click', '.view_phone_data', function(){
var data_id = $(this).attr("id");
$.ajax({
url:"select.php",
method:"POST",
data:{data_id:data_id},
success:function(data){
$('#phone_details').html(data);
$('#edit_grp').modal('show');
}
});
});
`
and select.php
`
<?php
if(isset($_POST["data_id"]))
{
$output = '';
$connect = mysqli_connect("localhost","administrator","psw","db");
$query = "SELECT * FROM gruppioxe WHERE id = '".$_POST["data_id"]."'";
$result = mysqli_query($connect, $query);
$output .= '
<div class="table-responsive">
<table class="table table-bordered">';
while($row = mysqli_fetch_array($result))
{
$output .= '
<form>
<div class="form-group">
<label for="recipient-name" class="col-form-label">Ordine Chiamata</label>
<input type="tel" class="form-control" id="'.$row["grp_pos"].'" name="'.$row["grp_pos"].'">
</div>
<div class="form-group">
<label for="message-text" class="col-form-label">Nome</label>
<input type="text" class="form-control" id="'.$row["grp_name"].'" name="'.$row["grp_name"].'">
</div>
<div class="form-group">
<label for="message-text" class="col-form-label">Interno</label>
<input type="tel" class="form-control" id="'.$row["grp_phone"].'" name="'.$row["grp_phone"].'">
</div>
</form>
';
}
echo $output;
}
?>
`
But still no result..
Solved!!!
i've changed select.php as following:
`
$output .= '
<form>
<div class="form-group">
<label for="recipient-name" class="col-form-label">Ordine Chiamata</label>
<input type="tel" class="form-control" id="grp_pos" name="grp_pos" value="'.$row["grp_pos"].'">
</div>
<div class="form-group">
<label for="message-text" class="col-form-label">Nome</label>
<input type="text" class="form-control" id="grp_name" name="grp_name" value="'.$row["grp_name"].'">
</div>
<div class="form-group">
<label for="message-text" class="col-form-label">Interno</label>
<input type="tel" class="form-control" id="grp_phone name="grp_phone" value="'.$row["grp_phone"].'">
</div>
</form>
';
}
echo $output;
`

Get the value of textbox then pass to another modal

I want to get the value of a textbox (the value of order_id, to be more specific) from ordermodal.php then pass it to ordermodal2.php. In order to use it in my query.
This is my code for ordermodal.php
include_once 'ordermodal2.php';
/** *ordermodal.php **/
$id = "";
$order_date = "";
$order_time = "";
$order_id = "";
$order_deliverCharge = "";
$order_status = "";
$order_totalAmount= "";
$coordinates = "";
$driver_number = "";
$address = "";
$food_name="";
$special_request="";
$quantity="";
$amount="";
$orders="";
?>
<!-- MODALS --> <!-- DETAILS -->
<div id="myModal" class="modal fade" role="dialog" style="z-index: 1400;">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form action="" method="post" class="form-horizontal">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><center>×</button>
<h4 class="modal-title" id="titleModal">Order Information</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label for="order_id" class="col-sm-2 control-label">Order ID</label>
<div class="col-lg-3">
<input type="text" input style="width:500px" class="form-control" name="ORDER_ID" id="ORDER_ID" placeholder="" value="" required="required" readonly>
</div>
</div>
<div class="form-group">
<label for="id" class="col-sm-2 control-label">User ID</label>
<div class="col-lg-3">
<input type="text" input style="width:500px" class="form-control" name="user_id" id="user_id" placeholder="" value="" required="required" readonly>
</div>
</div>
<div class="form-group">
<label for="order_date" class="col-sm-2 control-label">Order Date</label>
<div class="col-lg-3">
<input type="text" input style="width:500px" class="form-control" name="order_date" id="order_date" placeholder="" value="" required="required" readonly>
</div>
</div>
<div class="form-group">
<label for="order_time" class="col-sm-2 control-label">Order Time</label>
<div class="col-lg-3">
<input type="text" input style="width:500px" class="form-control" name="order_time" id="order_time" placeholder="" value="" required="required" readonly>
</div>
</div>
<div class="form-group">
<label for="order_deliverCharge" class="col-sm-2 control-label">Delivery Charge</label>
<div class="col-lg-3">
<input type="text" input style="width:500px" class="form-control" name="order_deliveryCharge" id="order_deliveryCharge" placeholder="" value="" required="required" readonly>
</div>
</div>
<div class="form-group">
<label for="order_totalAmount" class="col-sm-2 control-label">Total Amount</label>
<div class="col-lg-3">
<input type="text" input style="width:500px" class="form-control" name="order_totalAmount" id="order_totalAmount" placeholder="" value="" required="required" readonly>
</div>
</div>
<div class="form-group">
<label for="address" class="col-sm-2 control-label">Address</label>
<div class="col-lg-3">
<input type="text" input style="width:500px" class="form-control" name="address" id="address" placeholder="" value="" required="required" readonly>
</div>
</div>
<div class="form-group">
<label for="coordinates" class="col-sm-2 control-label">Coordinates</label>
<div class="col-lg-3">
<input type="text" input style="width:500px" class="form-control" name="coordinates" id="coordinates" placeholder="" value="" required="required" maxlength="11" readonly>
</div>
</div>
<div class="form-group">
<label for="driver_number" class="col-sm-2 control-label">Driver Number</label>
<div class="col-lg-3">
<input type="text" input style="width:500px" class="form-control" name="driver_number" id="driver_number" placeholder="" value="" required="required" readonly>
</div>
</div>
<div class="form-group">
<label for="order_status" class="col-sm-2 control-label">Order Status</label>
<div class="col-lg-3">
<input type="text" input style="width:500px" class="form-control" name="order_status" id="order_status" placeholder="" value="" required="required" readonly>
</div>
</div>
<?php
$order_id = trim(addslashes($_POST['ORDER_ID']));
$sql = "SELECT food_name, special_request, quantity, amount
FROM cart_tbl
WHERE order_id=$order_id";
$result = mysqli_query(connection(), $sql);
?>
<table class="table table-hover table-bordered">
<thead>
<tr>
<th>Food</th>
<th>Special Request</th>
<th>Quantity</th>
<th>Amount</th>
</tr>
</thead>
<?php
if(mysqli_num_rows($result)>0)
{
while($row = mysqli_fetch_array($result))
{
?>
<tr>
<td><?php echo $row["food_name"];?></td>
<td><?php echo $row["special_request"];?></td>
<td><?php echo $row["quantity"];?></td>
<td><?php echo $row["amount"];?></td>
</tr>
<?php
}
}
?>
</table>
<tbody>
</div>
<div class="modal-footer">
<button type="submit" input style="background-color:#4CAF50;color:white" name="submitDelivered" id="submitDelivered" class="btn btn-primary " onclick="if(!confirm('Are you sure you want to deliver order?')){return false;}" > Delivered </button>
<button type="submit" input style="background-color:#0000FF;color:white" name="submitAccept" id="submitAccept" class="btn btn-primary" onclick="if(!confirm('Are you sure you want to accept order?')){return false;}" > Accept </button>
<button type="button" style="background-color:#FFFF00;color:black" class="btn btn-success" data-toggle="modal" data-target="#myDropdown" onclick="send('<?= $_POST['ORDER_ID'] ?>')"> Send </button>
<button type="submit" input style="background-color:#f44336;color:white" name="submitCancel" class="btn btn-danger" onclick="if(!confirm('Are you sure you want to cancel order?')){return false;}">Cancel</button>
<?php
if(isset($_POST['submitDelivered'])){
$ororder_id = trim(addslashes($_POST['ORDER_ID']));
$query = "UPDATE order_tbl SET `order_status`='Delivered' WHERE `order_id` = $order_id";
if (mysqli_query(connection(), $query)) {
mysqli_query(connection(), "COMMIT");
$_SESSION['message'] = "Order Delivered"; }
else {
$_SESSION['message'] = mysqli_error(connection());
mysqli_query(connection(), "ROLLBACK");
}
}
if(isset($_POST['submitAccept'])){
$order_id = trim(addslashes($_POST['ORDER_ID']));
$query = "UPDATE order_tbl SET `order_status`='Accepted' WHERE `order_id` = $order_id";
if (mysqli_query(connection(), $query)) {
mysqli_query(connection(), "COMMIT");
$_SESSION['message'] = "Order Accepted"; }
else {
$_SESSION['message'] = mysqli_error(connection());
mysqli_query(connection(), "ROLLBACK");
}
}
if(isset($_POST['submitCancel'])){
$order_id = trim(addslashes($_POST['ORDER_ID']));
$query = "UPDATE order_tbl SET `order_status`='Cancelled' WHERE `order_id` = $order_id";
if (mysqli_query(connection(), $query)) {
mysqli_query(connection(), "COMMIT");
$_SESSION['message'] = "Order Cancelled"; }
else {
$_SESSION['message'] = mysqli_error(connection());
mysqli_query(connection(), "ROLLBACK");
}
}
?>
</div>
</form>
</div>
</div>
</div>
<script>
function send(order_id) {
document.getElementById("titleModal2").innerHTML = "Choose Driver";
document.getElementsByName("ORDER_ID_MODAL_2")[0].setAttribute("value", order_id);
document.getElementsByName("send")[0].setAttribute("name", "send");
}
</script>
And this is the code for my ordermodal2.php
<!-- Modal -->
<div class="modal fade" id="myDropdown" role="dialog" style="z-index: 1600;">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<form action="" method="post" class="form-horizontal">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">× </button>
<h4 class="modal-title" id="titleModal2">Choose Driver</h4>
</div>
<div class="modal-body" >
<div class="form-group">
<label for="order_id" class="col-sm-2 control-label">Order ID</label>
<div class="col-lg-3">
<input type="text" input style="width:450px" class="form-control" name="ORDER_ID_MODAL_2" id="ORDER_ID_MODAL_2" placeholder="" value="" required="required" readonly>
</div>
</div>
<strong> Select Driver : </strong>
<select name="empName">
<option value=""> -----------ALL----------- </option>
<?php
$databaseHost = "localhost";
$databaseUser = "";
$databasePassword = "";
$databaseName = "";
$con=mysql_connect($databaseHost ,$databaseUser ,$databasePassword )or die ('Connection Error');
mysql_select_db("",$con) or die ('Database Error');
$dd_res=mysql_query("SELECT driver_number FROM driver_tbl");
while($r=mysql_fetch_row($dd_res))
{
echo "<option value='$r[0]'> $r[0] </option>";
}
?>
</select>
</div>
<div class="modal-footer">
<button type="submit" input style="background-color:#FFFF00;color:black" name="send" class="btn btn-primary"onclick="if(!confirm('Are you sure you want to send order?')){return false;}" >Confirm!</button>
<?php
if(isset($_POST['send'])){
$order_id = trim(addslashes($_POST['ORDER_ID_MODAL_2']));
$query = "UPDATE order_tbl SET `order_status`='Dispatched' WHERE `order_id` = $order_id";
if (mysqli_query(connection(), $query)) {
mysqli_query(connection(), "COMMIT");
$_SESSION['message'] = "Order Dispatched"; }
else {
$_SESSION['message'] = mysqli_error(connection());
mysqli_query(connection(), "ROLLBACK");
}
}
?>
</div>
</form>
</div>
</div>
</div>
The output will be: when I click the send button in ordermodal then the ordermodal2 will popup obviously,then the Order Id textbox have a value in it already when send button from ordermodal is clicked(the value is same with the ordermodal.php) then when i click the send button in ordermodal2(this is where i need that value) it will change the driver status to dispatched. I hope you can help me with my problem. TIA!
From reading your code, it looks like it should be simple.....
Change
document.getElementsByName("ORDER_ID_MODAL_2")[0].setAttribute("value", order_id);
To
document.getElementsByName("ORDER_ID_MODAL_2")[0].value('<?php echo $order_id?>');

populate field with data from DB in Modal Bootstrap 3 using Codeigniter and jquery

im using bootstrap 3 framework and codeigniter 3, i want to edit a row from table but i want to display row in thier field in modal
Code Html of table
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th>#</th>
<th>Nom et prénom</th>
<th>Age</th>
<th>Sexe</th>
<th>Assurance</th>
<th>Téléphone</th>
<th>E-mail</th>
<th></th>
</tr>
</thead>
<tbody>
<?php
foreach ($query->result() as $row)
{
?>
<tr>
<td><?php echo $row->no_dossier_pt; ?></td>
<td><?php echo $row->nom_pt .' '. $row->prenom_pt ?></td>
<?php
$date = new DateTime($row->datenaissance_pt);
$now = new DateTime();
$interval = $now->diff($date);
?>
<td><?php echo $interval->y .' ans'; ?></td>
<td><?php echo $row->sexe_pt; ?></td>
<td><?php echo $row->assurance_pt; ?></td>
<td><?php echo $row->telephone_pt; ?></td>
<td><?php echo $row->email_pt; ?></td>
<td>
<a type="button" href="<?php echo base_url() ?>patient/patient_delete/<?php echo $row->id; ?>" class="btn btn-danger">Supprimer</a>
<a type="button" data-toggle="modal" href="#editpatient" data-id="<?php echo $row->id; ?>" class="btn btn-warning" >Editer</a>
<?php $this->load->view('template/patient_update'); ?>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</div>
</div>
</div>
<?php
$this->load->view('template/footer');
?>
but i can't understand how can i pass 'id' of this row to the controller and return the specific data row from controller to thier field in Modal form,
this is code of button
<a type="button" data-toggle="modal" href="#editpatient" data-id="<?php echo $row->id; ?>" class="btn btn-warning" >Editer</a>
and my Modal form Code
<!-- Modal -->
<div class="modal fade" id="editpatient" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel"> Information patient 2</h4>
</div>
<!-- formulaire -->
<?php echo form_open('patient/patient_update'); // action to the controller?>
<div class="modal-body">
<!-- hidden input montinned with class sr-only -->
<label class="sr-only" =""></label>
<input type="text" name="no_dossier_pt" class="sr-only" >
<div class="form-group">
<input type="text" class="form-control" id="nom_pt" name="nom_pt" id="nom_pt" placeholder="Nom ...">
</div>
<div class="form-group">
<input type="text" class="form-control" id="prenom_pt" name="prenom_pt" id="prenom_pt" placeholder="Prénom ....">
</div>
<div class="form-group">
<label for="exampleInputFile">Sexe : </label>
<input type="radio" name="sexe_pt" id="radio-choice-1" value="homme" checked="checked" />
<label for="radio-choice-1"> Homme </label>
<input type="radio" name="sexe_pt" id="radio-choice-2" value="femme" />
<label for="femme"> Femme </label>
<input type="radio" name="sexe_pt" id="radio-choice-3" value="enfant" />
<label for="enfant">Enfant</label>
</div>
<div class="form-group ">
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-calendar">
</i>
</div>
<input class="form-control" id="date" name="date" placeholder="Date de naissance" type="text"/>
</div>
</div>
<div class="form-group">
<label for="exampleInputFile">Assurance : </label>
<input type="radio" name="assurance_pt" id="radio-choice-1" value="oui" checked="checked" />
<label for="radio-choice-1"> Oui </label>
<input type="radio" name="assurance_pt" id="radio-choice-2" value="non" />
<label for="femme"> Non </label>
</div>
<div class="form-group">
<input type="text" class="form-control" name ="telephone_pt" placeholder="Téléphone ...">
</div>
<div class="form-group">
<input type="text" class="form-control" name ="email_pt" placeholder="Email ...">
</div>
<div class="form-group">
<textarea class="form-control" cols="40" name="note_pt" rows="3" placeholder="Note sur ce patient ..."></textarea>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Fermer</button>
<button type="submit" class="btn btn-primary">Enregistrer</button>
</div>
<?php echo form_close(); ?>
</div>
</div>
</div>
<!-- Modal -->
Controller Methode to display
public function patient_selectbyid()
{
$data = array();
$id = $this->input->post('pt_id');
$this->load->model('patient_model');
$data = $this->studentModel->getStudent($id);
echo $data;
}
Code jquery
$(document).ready(function() {
var id_edit = $(this).data('id');
var base_url = <? php echo base_url('patient/patient_selectbyid'); ?> ;
$('.editStudent').click(function() {
$.ajax({
url: base_url,
type: 'POST',
data: {
'pt_id': id_edit
},
dataType: 'JSON';
success: function(result) {
$('.modal-body #nom_pt').val(result[0].nom_pt);
$('.modal-body #prenom_pt').val(result[0].prenom_pt);
}
});
});
});
I hope someone can help me coding this, thanks you
thanks brother for your recommandations , i had resolve the problem by using event listner as you say, i just sent data DB using data attribute in the button like this:
<button type="button" class="btn btn-warning" data-toggle="modal" data-target="#editPatient" data-id="<?php echo $row->id ?>" data-nom="<?php echo $row->nom_pt ?>" data-prenom="<?php echo $row->prenom_pt ?>" data-nod="<?php echo $row->no_dossier_pt ?>" data-sexe="<?php echo $row->sexe_pt; ?>" data-dn="<?php echo $row->datenaissance_pt; ?>" data-assur="<?php echo $row->assurance_pt; ?>" data-tele="<?php echo $row->telephone_pt; ?>" data-email="<?php echo $row->email_pt; ?>" data-note="<?php echo $row->note_pt; ?>" >
Modifier
the modal like this
<!-- Modal -->
<div class="modal fade" id="editPatient" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel"> Information patient </h4>
</div>
<div class="modal-body">
<!-- formulaire -->
<?php echo form_open('patient/patient_update'); ?>
<label class="sr-only" =""></label>
<input type="text" name="id" class="sr-only" id="id_hidd" >
<div class="form-group">
<input type="text" class="form-control" id="nom_pt" name="nom_pt" placeholder="Nom ...">
</div>
<div class="form-group">
<input type="text" class="form-control" id="prenom_pt" name="prenom_pt" placeholder="Prénom ....">
</div>
<div class="form-group">
<label for="exampleInputFile">Sexe : </label>
<input type="radio" name="sexe" id="homme" value="homme" checked="checked" />
<label for="homme"> Homme </label>
<input type="radio" name="sexe" id="femme" value="femme" />
<label for="femme"> Femme </label>
<input type="radio" name="sexe" id="enfant" value="enfant" />
<label for="enfant">Enfant</label>
</div>
<div class="form-group ">
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-calendar">
</i>
</div>
<input class="form-control" id="date" name="date" placeholder="Date de naissance" type="text"/>
</div>
</div>
<div class="form-group">
<label for="exampleInputFile">Assurance : </label>
<input type="radio" name="assurance" id="assur" value="oui" checked="checked" />
<label for="radio-choice-1"> Oui </label>
<input type="radio" name="assurance" id="nonassur" value="non" />
<label for="femme"> Non </label>
</div>
<div class="form-group">
<input type="text" class="form-control" id="telephone_pt" name ="telephone_pt" placeholder="Téléphone ...">
</div>
<div class="form-group">
<input type="text" class="form-control" id ="email_pt" name ="email_pt" placeholder="Email ...">
</div>
<div class="form-group">
<textarea class="form-control" cols="40" id="note_pt" name="note_pt" rows="3" placeholder="Note sur ce patient ..."></textarea>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Fermer</button>
<button type="submit" class="btn btn-primary">Enregistrer</button>
</div>
<?php echo form_close(); ?>
</div>
</div>
</div>
script that recive data and displayed on Modal form like this:
<script type="text/javascript">
$('#editPatient').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget) // Button that triggered the modal
var id = button.data('id')
var prenom = button.data('prenom')
var nom = button.data('nom')
var nod = button.data('nod')
var sexe = button.data('sexe')
var dn = button.data('dn')
var tele = button.data('tele')
var email = button.data('email')
var note = button.data('note')
if (sexe == 'femme'){
var id_sexe = "femme"
document.getElementById(id_sexe).setAttribute("checked", "checked")
}
if (sexe == 'homme'){
var id_sexe = "homme"
document.getElementById(id_sexe).checked = true
}
if (sexe == 'enfant'){
var id_sexe = "enfant"
document.getElementById(id_sexe).checked = true
}
if (assur == 'oui'){
var id_assur = "assur"
document.getElementById(id_assur).checked = true
}
if (assur == 'non'){
var id_assur = "nonassur"
document.getElementById(id_assur).checked = true
}
var modal = $(this)
modal.find('.modal-title').text('Modifier patient ('+nod+')')
modal.find('.modal-body #id_hidd').val(id)
modal.find('.modal-body #nom_pt').val(nom)
modal.find('.modal-body #prenom_pt').val(prenom)
modal.find('.modal-body #date').val(dn)
modal.find('.modal-body #telephone_pt').val(tele)
modal.find('.modal-body #email_pt').val(email)
modal.find('.modal-body #note_pt').val(note)
})
</script>
thanks for your help if you have any other suggestion or question i'll be gratfull

editing multiple users using modal form (javascript, html)

Hi guys the issue I have is within my users admin page, I have displayed all the admin users within a table each assigned a delete and edit button.
When I click on edit the given users details appear in a modal form. Within the edit details there is a password and confirm password box, when I click on the edit details for the first user, the validation for confirm password appears as "passwords don't match" however when I click on the second user the confirm password does not validate.
Below is the source code I am having issues with any help will be much appreciated:
<a rel="tooltip" title="Edit" id="e<?php echo $id; ?>" href="#edit<?php echo $id; ?>" data-toggle="modal" class="btn btn-success"></i>Edit</a>
<div id="edit<?php echo $id;?>" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-body">
<div class="alert alert-info"><strong>Edit User</strong></div>
<form class="form-horizontal" method="post">
<div class="control-group">
<label class="control-label" for="inputEmail">Firstname</label>
<div class="controls">
<input type="text" id="inputEmail" name="firstname" value="<?php echo $row['firstname']; ?>" required>
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputEmail">Lastname</label>
<div class="controls">
<input type="text" id="inputEmail" name="lastname" value="<?php echo $row['lastname']; ?>" required>
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputEmail">Mobile Number</label>
<div class="controls">
<input type="text" id="inputEmail" name="mobilenumber" value="<?php echo $row['mobilenumber']; ?>" required>
</div>
</div>
<input type="hidden" id="inputEmail" name="id" value="<?php echo $row['admin_id']; ?>" required>
<div class="control-group">
<label class="control-label" for="inputPassword">Password</label>
<div class="controls">
<input type="text" name="password" id="password" required>
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputPassword">Confirm Password</label>
<div class="controls">
<input type="text" name="confirmpassword" id="confirmpassword" required>
</div>
</div>
<div class="control-group">
<div class="controls">
<button name="edit" type="submit" class="btn btn-success"> Update</button>
</div>
</div>
<script type="text/javascript">
window.onload = function () {
document.getElementById("password").onchange = validatePassword;
document.getElementById("confirmpassword").onchange = validatePassword;
}
function validatePassword(){
var confirmpassword=document.getElementById("confirmpassword").value;
var password=document.getElementById("password").value;
if(password!=confirmpassword)
document.getElementById("confirmpassword").setCustomValidity("Passwords Don't Match");
else
document.getElementById("confirmpassword").setCustomValidity('');
//empty string means no validation error
}
</script>
</form>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true"> Close</button>
</div>
</div>
<?php
if (isset($_POST['edit'])){
$admin_id=$_POST['id'];
$firstname=$_POST['firstname'];
$lastname=$_POST['lastname'];
$mobilenumber=$_POST['mobilenumber'];
$password= sha1 ($_POST['password']);
mysql_query("update admin set firstname = '$firstname', lastname = '$lastname', mobilenumber = '$mobilenumber', password = '$password' where admin_id='$admin_id'")or die(mysql_error()); ?>
<script>
window.location="adminusers.php";
</script>
<?php
}
}
?>
Validation issue
Validation issue 2

Categories

Resources