Get button value printed by php and process them via javascript - javascript

I have dynamic table where results from database are printed.
<table id="table" class="table datatable-responsive">
<thead>
<tr class="bg-teal">
<th>#</th>
<th>Datum & Vrijeme</th>
<th>Stavka</th>
<th><center>Izabrana količina</center></th>
<th><center><i class="icon-pencil"></i></center></th>
<th><center><i class="icon-bin"></i></center></th>
</tr>
</thead>
<tbody>
<?php
$i = 1;
while ($r=$q->fetch()) {
$a = 0;
$a += 1;
$id = $r['Id'];
$datum = $r['Datum'];
$time = date("H:i:s",strtotime($datum));
$time2 = date("d/m/Y",strtotime($datum));
$stavka = $r['Stavka'];
$kolicina = $r['Kolicina'];
?>
<tr>
<td><?php echo $i; $i++; ?></td>
<td><?php echo $time2 .' & '.$time; ?></td>
<td><?php echo $stavka; ?></td>
<td class="nr"><center><?php echo $kolicina; ?></center></td>
<td><center><button type="button" value="<?php echo $id?>" name="izmjena" onClick="showDiv()"><i class="icon-pencil text-danger"></i></center></button>
</td>
<td><center><button type="submit" value="<?php echo $id ;?>" name="brisi" class="icon-bin text-danger"></button></center></td>
</tr>
<?php } ?>
</tbody>
<!--<a onClick="window.open('edit/korpa.php?id= <?=$r['Id']?>','E-cart','width=800,height=500,left=0,top=100,screenX=0,screenY=100,menubar=yes,scrollbars=yes')"> -->
</table>
In the table I have button for editing "Kolicina". Once I click on button in a row, It needs to open div.
In that div, I need to pass values and print them by using js. Once I do that, I need to save it in db by php
Once I click on button div below shows (it works).
<div class="col-lg-9" id="IzmjenaDiv" style="display:none;" >
<div class="panel panel-flat">
<table class="table table-bordered">
<tr>
<th class="">Količina</th>
<td class=""><input type="text" id="id" value="" class="form-control text-info border-info"></td>
<td class=""><input type="text" id="kolicina" name="kolicina" placeholder="Upišite novu količinu" class="form-control text-danger border-danger"></td>
<td class="">
<select class="form-control" id="mjera" name="mjera">
<option value="KG">KG </option>
<option value="KOM">KOM </option>
</select>
</td>
</tr>
</table><hr/>
<div class="pull-right">
<button type="button" class="btn btn-success btn-sm" onclick="savechanges()"> Snimi <i class="icon-play3 position-right"></i></button>
</div>
<br/><br/><br/>
</div>
</div>
I need to make script which willl get two values from row, one from button one from row "Kolicina". Then I need to print those values in div that shows on click.
I made script but it automatically closes div I want to open.
<script>
function showDiv() {
document.getElementById('IzmjenaDiv').style.display = "block";
var y = $(object).parent("center").parent("td").parent("tr").find(".nr center").text();
var x = $(object).attr("value");
window.location.href = "korpa.php?w1=" + x + "&w2=" + y;
}
</script>
Any advice is appreciated

Pass the reference of the TD tag as an argument in the showDiv() function. Change the HTML:
<td><center><button type="button" value="<?php echo $id?>" name="izmjena" onClick="showDiv(this)"><i class="icon-pencil text-danger"></i></center></button>
</td>
Javascript:
function showDiv(obj) {
document.getElementById('IzmjenaDiv').style.display = "block";
var id = $(obj).parent("center").parenrt("td").parent("tr").find(".nr center").text();
}

Related

how to insert values from toggle button to database without submit button

I am trying to update values in the database using toggle button
Here is my script
$(document).ready(function () {
$('input.status').on('change', function () {
var decision = $(this).val();
var id = $('td.myvalue').html();
alert(decision);
alert(id);
$.ajax({
type: "POST",
url: "/CodeIgniter/users/Users/update",
data: {decision: decision, id: id},
success: function (msg) {
$('#autosavenotify').text(msg);
}
})
});
});
DataTable
<table class="table table-striped table-hover DataTables "id="DataTables" cellspacing="0" width="100%">
<thead>
<tr>
<th>Icon</th>
<th>Name</th>
<th>Group Users</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php $i = 0;
foreach ($getTableGroup as $value) { ?>
<tr>
<td class="myvalue">
<?= $value->id ?>
</td>
<td>
<?= $value->group_name ?>
</td>
<td>
<input class="tagsinput form-control" type="text" value="sam"/>
</td>
<input class="myid" type="hidden" value="<?= $value->id ?>"/>
<td >
<?php if ($value->group_status == 'on'): ?>
<div class="switch">
<div class="onoffswitch">
<input type="checkbox" checked class="onoffswitch-checkbox status" id="example<?= $i ?>" name="group-status" >
<label class="onoffswitch-label" for="example<?= $i ?>">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
<?php elseif ($value->group_status == 'off'): ?>
<div class="switch">
<div class="onoffswitch">
<input type="checkbox" checked class="onoffswitch-checkbox status" id="example<?= $i ?>" name="group-status">
<label class="onoffswitch-label" for="example<?= $i ?>">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
<?php endif; ?>
</td>
</tr>
<?php
$i++;
}
?>
</tbody>
</table>
My code is working fine but the issue is in scripting section where when I click on toggle button the id does not increase every time id came in the alert box is 1 but in datatable it show the Id number from database
Your always fetching first td value $('td.myvalue') It's wrong you need to fetch the currently changed tr td value like this
var id = $('td.myvalue').html(); //it will always return the first td only .
Change to
var id = $(this).parent('div').parent('div').parent('td').parent('tr').find('td.myvalue').html();
You can use following code to reduce more parent.
var id = $(this).closest('tr').find('td.myvalue').text();

Condition when pressing radio button

How do i make my page do this in particular.
I have 2 choices LBC and PickUp,
If the user selects LBC, it would proceed to the next page to select payment options.
but if the user selects the PickUp radio option, it would be redirected immediately to the last page, since the payment option is no longer applicable.
I have this javascript function that enables a button, but other than that, i have no idea how do do it.
Redirecting the page depending on what radio button is pressed. If LBC no problem, if Pickup proceed to next page after payment page, so it would skip the payment page.
Please help thank you.
<form method="post" action="payment.php">
<?php
echo "<table><tr>";
$i = 0;
$qry="SELECT * FROM shipping";
$result= #mysql_query($qry);
while ($row=mysql_fetch_assoc($result)){
if ($i > 0 && $i % 3 == 0) {
echo "</tr><tr>";
}
echo "<td>";
?>
<table width="" cellpadding="3" cellspacing="0" border="0">
<tr class="row_submit">
<td height="250px" width="300px"><center><label>
<input type="radio" name="carrier" <?php if (isset($carrier) && $carrier=="$row[ship_name]") echo "checked";?> value="<?php echo $row['ship_name']; ?>">
<!--<img src="../paymentoptions/lbc.png" alt="LBC" class="picture" width="245px" style="margin:10px"/></label></td> -->
<?php echo '<img src="data:image/jpeg;base64,'.base64_encode( $row['ship_pic'] ).'" height="215px" width="245px" style="margin:10px"/>'; ?>
</tr>
<tr class="row_submit">
<td height="130px" width="300px"><p><?php echo $row['ship_desc']; ?><p></td>
<tr>
<td>
<div id='price'> Additional ₱ <?php echo $row['ship_price']; ?></div></td></tr>
</table>
<?php
echo "</td>";
$i++;
}
echo "</tr></table>";
?>
<br>
<table>
<tr>
<td><input type="button" value="View Shopping Cart" onclick="window.location='shoppingcart.php'"></td>
<td><input type="submit" disabled="disabled" name="next" value="Proceed to Payment" /></td>
</tr>
</table>
</form>
if($_POST['radio_button_name']['LBC']){
header('location:lbc_paymentpage.php');
}else{
header('location:pickuppage.php');
}

How to get the id of the last element?

I have the list of products ,using below code
<table id="product">
<thead>
<tr>
<th style="width:30%;">Item Name</th>
<th style="width:11%;">Price</th>
<th style="width:11%;">Qty</th>
</tr>
</thead>
<tbody id="cart_contents">
<?php $i=1;
foreach($cart as $line=>$item)
{
?>
<tr>
<td style="align:center;"><?php echo $item['name']; ?></td>
<td><input type="text" id="price_<?php echo $i;?>" value="<?php echo $item['price']; ?>" name="price"></td>
<td id="qnty"><input type="text" id="quantity_<?php echo $i;?>" value="<?php echo $item['quantity']; ?>" name="quantity"></td>
</tr>
<?php
$i++;
}
?>
</tbody>
</table>
I need to edit quantity and price fields of last added product.
<table width="297px" style="float:left" class="CSSTableGenerator">
<tr>
<td onclick="click_quantity();">Qty</td>
<td onclick="click_price();"> <a href="javascript:void(0);" >Price</a></td>
</tr>
</table>
function click_quantity(){
$("#table register").find("td qnty").each(function(){
var id = $(this).attr("id");
alert(id);
})
}
How to get the last quantity field's id, after clicking the Qty link?
I have tried some codes, but I am unable to get last element's id.
EX : id names are quantity_1, quantity_2, quantity_3, quantity_4.
How to get quantity_4 (last elment's id)?
HTML
<table id="product">
<thead>
<tr>
<th style="width:30%;">Item Name</th>
<th style="width:11%;">Price</th>
<th style="width:11%;">Qty</th>
</tr>
</thead>
<tbody id="cart_contents">
<?php $i=1;
foreach($cart as $line=>$item)
{
?>
<tr>
<td style="align:center;"><?php echo $item['name']; ?></td>
<td>
<input type="text" id="price_<?php echo $i;?>" value="<?php echo $item['price']; ?>" name="price"/>
</td>
<td class="qnty">
<input class="qnty_input" type="text" id="quantity_<?php echo $i;?>" value="<?php echo $item['quantity']; ?>" name="quantity"/>
</td>
</tr>
<?php
$i++;
} ?>
</tbody>
</table>
JS Code
function click_quantity(){
var id = $("#cart_contents tr:last-child .qnty_input").attr("id");
// rest of your logic
}
1) you are using same ID in loop, that is not valid;
2) I think your js is wrong, use : $("#register").find("#qnty"), but has to be find('.qnty')
Try this one.
var last_id = $( 'table tbody tr td:last-child').attr( 'id' );
To get the last row(td) in table you can use this,
$('table tbody tr td:last-child')
In order to get last child element you can make use of Try to use last property of jquery
$("#cart_contents td:last").find('input[type=text]').attr('id');
$("#cart_contents td:last")
using this you'll find last column in each row so you have to use
$("#cart_contents tr:last-child td.qnty")

How to pass DATA to PopUp Div in PHP?

I want to the pass ID value to POPUP DIV and update into table with status , suggest_text area with ID.
if I pass like this href="#pop1?id=<?php echo $row['id']; ?> The POPUP div is Not opening. so I dont know how to pass,so some one tell me that how can I pass in PHP or else in Javascript
Thanks in advance
<div class="widget-content">
<table class="table table-bordered table-striped data-table">
<thead>
<tr>
<th>S.No</th>
<th>Employee Name</th>
<th>Reason</th>
<th>Category</th>
<th>From</th>
<th>To</th>
<th>No Of Days</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php
$result=mysql_query("select * from leave_request");
while($row=mysql_fetch_array($result))
{?>
<tr>
<td><?php echo $row['id'];?></td>
<td> <?php echo $row['emp_name'];?></td>
<td> <?php echo $row['reason'];?></td>
<td> <?php echo $row['category'];?></td>
<td><?php echo $row['from_date'];?></td>
<td><?php echo $row['to_date'];?></td>
<td><?php echo $row['no_of_days'];?></td>
<td>
Accept |
Reject |
Suggest </td>
<div id="pop1" class="pop-up">
<?php $suggest_id = $_GET['id']; ?>
<div class="popBox">
<div class="popScroll">
<form>
<textarea name="suggest" id="suggest" cols="60" rows="8" ></textarea>
<input type="text" name="id" value="<?php echo $suggest_id; ?>">
<input type="text" name="status" value="3">
<button type="submit" name="submit" class="btn btn-primary">Submit</button>
</form>
<!-- popup content end here -->
</div>
<span>Back to links</span>
</div>
Back to links
</div>
</tr>
<?php }?>
</tbody>
</table>
</div>
As I see your popup div is in WHILE loop so you can get your id like this :-
Initialize a value say K = 1; and put this value to every popup
Suggest
Full Code :-
<?php
$result=mysql_query("select * from leave_request");
while($row=mysql_fetch_array($result))
{
$k =1;
?>
<tr>
<td><?php echo $row['id'];?></td>
<td> <?php echo $row['emp_name'];?></td>
<td> <?php echo $row['reason'];?></td>
<td> <?php echo $row['category'];?></td>
<td><?php echo $row['from_date'];?></td>
<td><?php echo $row['to_date'];?></td>
<td><?php echo $row['no_of_days'];?></td>
<td>
Accept |
Reject |
Suggest </td>
<div id="pop<?php echo $k; ?>" class="pop-up">
<div class="popBox">
<div class="popScroll">
<form>
<textarea name="suggest" id="suggest" cols="60" rows="8" ></textarea>
<input type="text" name="id" value="<?php echo $row['id']">
<input type="text" name="status" value="3">
<button type="submit" name="submit" class="btn btn-primary">Submit</button>
</form>
<!-- popup content end here -->
</div>
<span>Back to links</span>
</div>
Back to links
</div>
</tr>
<?php
$k++;
}?>

EDIT: add an identifier to a dynamically generated row

I'm pulling down two tables from the db. There's a Javascript function that adds a row from Table2 into the Table1. What i've been trying to do is get the data from Table1 on the confirm_trade.php page so I can put it into the db but can't figure out how to pull that row(item_id). I thought putting the table in a form would allow me to access them through the $_POST but that's not working. How to add an identifier to the jquery row so I can grab on the confirm page?
The appended rows coming from the jQuery function are the rows I need the item_id from.
function addto(obj)
{
var $row = $(obj).parents("tr");
var $table = $("#tradee");
var item_id = $row.find(".item-id").text();
var item_name = $row.find(".item-name").text();
var item_desc = $row.find(".item-desc").text();
var newTR = $("<tr><td>"+item_id+"</td><td>"+item_name+
"</td><td>"+item_desc+"</td></tr>");
$table.append(newTR);
}
Table2:
<div id='fixedDiv'>
<form action="confirm.php" method="post">
<table align="center" id="Table2">
<tr><td>Other Item</td></tr>
<?php while($rowi =$item->fetch_assoc())
{?>
<tr>
<td>
<?php echo $rowi['item_id']; ?>
</td>
<td>
<?php echo $rowi['item_name']; ?>
</td>
<td><?php echo $rowi['item_description'];?></td>
</tr>
<?php } ?>
<tr>
<td><input type="submit" name="submit" value="Continue"/></td>
</tr>
</table>
</form>
</div>
<br>
Table 1:
<table align="center" id="Table1">
<tr><th>item_id</th>
<th>Cat_id</th>
<th>Name</th>
<th>Description</th>
</tr>
<?php while($row =$item_results->fetch_assoc())
{?>
<tr></tr>
<tr>
<td class="item-id"> <?php echo $row['item_id']; ?> </td>
<td><?php echo $cat_id = $row['cat_id']; ?> </td>
<td class="item-name"><?php echo $item_id = $row['item_name'];?></td>
<td class="item-desc"><?php echo $item_descrip = $row['item_description'];?>
</td>
<td><input type="button" class="added" onclick="addto(this)"
value="Add" />
<td><input type="button" class="removed" onclick="remove()"
value="Remove" >
</td>
</tr>
<?php } ?>
</table>
Judging by your code, you can use <input type="hidden" name="some_hidden_data" value="field-value">. be sure that you also wrap your table with <form method="post"></form>
the hidden field will be then included as $_POST['hidden_field_name'];

Categories

Resources