I'm trying to fetch the result based on the user's selection in the select element. All it shows are just the product_price1 when I try to select the other price range, the product price will not be able to change according to my selection. It will only show the first price of the product. I did place the id of each element in the correct way but it still not be able to work properly.
But i do not know where is the mistake i made, it just can't seems to fetch the correct result. Here are my codes:
<table class="table">
<thead class="text-primary">
<th style=" position: sticky;top: 0; background: white";>
Product
</th>
<th style=" position: sticky;top: 0; background: white";>
Name
</th>
<th style=" position: sticky;top: 0; background: white";>
Avaliable Stock
</th>
<th style=" position: sticky;top: 0; background: white";>
Item Price(RM)
</th>
<th style=" position: sticky;top: 0; background: white";>
Insert Product Quantity
</th>
</thead>
<tbody id="products">
<?php
$product_id = $_REQUEST['id'];
$ids = explode(",",$product_id);
$ids = array_splice($ids, 0);
foreach($ids as $product_id){
$sql = "SELECT *, products.id as product_id FROM products
LEFT JOIN sellers ON products.seller_id = sellers.id
WHERE products.id = '".$product_id."'
ORDER BY product_created DESC ";
$query = $conn->query($sql);
{
while ($row = $query->fetch_assoc()) {
$max = $row['product_stock'];
?>
<tr>
<td>
<?php echo $row['product_title']; ?>
</td>
<td>
<?php echo $row['product_stock']; ?> <?php echo $row['product_unit']; ?>
</td>
<td>
<div class="col-md-6">
<input type="number" name="cart_qty" step=".01" class="form-control text-center" required>
</div>
</td>
<td>
<select name="price_range" id="price_range" class="form-control">
<option value="price_range1" selected><?php echo $row['weight_range1']; ?> <?php echo $row['product_unit']; ?></option>
<option value="price_range2"> <?php echo $row['weight_range2']; ?><?php echo $row['product_unit']; ?></option>
<option value="price_range3"><?php echo $row['weight_range3']; ?><?php echo $row['product_unit']; ?></option>
<option value="price_range4"><?php echo $row['weight_range4']; ?> <?php echo $row['product_unit']; ?></option>
</select>
</td>
<td>
<div class="col-12 my-auto">RM
<span id="product_price">
<input type="hidden" name="cart_price" value="<?php echo $row['product_price1']; ?>">
<?php echo $row['product_price1']; ?>
</span>/<?php echo $row['product_unit']; ?>
</td>
</tr>
</div>
</div>
<?php
}
}
}
?>
</tbody>
</table>
I use AJAX method to POST the selection result, here are the codes
<script>
$(document).ready(function() {
$('#price_range').on('change', function() {
var product_id = <?php echo $product_id ?>;
var price_range = this.value;
$.ajax({
url: "includes/fetch-price.php",
type: "POST",
data: {
product_id: product_id,
price_range: price_range
},
cache: false,
success: function(result){
$("#product_price").html(result);
// console.log(price_range);
}
});
});
});
</script>
Here is my fetch-price.php
<?php
require_once "../session.php";
$product_id = $_POST["product_id"];
$price_range = $_POST["price_range"];
$sql = mysqli_query($conn,"SELECT * FROM products where id = '$product_id' ");
$scrow = mysqli_fetch_array($sql);
if($price_range == 'price_range1')
{
echo '<input type="hidden" name="cart_price" value="'.$scrow['product_price1'].'">', $scrow['product_price1'];
}
else if($price_range == 'price_range2')
{
echo '<input type="hidden" name="cart_price" value="'.$scrow['product_price2'].'">', $scrow['product_price2'];
}
else if($price_range == 'price_range3')
{
echo '<input type="hidden" name="cart_price" value="'.$scrow['product_price3'].'">', $scrow['product_price3'];
}
else if($price_range == 'price_range4')
{
echo '<input type="hidden" name="cart_price" value="'.$scrow['product_price4'].'">',$scrow['product_price4'];
}
?>
While observing your code I can see that you have set
<select name="price_range" id="price_range" class="form-control">
inside the while and the real problem here is you have set
id="price_range"
and moving to you JS, in that you have set on change event on price_range
$('#price_range').on('change', function() {
and that selector while trace the id type (#), so as per JS rule in a page there should be unique selector otherwise the DOM events will act funny.
So now solution to your problem.
try to set
class="price_range"
instead of
id="price_range"
and than in your JS set
$('.price_range').on('change', function() {
instead of
$('#price_range').on('change', function() {
I'm sure you will get the desired output :)
Related
Is there any way to filter my dynamic table using two dropdown? As for now, I only able to filter using only one dropdown. I cannot seem to find the right way so I'm gonna post my original code that successfully filter using one dropdown (because there are too many error in the latest code using two filter). Hope you can give me suggestions on how to solve this.
view.php
<?php
require "../model/model.php";
$month=$_GET['month'];
$sys = getSys(1)->fetch_assoc();
?>
<body>
<div class="row">
<table border="0">
<tr><td>
<select required class="form-control" name="month" id="month">
<option value="">-- Choose Month--</option>
<? echo getDropDownMonth($month) ;?>
</select>
</td></tr>
</table>
<table width="100%" class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th width="5%">No.</th>
<th width="20%">Date</th>
<th width="20%">Stock Code</th>
<th width="20%">Price(RM)/KG</th>
<th width="20%">QUANTITY(KG)</th>
<th width="20%">TOTAL(RM)</th>
</tr>
</thead>
<?
$i=1;
$raw = getRawMaterialListCode($month);
while($list_raw_material = $raw->fetch_assoc()) {
?>
<tr class="odd gradeX">
<td><?php echo $i; ?></td>
<td><?php echo $list_raw_material['date_received']; ?></td>
<td><?php echo $list_raw_material['stock_code'].' - '.$list_raw_material['stock_name']; ?></td>
<td><?php echo $list_raw_material['raw_price']; ?></td>
<td><?php echo $list_raw_material['in_per_kg']; ?></td>
<td><?php echo $list_raw_material['total_price']; ?></td>
</tr>
<?php $i++; } ?>
</table>
<script>
$(document).ready(function() {
$('#dataTables-example').DataTable({
responsive: true
});
$("#month").change(function(){
var selected_month=$(this).val();
sendType(selected_month);
});
});
function sendType(type)
{
window.location.href="view.php?month="+type;
}
</script>
</body>
model.php
function getRawMaterialListCode($month) {
$conn=db();
$sql = "
SELECT a.*
, c.stock_code
, c.stock_name
FROM avsb_raw_material a
LEFT
JOIN avsb_stock c
ON a.stock_code = c.stock_code
WHERE MONTH(a.date_received) = '$month'
ORDER
BY a.date_received
";
$result = $conn->query($sql);
return $result;
}
Supposedly I'm trying to add second dropdown as filter here:
<div class="row">
<table border="0">
<tr><td>
<select required class="form-control" name="month" id="month">
<option value="">-- Choose Month--</option>
<? echo getDropDownMonth($month) ;?>
</select>
**<select required class="form-control" name="stock_code" id="stock_code">
<option value="">-- Choose Stock--</option>
<? echo getDropDownStock($stock_code) ;?>
</select>**
</td></tr>
</table>
and the new model.php
function getRawMaterialListCode($month,$stock_code) {
$conn=db();
$sql = "
SELECT a.*
, c.stock_code
, c.stock_name
FROM avsb_raw_material a
LEFT
JOIN avsb_stock c
ON a.stock_code = c.stock_code
WHERE MONTH(a.date_received) = '$month'
AND a.stock_code = '$stock_code'
ORDER
BY a.date_received
";
$result = $conn->query($sql);
return $result;
}
Thanks in advance.
EDIT: These code are the closest one I try that did not have any error but the data still not display when filtering using two dropdown.
The url that i get :
http://localhost/stockcontrolsystem/view/view.php?month=10&stock_code=[object%20HTMLSelectElement]
view:
<?
$i=1;
$raw = getRawMaterialListCode($stock_code,$month);
while($list_raw_material = $raw->fetch_assoc()) {
?>
function:
$(document).ready(function() {
$("#month").change(function(){
var selected_month=$(this).val();
reloadMonth(selected_month);
});
$("#stock_code").change(function(){
if($("#month").val()==''){
alert('SELECT MONTH!');
$("#stock_code").val('');
}else{
var selected_stock=$(this).val();
var month = $("#month").val();
reloadStock(selected_stock,month);}
});
});
function reloadMonth(month){
//console.log(month);
location.href = "view.php?month="+month;
}
function reloadStock(selected_stock,month){
//console.log(obj);
location.href = "view.php?month="+month+"&stock_code="+stock_code;
}
ANSWERED! I try inserting what i found here and there and I finally SOLVED it.
$(document).ready(function() {
$("#month").change(function(){
var selected_month=$(this).val();
reloadMonth(selected_month);
});
$("#stock_code").change(function(){
if($("#month").val()==''){
alert('SELECT MONTH!');
$("#stock_code").val('');
}else{
var selected_stock=$(this).val();
var month = $("#month").val();
reloadStock(selected_stock,month);}
});
});
function reloadMonth(month){
//console.log(month);
location.href = "view.php?month="+month;
}
function reloadStock(selected_stock,month){
//console.log(obj);
location.href = "view.php?month="+month+"&stock_code="+selected_stock;
}
I just started to learn how to program and I have been having issues with ajax when it comes to adding items to my cart. Everything is fine when it comes to adding items, its the ajax that is not working and my page constantly keeps refreshing. For the code since there is a lot of it I will put the things I think are the most important.
Index.php
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
<title></title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(document).on('click', '.add_to_cart', function(){
var product_id = $(this).attr("id");
var product_name = $('#name'+product_id+'').val();
var product_price = $('#price'+product_id+'').val();
var product_quantity = $('#quantity'+product_id).val();
if(product_quantity > 0)
{
$.ajax({
url:"index.php",
method:"POST",
data:{product_id:product_id, product_name:product_name, product_price:product_price, product_quantity:product_quantity},
success:function(data)
{
alert("Item has been Added into Cart");
}
});
}
else
{
alert("lease Enter Number of Quantity");
}
});
});
</script>
</head>
<body>
<header>
<?php
include_once'widget/header.php';
if (isset($_SESSION['u_id'])) {
include_once"include/addcart.php";
include_once "widget/shoppingcart.php";
}
?>
</header>
<main>
<div class="item-container">
<?php
$item = mysqli_query($db,"SELECT * FROM itemlist ORDER BY title");
include_once 'widget/container.php';
?>
</div>
</main>
Addcart.php
<?php
$row_ids = array();
//session_destroy();
//check if Add to Cart button has been submitted
if(filter_input(INPUT_POST, 'add_to_cart')){
if(isset($_SESSION['shopping_cart'])){
//keep track of how mnay products are in the shopping cart
$count = count($_SESSION['shopping_cart']);
//create sequantial array for matching array keys to products id's
$row_ids = array_column($_SESSION['shopping_cart'], 'id');
if (!in_array(filter_input(INPUT_POST, 'id'), $row_ids)){
$_SESSION['shopping_cart'][$count] = array
(
'id' => filter_input(INPUT_POST, 'id'),
'name' => filter_input(INPUT_POST, 'name'),
'price' => filter_input(INPUT_POST, 'price'),
'quantity' => filter_input(INPUT_POST, 'quantity')
);
// header("Location:index.php?addedtocart");
}
else { //product already exists, increase quantity
//match array key to id of the product being added to the cart
for ($i = 0; $i < count($row_ids); $i++){
if ($row_ids[$i] == filter_input(INPUT_POST, 'id')){
//add item quantity to the existing product in the array
$_SESSION['shopping_cart'][$i]['quantity'] += filter_input(INPUT_POST, 'quantity');
// header("Location:index.php?multtocart");
}
}
}
}
else { //if shopping cart doesn't exist, create first product with array key 0
//create array using submitted form data, start from key 0 and fill it with values
$_SESSION['shopping_cart'][0] = array
(
'id' => filter_input(INPUT_POST, 'id'),
'name' => filter_input(INPUT_POST, 'name'),
'price' => filter_input(INPUT_POST, 'price'),
'quantity' => filter_input(INPUT_POST, 'quantity')
);
}
}
if (filter_input(INPUT_POST, 'delete')) {
//loop thru intil products in shop cart == variable
foreach ($_SESSION['shopping_cart'] as $key => $row) {
if ($row['id'] == filter_input(INPUT_POST, 'id')) {
unset($_SESSION['shopping_cart'][$key]);
}
}
$_SESSION['shopping_cart'] =array_values($_SESSION['shopping_cart']);
}
?>
Shoppingcart.php
<div class="cart-container" align="right">
<div class="table-responsive">
<table class="table">
<table class="table">
<tr><th colspan="5"><h5>Order Details</h5></th></tr>
<tr>
<th width="40%">Product Name</th>
<th width="10%">Quantity</th>
<th width="20%">Price</th>
<th width="15%">Total</th>
<th width="5%">Action</th>
</tr>
<?php
if(!empty($_SESSION['shopping_cart'])):
$total = 0;
foreach($_SESSION['shopping_cart'] as $key => $product):
?>
<tr>
<td><?php echo $product['name']; ?></td>
<td><?php echo $product['quantity']; ?></td>
<td>$ <?php echo $product['price']; ?></td>
<td>$ <?php echo number_format($product['quantity'] * $product['price'], 2); ?></td>
<td>
<form method="post">
<input class="delete" type="submit" name="delete" value="Delete">
<input type="hidden" name="id" value="<?php echo $product['id']; ?>">
</form>
</td>
</tr>
<?php
$total = $total + ($product['quantity'] * $product['price']);
endforeach;
?>
<tr>
<td colspan="3" align="right">Total</td>
<td align="right">$ <?php echo number_format($total, 2); ?></td>
<td></td>
</tr>
<tr>
<!-- Show checkout button only if the shopping cart is not empty -->
<td colspan="5">
<?php
if (isset($_SESSION['shopping_cart'])):
if (count($_SESSION['shopping_cart']) > 0):
?>
Checkout
<?php endif; endif; ?>
</td>
</tr>
<?php
endif;
?>
</table>
</div>
</div>
Container.php
<?php
while ($row = mysqli_fetch_assoc($item)) {
?>
<div class='item-box'>
<img class='item_img' src="itemimg/<?php echo $row['img']; ?>"><figcaption><?php echo $row['title']; ?></ficgcaption>
<form method="post" class="add-form">
<div class='input-group xs-2'>
<input class="form-control" type="text" id="quantity<?php echo $row['id'] ?>" name="quantity" value="1">
<input class="btn btn-outline-primary btn-sm add-btns add_to_cart" type="submit" id="<?php echo $row['id'] ?>" name="add_to_cart" value="Add To Cart">
</div>
<input type="hidden" id="name<?php echo $row['id'] ?>" name="name" value="<?php echo $row['title'] ?>">
<input type="hidden" id="price<?php echo $row['id'] ?>" name="price" value="<?php echo $row['price']; ?>">
<input type="hidden" name="id" value="<?php echo $row['id']; ?>">
</div>
</form>
<?php
}
?>
Your page will refresh because you are not telling your form to not submit by the default method (which is to reload the page as a POST). To stop the page from reloading and let ajax do the submission, you need to inject the event and then use preventDefault():
$(document).on('click', '.add_to_cart', function(e){
// This will stop the form from submitting and allow the rest of the
// ajax to continue working. If you don't have this, you will immediately
// submit the form which negates the use of ajax
e.preventDefault();
I have assigned three select options with the same name which will be stored in the my database table. My code was working well at first right now i don't why it's working well. right now it only saves the value assigned to the last select option panel. Please i need help
<?php
if(isset($_POST['submit'])){
$vic_title = $_POST['vic_title'];
$vic_name = $_POST['vic_name'];
echo $vic_name;
if($vic_name=='')
echo "<font color='Green'><b>Please fill in the discription the accused name THANKS!!</b></font>";
else
$insert = "INSERT INTO discips(vic_title, vic_name)
values('$vic_title','$vic_name')";
$run = mysql_query($insert);
if ($run) {
echo "<font color='Green'><b>the incident was added</b></font>";
# code...
}
else{
echo "<font color='red'><b>the incident was not added</b></font>";
}
}
?>
Here is my form that i used.
<form name="harvets" id="form" action="?pg=<?php echo $_GET[pg]."&lodge_inc"."&hv=$token"; ?>" method="post" enctype="multipart/form-data">
<input type="hidden" name="id" value="<?php echo $edit_ca;?>">
<center style="padding-top: 2%; margin-top: 3%;"><h3>Enter Incident Informtion</h3></center>
<table width="100%" class="m_aligned">
<tr>
<td align="right" style="width: 100%;">Victim *</td>
<td align="left" style="width: 100%;">
<select style="width: 100%;" id="victim" name="vic_title" class="sect" placeholder="Select a Role">
<option></option>
<option value="staff">Staff</option>
<option value="student">Student</option>
<option value="visitor">Vistor</option>
</select>
</td>
</tr>
<tr id="staff_name" style="display: none;">
<td align="right" style="width: 100%;">Staff Name : </td>
<td align="left" style="width: 100%;">
<select style="width: 100%;" name="vic_name" class="sect" placeholder="Staff's Name">
<?php
$get_staf = "select * from useraccounts";
$run_staf = mysql_query($get_staf);
while ($row = mysql_fetch_array($run_staf)) {
$staf_id = $row['username'];
$staf_name = $row['name'];
echo "<option value='$staf_id'>". $staf_name ."</option>";
# code...
}
?>
</select>
</td>
</tr>
<tr id="vis_name" style="display: none;">
<td align="right" style="width: 100%;">Visitor Name : </td>
<td align="left" style="width: 100%;"><input type="text" name="vic_name" placeholder="Visitor's Name"></td>
</tr>
<tr id="stud_name" style="display: none;">
<td align="right" style="width: 100%;">Student Name: </td>
<td align="left" style="width: 100%;">
<select style="width: 100%;" class="sect" name="vic_name" placeholder="Student's Name" cols="9">
<option></option>
<?php
$get_stud= "SELECT * FROM studentdetails";
$run_stud = mysql_query($get_stud);
while ($row = mysql_fetch_array($run_stud)) {
$stud_id = $row['id'];
$stud_fname = $row['fname'];
$stud_lname = $row['lname'];
echo "<option value='$stud_id'>". $stud_fname ." ". $stud_lname ."</option>";
# code...
} ?>
</select>
</td>
</tr>
SAVE
Here is My JavaScript
<script type="text/javascript">
$("#victim").change(function (ev){
if($(this).val()=='visitor') $("#vis_name").css("display", "table-row")
else $("#vis_name").css("display", "none")
if($(this).val()=='student') $("#stud_name").css("display", "table-row")
else $("#stud_name").css("display", "none")
if($(this).val()=='staff') $("#staff_name").css("display", "table-row")
else $("#staff_name").css("display", "none")
});
</script>
<script type="text/javascript">
$(document).ready(function() {
$(".sect").select2({
allowClear: true
});
</script>
Getting the value of the last field (select or anything) using a given name is the correct behaviour. If you wish to send multiple values when submiting the form, you must give different names to their fields.
Ask yourself why you want to name them the same way. How are you supposed to get them ? If I create three different inputs, name the three of them 'title' and submit the form after type different things in each input, what do you guess I'll get if I access $_POST['title'] ? More problematic, what should I type to get the value of the first of my three inputs ? How the hell would I know, these are identical elements with different purposes !
If you design different elements, give them different features or they won't be different. They will just overwrite each other and you'll only have the last of the lot.
If you truly need to have them named the same, add hooks at the end of the name like this :
name="vic_name[].
It will append the value of that field to $_POST['vic_name'], which will now be an array, and therefore may contain multiple values. That's the only way.
I have solved the problem. I created two files by using AJAX to call another file to replace one a certain line of code. Sometimes we may want something and we fail in someway or another, but when we focus deeply we can solve the code.
i replaced my Javasrcipt file with
<script type="text/javascript">
$("#victim").change(function () {
var cat = $(this).val();
$.ajax({
type: "GET"
, url: "student/fetch_victim.php"
, data: "n=" + Math.random() + "&vr=" + cat
, beforeSend: function () {
$("#ctg").html("<img src='imgs/loader.gif' />...loading")
}
, success: function (response) {
$("#tryme").html(response)
}
});
});
</script>
and i moved the sections i wanted to another file
<?php
require "../ht.php"; $hom = new ht;
if($_GET['vr']){
$q = $_GET['vr'];
if($q =='staff'){
echo "
<td align='right' style='width: 100%;'>Staff Name : </td>
<td align='left' style='width: 100%;'>
<select name='vic_name' class='sect' style='width: 100%;' value='<?php echo $edit[2] ?>' placeholder='Staff's Name'>";
$staf = mysql_query("SELECT * FROM useraccounts"); $w=mysql_error();
while ($row = mysql_fetch_array($staf)) {
echo "<option value='$row[0]'>". $row[1] ."</option>";
# code...
}
echo "</select>
</td>
";
}elseif ($q == 'student') {
echo "
<td align='right' style='width: 100%;'>Student Name: </td>
<td align='left' style='width: 100%;'>
<select style='width: 100%;' class='sect' name='vic_name' value='".$edit[2] ."' placeholder='Student's Name' cols='9'>
<option></option>";
$stud= mysql_query("SELECT * FROM studentdetails");
while ($row = mysql_fetch_array($stud)) {
echo "<option value='$row[31]'>". $row[0] .' '. $row[1] ."</option>";
# code...
}
echo "</select>
</td>
";
}else{
echo "
<td align='right' style='width: 100%;'>Visitor Name : </td>
<td align='left' style='width: 100%;'><input style='width: 100%;' type='text' name='vic_name' value='".$edit[2] ."'placeholder='Visitor's Name'></td>
";
}
}
?>
<script type="text/javascript">(function($){
var code = $('.html-container').html();
$('.html-viewer').text(code);
})(jQuery);</script>
I have the following php table and js function I've been working on. The problem is, the index ($ind) works correctly in the php, but I cannot figure out the syntax in the js function. The output of var ind= $('id')[ind]; is undefined. When I substitute and set var ind= ; it gives me the last index value in the array for each item. What can I set var ind equal to to capture the $ind value of the php in javascript?
<table id="manage-items" cellpadding="0" cellspacing="0" border="0">
<thead>
<tr class="search">
<th> </th>
<th><?php echo $this->translate('Quantity');?></th>
<th><?php echo $this->translate('Status'); ?></th>
</tr>
</thead>
<?php $ind = 0; ?>
<?php foreach ($this->items as $item) {
$item_link = 'type=product';
?>
<div id="item_<?php echo $ind; ?>" style="display:none;">
<tr id="<?php echo $item['id']; ?>">
<td> </td>
<td class="Quantity">
<?php if ($item->item_quantity) { ?>
<span class="silvertext"><?php echo $item->item_quantity; ?></span>
<?php } else { ?>
<span class="silvertext">0</span>
<?php } ?>
</td>
<td class="Status">
<?php if (in_array($item['active'], array(0, 1))) { ?>
<div class="switch">
<label for="active[<?php echo $ind; ?>]"
class="switch-label switch-label-off">Active</label>
<input type="radio" class="switch-input"
id="active[<?php echo $ind; ?>]"
name="item[<?php echo $ind; ?>][status]"
value="1" <?php if ($item['active'] == 1) echo 'checked'; ?>>
<label for="inactive[<?php echo $ind; ?>]"
class="switch-label switch-label-on">Inactive</label>
<input type="radio" class="switch-input"
id="inactive[<?php echo $ind; ?>]"
name="item[<?php echo $ind; ?>][status]"
value="0" <?php if ($item['active'] == 0) echo 'checked'; ?>>
<span class="switch-selection"></span>
</div>
<?php } else { ?>
<?php echo $item['active']; ?>
<?php } ?>
</td>
</tr>
<?php $ind++; ?>
<?php } ?>
</tbody>
</table>
<script type="text/javascript">
$(document).ready(function () {
if (typeof ind == "undefined") {
ind = 0;
}
$('input[type="radio"]').live('change', function () {
var status = this.value;
var id = $(this).parents('tr').attr('id');
var quantity = $(this).closest("tr").find(".Quantity > span").text();
var ind= $('id')[ind];
// a bunch of other javascript
});
});
</script>
var id contains the ID of the tr you want to access.
if you iterate through id with .find, you can access the span that you want to change.
var target = $("#"+id).find('span')[5];
Apply changes then on target
$(target).css("...", "...");
I'm trying to send the values that are separated by an pipe to 2 different fields. For some reason it won't work.
Any ideas?
<script type="text/javascript">
function folder(selectVeld)
{
// Stuur informatie terug
var id = (selectVeld.options[selectVeld.selectedIndex].value).split('|');
// Id
document.getElementsByName('folder_id').value = id[0];
// Naam
document.getElementsByName('folder_naam').value = id[1];
}
</script>
<tr>
<td><?php echo $lang['folder']; ?>:</td>
<td><select name="folder" onChange="folder(this)">
<option value="geen"><?php echo $lang['no_folder']; ?></option>
<?php
$sql = "SELECT id, naam FROM 2_folder ORDER BY naam ASC";
$res = mysql_query($sql,$con);
while ($row = mysql_fetch_assoc($res)){
?>
<option <?php if($row['id'].'|'.$row['naam'] == $folder){ echo 'selected="selected"'; } ?> value="<?php echo $row['id'].'|'.$row['naam']; ?>"><?php echo $row['naam'] ?></option>
<?php } ?></select>
</td>
</tr>
<input type="text" name="folder_id" value="<?php echo $folder_id; ?>" size="5" style="background-color: #e7e7e9" readonly="readonly" />
<input type="text" name="folder_naam" value="<?php echo $folder_naam; ?>" size="5" style="background-color: #e7e7e9" readonly="readonly" />
document.getElementsByName returns a array of elements, even if there is only a single element with that name.
document.getElementsByName('folder_id')[0].value = id[0];
document.getElementsByName('folder_naam')[0].value = id[1];
should do the trick. jsfiddle sample
I have avoided this problem by using only the folder_id and find the name with an seperate query after sending the form.