In my app I want the user to mention how many columns he wants for the table and then enter the data for those columns and create a table with those values.
Here is what I have:
<form action="" method="post">
<label for="numOfCols">Enter Number of Fields</label>
<input name="numOfCols" type="number" id="numOfCols">
<button type="submit" class="btn btn-info" name="numOfColsSubmit" >Generate</button>
</form>
<?php if(isset($_POST["numOfCols"])): ?>
<form action="" method="post">
<label for="tbName">Enter Layout Name</label>
<input type="text" name="tbName" id="tbName" class="form-control">
<?php $numOfCols = $_POST["numOfCols"];
for ($colNum = 0 ; $colNum < $numOfCols ; $colNum++): ?>
<div class="row g-4">
<div class="col-sm">
<label for="col_name<?php $colNum ?>">Name</label><br>
<input class="form-control" id="col_name<?php $colNum ?>" type="text"
name="col_name<?php $colNum ?>" >
</div>
<div class="col-sm">
<label for="col_types<?php $colNum ?>">Type</label><br>
<select name="col_types<?php $colNum ?>" class="form-control" id="col_types<?php $colNum ?>">
<option value="int">INT</option>
<option value="varchar" >VARCHAR</option>
<option value="text">TEXT</option>
</select>
</div>
<div class="col-sm">
<label for="col_length<?php $colNum ?>">Length</label><br>
<input type="text" class="form-control" name="col_length<?php $colNum ?>" id="col_length<?php $colNum ?>">
</div>
<div class="col-sm">
<br><button type="submit" class="btn btn-success" name="submitaddcol<?php $colNum ?>">Submit</button>
</div>
</div>
<?php endfor; ?>
<button type="submit" name="createtb" class="btn">Create Layout</button>
</form>
<?php endif;?>
<?php if(isset($_POST["tbName"])){
$table->createTb($_POST['tbName']);
} ?>
and the function for creating the table :
function createTb($tb){
$arr = [];
if(isset($_POST['col_name'])){
$colName = $_POST['col_name'];
}
if(isset($_POST['col_types'])){
$colTypes = $_POST['col_types'];
}
if(isset($_POST['col_length'])){
$colLength = $_POST['col_length'];
}
echo $tb;
array_push($arr , $colName , $colTypes , $colLength);
$stmt = $this->pdo->prepare("CREATE TABLE $tb ($colName $colTypes($colLength)) ");
$stmt->execute([$_POST['name'], 29]);
$stmt->execute();
$stmt = null;
}
I was thinking of getting the data from the user, pass it to an array and then use that array in my query.
The problem is I cannot get all of the user data. If the user has 2 or more columns, it will always get the last column. Any insight?
(Putting the createTb($_POST['tbName']) inside the for loop for some reason results in now showing or calling the function at all)
You can name your input-fields as an array like:
<input type="text" name="col_name[]" value="foo" />
And get it with var_dump($_POST['col_name']);
In your example you could do like this:
<?php $numOfCols = $_POST["numOfCols"];
for ($colNum = 0 ; $colNum < $numOfCols ; $colNum++): ?>
<input class="form-control" id="col_name_<?=$colNum ?>" type="text" name="col_name[<?=$colNum ?>]" >
<input type="text" class="form-control" name="col_length[<?= $colNum ?>]" id="col_length_<?=$colNum ?>">
<?php endfor; ?>
And get the result:
if(isset($_POST['col_name']) && is_array($_POST['col_name'])) {
for($i = 0; $i < count($_POST['col_name']); $i++) {
var_dump($_POST['col_name'][$i]);
var_dump($_POST['col_length'][$i]);
}
}
Related
I have created the following code and on the last 3 inputs, I would like to calculate INPUT1 with INPUT2 and automatically get the result on INPUT3.
At the moment it's not working ofc, but if I change the INPUT3 to suddenly it works, but ofc I cannot get any data to be posted onto the database. How can I output the result of the calculation without having to use a span tag?
Here is the Code.
<script>
function divideBy()
{
num1 = document.getElementById("firstNumber").value;
num2 = document.getElementById("secondNumber").value;
document.getElementById("result").innerHTML = num2 % num1;
}
</script>
<body>
<div class="wrapper">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<div class="page-header">
<h2>Create new Route</h2>
</div>
<p>Enter the route<i><strong>"YYYY-MM-DD</i></p>
<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
<div class="form-group <?php echo (!empty($reason_err)) ? 'has-error' : ''; ?>">
<label>Reason</label>
<input type="text" name="reason" class="form-control" value="<?php echo $reason; ?>">
<span class="help-block"><?php echo $reason_err;?></span>
</div>
<div class="form-group <?php echo (!empty($startdest_err)) ? 'has-error' : ''; ?>">
<label>Start Destination</label>
<input type="text" name="startdest" class="form-control" value="<?php echo $startdest; ?>">
<span class="help-block"><?php echo $startdest_err;?></span>
</div>
<div class="form-group <?php echo (!empty($enddest_err)) ? 'has-error' : ''; ?>">
<label>End Destination</label>
<input type="text" name="enddest" class="form-control" value="<?php echo $enddest; ?>">
<span class="help-block"><?php echo $enddest_err;?></span>
</div>
<div class="form-group <?php echo (!empty($startkm_err)) ? 'has-error' : ''; ?>">
<label>INPUT 1</label>
<input type="text" name="startkm" class="form-control" id="firstNumber" value="<?php echo $startkm; ?>">
<span class="help-block"><?php echo $startkm_err;?></span>
</div>
<div class="form-group <?php echo (!empty($endkm_err)) ? 'has-error' : ''; ?>">
<label>INPUT 2</label>
<input type="text" name="endkm" class="form-control" id="secondNumber" onChange="divideBy()" value="<?php echo $endkm; ?>">
<span class="help-block"><?php echo $endkm_err;?></span>
</div>
<div class="form-group <?php echo (!empty($totalkm_err)) ? 'has-error' : ''; ?>">
<label>INPUT3</label>
<input type="text" name="totalkm" id="result" class="form-control" value="<?php echo $totalkm; ?>">
<span class="help-block"><?php echo $totalkm_err;?></span>
</div>
<input type="submit" class="btn btn-primary" value="Submit">
Cancel
</form>
If i change it from:
<div class="form-group <?php echo (!empty($totalkm_err)) ? 'has-error' : ''; ?>">
<label>Total Km</label>
<input type="text" name="totalkm" id="result" class="form-control" value="<?php echo $totalkm; ?>">
<span class="help-block"><?php echo $totalkm_err;?></span>
</div>
To this it works but ofc as I said no data is posted:
<div class="form-group <?php echo (!empty($totalkm_err)) ? 'has-error' : ''; ?>">
<label>Total Km</label>
<span type="text" name="totalkm" id="result" class="form-control" value="<?php echo $totalkm; ?>">
<span class="help-block"><?php echo $totalkm_err;?></span>
</div>```
#KIKO Software I solved after reading your comment a couple of times :) code that was changed "document.getElementById("result").value" and it solved the issue now upon changing the last input it automatically calculates the result from those two inputs mentioned before, and this was the result I was looking for.
<script>
function divideBy()
{
num1 = document.getElementById("firstNumber").value;
num2 = document.getElementById("secondNumber").value;
document.getElementById("result").value = num2 % num1;
}
</script>
Thank you for your help :)
The question I've got in my test goes like so.
You have 1 select with 2 options(item number1 and item number2) and 2 input fields(price,weight). How would you make the input fields change without writing in them?
So after a long time of searching and trying stuff out (without much luck) I've learned that I need to use ajax for this to work. so I have tried a bunch and this is the code I've tried edit so it would work.
getAllproduct is just a select that fetches all the data inside my table with products. this is id, name, item_number, price, weight. anyhow here is my code
<?php
$sth = $db->prepare("SELECT `price`,`weight` FROM product");
$sth->execute();
$row = $sth->fetch(PDO::FETCH_ASSOC);
$row = array();
json_encode($row);
?>
product.php
<div class="form-group col-2">
<label for="product">Item number</label>
<?=#$error['product']?>
<select class="form-control" name="product" id="product" onChange="getproduct(this.value)">
<?php foreach ($csv->getAllproduct() as $csv) { ?>
<option value="<?= #$csv->id ?>" selected><?= #$csv->product?></option>
<?php } ?>
</select>
</div>
<div class="form-group col-2">
<label for="weight">weight</label>
<?=#$error['weight']?>
<input type="text" name="weight" id="weight" class="form-control">
</div>
<div class="form-group col-2">
<label for="price">price</label>
<?=#$error['price']?>
<input type="text" name="price" id="price" class="form-control">
</div>
<div class="input-group">
<button type="submit" style="margin-left:15px; margin-bottom: 15px; z-index: 5" class="btn btn-success" value="Opret" name="btn_opret_maal">Submit</button>
</div>
<script>
function getproduct(val){
$.ajax({
type:"POST",
url:"pages\call.php",
data: 'product='+val,
success: function(response){
var result = JSON.parse(response);
if (result.response == true) {
var data = result.rows;
$("#weight").val(data[0].weight);
$("#price").val(data[0].price);
}else if (result.response == false) {
$('#product').append('<option>No products were found!</option>');
}
}
});
}
</script>
What I expect to be able to do is select an item number and it will automatically populate the inputfields price and weight with the data inside the database from the item number.
I haven't learned a lot of Ajax/js so Any help is appreciated.
Attempt: on other project using this code. havent gotten it to work yet.
<form class="row" method="POST" >
<div style="border-color:#dddddd;" class="dropdown-divider col-12"></div>
<script>$('#Varenummer').on('change', function() {
var selectedOption = $(this).find('option:selected');
$('#Tolminus').val(selectedOption[0].dataset.Tolminus);
$('#Tolplus').val(selectedOption[0].dataset.Tolplus);
});
</script>
<div class="form-group col-2">
<label for="Varenummer">Varenummer</label>
<?= #$error['Varenummer'] ?>
<select class="form-control" name="Varenummer" id="Varenummer">
<?php
foreach ($csv->getAllVarenummer() as $csv) {?>
<option value="<?= #$csv->id ?>" data-Tolminus="<?= #$csv->Tolminus ?>"
data-Tolplus="<?= #$csv->Tolplus ?>"><?= #$csv->Varenummer ?></option>
<?php }?>
</select>
</div>
<div class="form-group col-2">
<label for="Tolminus">Tol -</label>
<?= #$error['Tolminus'] ?>
<input type="text" name="Tolminus" id="Tolminus" class="form-control" value="">
</div>
<div class="form-group col-2">
<label for="Tolplus">Tol +</label>
<?= #$error['Tolplus'] ?>
<input type="text" name="Tolplus" id="Tolplus" class="form-control" value="">
</div>
<div class="input-group">
<button type="submit" style="margin-left:15px; margin-bottom: 15px; z-index: 5" class="btn btn-success" value="Opret" name="btn_opret_maal">Submit</button>
</div>
the jquery scrips and others are added in the footer.
As you asked above in comments: i need it to the input to change when i select an option. can i still only use php?...
Yes.
You might not need ajax at all. For your task I'd recommend to preload weight and price values into data- attributes of corresponding option elements. Then, on the select change, just get those values and paste them to inputs.
$('#product').on('change', function() {
var selectedOption = $(this).find('option:selected');
$('#weight').val(selectedOption[0].dataset.weight);
$('#price').val(selectedOption[0].dataset.price);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group col-2">
<label for="product">Item number</label>
<select class="form-control" name="product" id="product">
<option disabled selected>Choose product...</option>
<option value="1" data-weight="100" data-price="1000">Product 1</option>
<option value="2" data-weight="50" data-price="200">Product 2</option>
<option value="3" data-weight="25" data-price="115">Product 3</option>
</select>
</div>
<div class="form-group col-2">
<label for="weight">weight</label>
<input type="text" name="weight" id="weight" class="form-control">
</div>
<div class="form-group col-2">
<label for="price">price</label>
<input type="text" name="price" id="price" class="form-control">
</div>
<div class="input-group">
<button type="submit" style="margin-left:15px; margin-bottom: 15px; z-index: 5" class="btn btn-success" value="Opret" name="btn_opret_maal">Submit</button>
</div>
For the PHP generated select (assuming the getAllproduct method returns weight and price properties):
...
<div class="form-group col-2">
<label for="product">Item number</label>
<?=#$error['product']?>
<select class="form-control" name="product" id="product">
<?php foreach ($csv->getAllproduct() as $csv) { ?>
<option value="<?= #$csv->id ?>" data-weight="<?= #$csv->weight ?>" data-price="<?= #$csv->price ?>"><?= #$csv->product?></option>
<?php } ?>
</select>
</div>
...
I'm trying to create a live search with AJAX.
Then when I click the result I want the result to fill 5 input fields.
Here is what I have tried:
Here is my cari.php file:
while ($cari_karyawans = $cari_karyawan->fetch()) { ?>
<div class="result" onclick="fill('nik','<?php echo $cari_karyawans['nik_k_ptayp']; ?>')">
<div class="result" onclick="fill('nama','<?php echo $cari_karyawans['nama_k_ptayp']; ?>')">
<div class="result" onclick="fill('lokasi','<?php echo $cari_karyawans['jabatan_k_ptayp']; ?>')">
<div class="result" onclick="fill('divisi','<?php echo $cari_karyawans['divisi_k_ptayp']; ?>')">
<div class="result" onclick="fill('jabatan','<?php echo $cari_karyawans['lokasi_k_ptayp']; ?>')">
<a><small class="text-muted"><i><?php echo $cari_karyawans['nik_k_ptayp']; ?></i></small> / <small class="text-muted"><i><?php echo $cari_karyawans['nama_k_ptayp']; ?></i></small></a>
</div></div></div></div></div>
<?php } ?>
Here is how I try to fill the result:
function fill(nik, nama, lokasi, divisi, jabatan) {
$('#nik').val(nik);
$('#nama').val(nama);
$('#lokasi').val(lokasi);
$('#divisi').val(divisi);
$('#jabatan').val(jabatan);
$('#display').hide();
}
Here is my input file:
<input type="text" class="form-control" id="nik">
<input type="text" class="form-control" id="nama">
<input type="text" class="form-control" id="lokasi">
<input type="text" class="form-control" id="divisi">
<input type="text" class="form-control" id="jabatan">
Your JS function fill should be :
function fill(id, value) {
$('#'+id).val(value);
}
Because you already sending the id as the first argument and the value as the second.
I am trying to pass my JavaScript variable using Ajax into my PHP script but that doesn't work it given me error that it is undefined index. both codes are in different files but both of them are accessible on the main page.
Here's my script.php
<script>
function get_child_options(){
var parentID = jQuery('#parent').val();
jQuery.ajax({
url: '/**/**/**/child_categories.php',
type: 'POST',
data: {parentID : parentID},
success: function(data){
jQuery('#child').html(data);
},
error: function(){alert("Something Went Wrong with child options. ")},
});
}
jQuery('select[name="parent"]').change(get_child_options);
</script>
And this is my php file
<?php
require_once $_SERVER['DOCUMENT_ROOT'].'/ **/core/init.php'; //Including database path stored in init.php
$parentID = (int)$_POST['parentID'];
$childQuery = "SELECT * FROM categories WHERE parent = '$parentID' ORDER BY category";
ob_start();
?>
<option value="">Select <strong>Child</strong> Category</option>
<?php while ($child = mysqli_fetch_assoc($childQuery)): ?>
<option value="<?= $child['id']; ?>"><?= $child['category']; ?></option>
<?php endwhile; ?>
<?php
echo ob_get_clean();
?>
in script the #parent is a form id i am passing to javascript using jQuery.
because of variable is not accessible PHP is not running query.
This is my products.php the main where page where this is happening
<?php
require_once $_SERVER['DOCUMENT_ROOT'].'/Online Store/core/init.php'; //Including database path stored in init.php
include 'includes/head.php'; //Including header
include 'includes/navigation.php'; //Including Navigation bar
include 'includes/script.php';
if (isset($_GET['add'])) {
$brandQuery = $db->query("SELECT * FROM brand ORDER BY brand");
$parentQuery = $db->query("SELECT * FROM categories WHERE parent = 0 ORDER BY category");
?>
<h2 class="text-center">Add A New Product</h2><hr />
<form action="products.php?add=1" method="post" enctype="multipart/form-data">
<div class="form-group col-md-3">
<label for="title">Title*:</label>
<input type="text" class="form-control" id="title" name="title" value="<?= ((isset($_POST['title']))?sanitize($_POST['title']):''); ?>" placeholder="Add a title" />
</div>
<div class="form-group col-md-3">
<label for="brand">Brand*: </label>
<select class="form-control ">
<option value="" <?= ((isset($_POST['brand']) && $_POST['brand'] == '')?' selected':''); ?> >Select Brand</option>
<?php while($brand = mysqli_fetch_assoc($brandQuery)): ?>
<option value="<?= $brand['id']; ?>" <?= ((isset($_POST['brand']) && $_POST['brand'] == $brand['id'])?' selected':''); ?> ><?= $brand['brand'] ?></option>
<?php endwhile; ?>
</select>
</div>
<div class="form-group col-md-3">
<label for="parent">Parent Category*: </label>
<select class="form-control" id="parent" name="parent">
<option value="" <?= ((isset($_POST['parent']) && $_POST['parent'] == '')?' select':''); ?> >Select <strong>Parent</strong> Category</option>
<?php while($parent = mysqli_fetch_assoc($parentQuery)): ?>
<option value="<?= $parent['id']; ?>" <?= ((isset($_POST['parent']) && $_POST['parent'] == $parent['id'])?' select':''); ?> ><?= $parent['category']; ?></option>
<?php endwhile; ?>
</select>
</div>
<div class="form-group col-md-3">
<label for="child">Child Category*: </label>
<select id="child" name="child" class="form-control"></select>
<?php include $_SERVER['DOCUMENT_ROOT'].'/Online Store/admin/parsers/child_categories.php'; ?>
</div>
<div class="form-group col-md-3">
<label for="price">Price*: </label>
<input type="text" id="price" name="price" class="form-control" value="<?= ((isset($_POST['price']))?sanitize($_POST['price']):''); ?>" />
</div>
<div class="form-group col-md-3">
<label for="list_price">List Price*: </label>
<input type="text" id="list_price" name="list_price" class="form-control" value="<?= ((isset($_POST['list_price']))?sanitize($_POST['list_price']):''); ?>" />
</div>
<div class="form-group col-md-3">
<label>Quantity & Sizes</label>
<button class="btn btn-default btn-info form-control" onclick="jQuery('#sizesModal').modal('toggle'); return false;">Quantity & Sizes</button>
</div>
<div class="form-group col-md-3">
<label for="sizes">Sizes & Quantity preview*: </label>
<input type="text" name="sizes" id="sizes" class="form-control" value="<?= ((isset($_POST['sizes']))?$_POST['sizes']:''); ?>" readonly/>
</div>
<div class="form-group col-md-6">
<label for="photo">Photo*: </label>
<input type="file" name="photo" id="photo" class="form-control" />
</div>
<div class="form-group col-md-6">
<label for="description">Description</label>
<textarea name="description" id="description" class="form-control" rows="6" placeholder="Description" ><?= ((isset($_POST['description']))?sanitize($_POST['description']):''); ?></textarea>
</div>
<div class="form-group pull-right">
<input type="submit" class="form-control btn btn-success" value="Add Product" />
</div>
<div class="clearfix"></div>
</form>
<?php
}else{
$sql = "SELECT * FROM products WHERE deleted = 0";
$presults = $db->query($sql);
$product = mysqli_fetch_assoc($presults);
// Featured product
if (isset($_GET['featured'])) {
$id = (int)$_GET['id'];
$featured = (int)$_GET['featured'];
$featuredSql = "UPDATE `products` SET `featured` = '$featured' WHERE `products`.`id` = '$product[id]' ";
$db->query($featuredSql);
// header('Location: products.php');
}
?>
<h2 class="text-center">Products</h2>
Add Product<div class="clearfix"></div>
<hr />
<table class="table table-bordered table-condensed table-striped">
<thead>
<th></th>
<th>Product</th>
<th>Price</th>
<th>Category</th>
<th>Featured</th>
<th>Sold</th>
</thead>
<tbody>
<?php
while($product = mysqli_fetch_assoc($presults)):
$childID = $product['categories'];
$catSql = "SELECT * FROM categories WHERE id = '$childID'";
$result = $db->query($catSql);
$child = mysqli_fetch_assoc($result);
$parentID = $child['parent'];
$pSql = "SELECT * FROM categories WHERE id = '$parentID'";
$presult = $db->query($pSql);
$parent = mysqli_fetch_assoc($presult);
$category = $parent['category'].'~'.$child['category'];
?>
<tr>
<td>
<span class= " glyphicon glyphicon-pencil"></span>
<span class= " glyphicon glyphicon-remove-sign"></span>
</td>
<td><?= $product['title']; ?></td>
<td><?= money($product['price']) ?></td>
<td><?= $category; ?></td>
<td><a href="products.php?featured=<?= (($product['featured'] == 0)?'1':'0'); ?>&id =<?= $product['id']; ?>" class=" btn btn-sx btn-default">
<span class=" glyphicon glyphicon-<?= (($product['featured'] == 1)?'minus':'plus'); ?>"></span>
</a>  <?= (($product['featured'] == 1)?'Featured':''); ?></td>
<td>0</td>
</tr>
<?php endwhile; ?>
</tbody>
</table>
<?php
}
include 'includes/footer.php'; //Including footer
?>
Is there any other way to do it? What I am trying to do is when user selects parent category I want child category to arrange as per parent category.
Try this:
<script>
function get_child_options(){
var parentID = $(this).val();
jQuery.ajax({
url: '/**/**/**/child_categories.php',
type: 'POST',
data: {'parentID' : parentID},
success: function(data){
jQuery('#child').html(data);
},
error: function(){alert("Something Went Wrong with child options. ")},
});
}
jQuery('select[name="parent"]').change(get_child_options);
</script>
Getting the Value by $(this) and putting single quotes around parentID data: {'parentID' : parentID},
I have multiple edit records. I used script below to compare the value of textbox1 in textbox 2. But the problem is, when I try to edit multiple records. The script function only on the first record. How I can pass the for loop in php to javascript?
For Loop
$id=$_POST['checkbox'];
$N = count($id);
for($i=0; $i < $N; $i++)
{
This gets all records depends on number of checkbox that have been checked. And when I get all the value in for loop opens records depends on counter value. Just like this how I can pass this for loop functions to javascript?
<script>
$('#sbtBtn').live('click',function(){
var textBox1=document.getElementById('pr_qty[]').value;
var textBox2=document.getElementById('pr_total').value;
if((+textBox2) > textBox1){
alert('value is greater than quantity');
return false;
}else{
}
});
</script>
<div class="container">
<form class="form-horizontal" action="" method="post">
<?php
$id=$_POST['checkbox'];
$N = count($id);
for($i=0; $i < $N; $i++)
{
$result1 = $mysqli->query("
SELECT a.item_name, a.item_description, a.counter, b.counter, b.pr, b.total_quantity
FROM app a
LEFT OUTER JOIN purchase_request b
ON a.counter=b.counter
WHERE a.counter='$id[$i]'
");
while ($row = $result1->fetch_assoc())
{ ?>
<div class="thumbnail">
<div style="display:none;">
<div class="control-label"></div>
<div class="controls">
<input name="counter[]" class="textbox" type="text" value="<?php echo $row['counter'] ?>" readonly="readonly"/>
</div>
</div>
<div class="control-label" style='float:left;width:25%;margin-left:10%;text-align:left;margin-bottom:3px;'>Item</div>
<div class="controls" style='float:left;width:65%;margin-bottom:3px;'>
<input name="firstname[]" class="textbox" type="text" value="<?php echo $row['item_name'] ?>" readonly="readonly"/>
</div>
<div class="control-label" style='float:left;width:25%;margin-left:10%;text-align:left;margin-bottom:3px;'>Description</div>
<div class="controls" style='float:left;width:65%;margin-bottom:3px;'>
<input name="lastname[]" class="textbox" type="text" value="<?php echo $row['item_description'] ?>" readonly="readonly"/>
</div>
<div class="control-label" style='float:left;width:25%;margin-left:10%;text-align:left;margin-bottom:3px;'>PR Quantity</div>
<div class="controls" style='float:left;width:65%;margin-bottom:3px;'>
<input name="pr_qty[]" id="pr_qty[]" class="textbox" type="text" value="<?php echo $row['total_quantity']; ?>" />
<input id="pr_total" class="textbox" type="text" value="<?php $result2 = $mysqli->query("SELECT *, SUM(quantity) total_quantity FROM purchase_order WHERE counter='$id[$i]'");
while($rows = $result2->fetch_assoc()){ echo $rows['total_quantity']; }
?>">
</div>
<div class="control-label" style='float:left;width:25%;margin-left:10%;text-align:left;margin-bottom:3px;'>PR #</div>
<div class="controls">
<input name="pr[]" class="textbox" type="text" value="<?php echo $row['pr'] ?>" />
</div>
</div>
<br>
<?php
}
}
?>
<input name="submit" type="submit" id="sbtBtn" value="Update">
</form>
</div>
You can not give same id to multiple elements, you have to give unique id to your textboxes. In your function you getting textboxes byh Id, change it to class and also give separate classes to your textbox1 and 2. Otherwise your script will work on only first record.
js change
var textBox1=document.getElementsByClassName('tb1');
var textBox2=document.getElementsByClassName('tb2');
for(var i=0; i< textBox1.length; i++){
if((textBox2[i].value) > textBox1[i].value){
alert('value is greater than quantity');
return false;
}else{
}
}
and html change
<input name="pr_qty[]" id="pr_qty[]" class="textbox tb1" type="text" value="<?php echo $row['total_quantity']; ?>" />
<input id="pr_total" class="textbox tb2" type="text" value="<?php $result2 = $mysqli->query("SELECT *, SUM(quantity) total_quantity FROM purchase_order WHERE counter='$id[$i]'");
while($rows = $result2->fetch_assoc()){ echo $rows['total_quantity']; }
?>">
In your onclick event you can read input fields value like:
EDIT:
var val1 = $("input[name='UR_ELE1_NAME']").val();
var val2 = $("input[name='UR_ELE2_NAME']").val();
And you can compare like: if(val1 > val2){ .....}
I hope this helps.