change ajax form select box select otomatis - javascript

enter image description here
Please help me..
auto fill works for the first field
but I have problem in the second row and next row too. When I change the select option on second row, the previous field changed (not same row as what I have changed):
enter image description here
var Nomor = $('#TabelTambahBarang tbody tr').length + 1;
var Baris = "<tr>";
Baris += "<td class='txt-center'>"+Nomor+"</td>"var Baris = "<tr>";
Baris += "<td class='txt-center'>"+Nomor+"</td>";
Baris += "<td>";
Baris += "<select placeholder='Items Name' class='form-control input-sm select2' name='nama_barang[]' id='nama_barang" + Nomor + "' data-Nomor='" + Nomor + "'>";
Baris += "<option disabled value='' name='nama_barang[]' id='nama_barang" + Nomor + "' data-Nomor='" + Nomor + "' selected hidden>-- Silahkan Nama Barang --</option>";;enter code here
<?php
if (!empty($dataBarang)) {
foreach ($dataBarang as $k) { ?>
Baris += "<option value='<?php echo $k->nama_barang; ?>'><?php echo $k->nama_barang; ?></option>";
<?php }
}
?>
Baris += "</select>";
Baris += "</td>";
Baris += "<td class='txt-center'><input class='form-control input-sm' id='harga_barang' placeholder='Harga Barang' name='harga_barang'/></td>";
Baris += "<td align='center'><a id='HapusBaris'>Delete</a></td>";
Baris += "</tr>";
$('#TabelTambahBarang tbody').append(Baris);
Nomor++;
select2();
}
$(document).on("change", ".select2", function(e) {
var select = $(this);
var nama_barang = select.val();
$.ajax({
type : "POST",
url : "<?php echo base_url('get_barang')?>",
dataType : "json",
data : {nama_barang: nama_barang},
cache:false,
success: function(data){
$.each(data,function(harga_barang){
$('[id="harga_barang"]').val(data.harga_barang);
});
}
});
});
function select2(){
$('.select2').select2()
}
Controller
public function get_barang(){
$nama_barang = $this->input->post('nama_barang');
$data = $this->m_testing->get_barang($nama_barang);
echo json_encode($data);
}
Model
function get_barang($nama_barang){
$hsl = $this->db->query("SELECT * FROM tabel_barang WHERE nama_barang='$nama_barang'");
if($hsl->num_rows()>0){
foreach ($hsl->result() as $data) {
$hasil=array(
'nama_barang' => $data->nama_barang,
'harga_barang' => $data->harga_barang,
);
}
}
return $hasil;
}

Related

onchange function calling infinity times

Here i am creating table rows with two dropdowns
`
counter = 0;// Global Variable
function addNewRow(){
counter++;
$('#purchase_order').append('<tr id='+counter+'>' +
'<td>' +
'<select name="code'+counter+'" onchange="return getItemNamesByTypeID('+counter+')" class="form-control" id="code'+counter+'">' +
'<option value="0">--Item Code --</option>' +
'<?php
$query = "SELECT * FROM product_packing_relation WHERE sub_cat_id !=0000";
$result = mysqli_query($conn, $query);
while($row = mysqli_fetch_array($result))
{
echo '<option value="'. $row["id"] .'">' . "PT_".$row['product_type_id']."_".$row['id'] .'</option>';
}
?>' +
'</select>' +
'</td>' +
'<td>' +
'<select name="product'+counter+'" onchange="return getItemNamesByTypeID('+counter+')" class="form-control" id=product'+ counter +'>' +
'<option value="0">--Item Code --</option>' +
'<?php
$query = "SELECT * FROM vw_product_packing_relation";
$result = mysqli_query($conn, $query);
while($row = mysqli_fetch_array($result))
{
echo '<option value="'. $row["id"] .'">' . $row['product_name'].'_'.$row['item_size'].$row['item_unit'].'_'.$row['bundle_type'].'_'.$row['pack_size'] .'</option>';
}
?>' +
'</select>' +
'</td>' +
'<td><input class="form-control" type="test" name=uom'+ counter +' id=uom'+ counter +' /></td>' +
'</tr>');
$("#code"+counter).select2();
$("#product"+counter).select2();
}`
Now i try to do that if user change any dropdown the selected key change the other dropdown here is the code.
`function getItemNamesByTypeID(counter){
event.preventDefault();
var product_packing_id=0;
product_packing_id = $("#code" + counter + " option:selected").val();
if(product_packing_id == 0)
{
product_packing_id = $("#product" + counter + " option:selected").val();
}
alert(product_packing_id);
debugger;
$("#code"+counter).val(product_packing_id);
$("#code"+counter).change();
$("#product" + counter).val(product_packing_id);
$("#product" + counter).change();
return false;
}`
Now the problem is if i change any dropdown it starts calling onchange function infinite times.

javascript shopping cart math loop

I am attempting to create a loop to display the shopping cart total on my checkout page. I attempted to create some array variables in the loop to hold my values but console give me a "
unexpected [ " error.
* My "i" values attached to "p" & "q" are meant to reference IDs in my shopping cart table for the products displayed.
shopping cart table code:
<?php
$query = "select * from tbl_cart WHERE
member_id= '$member_id'";
$result = mysqli_query($conn,$query);
if (!$result) {
printf("Error: %s\n", mysqli_error($conn));
exit();
}
echo "<table id='anyclass'>";
echo "<tr>
<th style= border-right-style:none;
id='image1'></th>
<th style= text-align: center;
border-left-style:none;
id='product1'>Product</th>
<th id='price1'>Price</th>
<th id='quantity1'>Quantity</th>
<th id='remove1'>Remove</th>
</tr>";
$i=1;
while($row = $result->fetch_assoc()) {
echo "<tr class= 'trhide'>";
echo '<td style=border-right-
style:none;><img src="' . $row['image']
. '" /></td>';
echo "<td style=border-left-
style:none;
id='product'>".$row['product_id']."</td>";
echo "<td style= 'text-align: right;' id=
'p$i' >".$row['price']."
</td>";
echo "<td id= 'quantity' >". "
<input id= 'q$i' style='border:none'
type = 'text' class= 'change' value=
$row[quantity] name= $row[id] data-id=
$row[id]
>" . "</td>";
echo "<td id= 'delete'><span
class='delete' data-id= $row[id] ><img
src=delete.svg></span></td>";
echo "<td id= 'o$i' >".$row['oz']."
</td>";
echo "</tr>";
$i++;
}
echo "<tr>
<td>Total:</td>
<td id= 'total'></td>
</tr>";
echo "</table>";
?>
<script>
var total0=0;
var sum=0;
var i;
for (i = 1; i < 1000; i++) {
if(document.getElementById("p"+i)==null){
var p[i]= 0;
}
else{varp[i]=parseFloat
(document.getElementById
('p'+i).innerText)*100;}
if(document.getElementById('q'+i)==null){
var q[i]= 0;
}
else{var q[i]=
document.getElementById('q'+i).value;
}
var total[i]= parseInt(p[i]) *
parseInt(q[i]);
var sum= sum + total[i];
}
window.alert(sum);
</script>
I'm not sure if this is good code but it worked for me and solved my problem.
<script>
var total0=0;
var sum=0;
var i;
var q = new Array();
var p = new Array();
var total = new Array();
for (i = 1; i < 1000; i++) {
if(document.getElementById("p"+i)==null){
p[i]= 0;
}
else{p[i]=parseFloat(document.getElementById('p'+i)
.innerText)*100;
}
if(document.getElementById('q'+i)==null){
q[i]= 0;
}
else{q[i]= document.getElementById('q'+i).value;
}
total[i]= parseInt(p[i]) * parseInt(q[i]);
var sum= sum + total[i];
}
var result= sum/100;
document.getElementById('total').innerHTML = '$' +
result;

Why is my onclick function not called?

?php foreach($participants as $participant) {
echo "<tr>";
echo "<td>" . $participant['Vorname'] . "</td>";
echo "<td>" . $participant['Auto'] . "<img id=$participant[name_id] onclick='deleteDriver()' class='delete' src='img/tonne.gif' align='right' data-url='backend/queries.php?decision=deleteDriver&id=".$participant['name_id']."'/></td>";
echo "</tr>";
}
?>
function deleteDriver()
{
var dataString = "decision=deleteDriver";
$.ajax({
type: 'POST',
url: 'queries.php',
data: dataString
}
})
}
</script>
When I push the button the function is not called. Why?
try with this code.
<?php
foreach($participants as $participant) {
echo "<tr>";
echo "<td>" . $participant['Vorname'] . "</td>";
echo "<td><a onclick='deleteDriver()'>" . $participant['Auto'] . "<img id=$participant[name_id] class='delete' src='img/tonne.gif' align='right' data-url='backend/queries.php?decision=deleteDriver&id=".$participant['name_id']."'/></a></td>";
echo "</tr>";
}
?>
<script>
function deleteDriver()
{
var dataString = "decision=deleteDriver";
$.ajax({
type: 'POST',
url: 'queries.php',
data: dataString
})
}
</script>
You have missed <script> open tag before function deleteDriver(). Please add and retry. Try as below :
<?php
foreach($participants as $participant) {
echo "<tr>";
echo "<td>" . $participant['Vorname'] . "</td>";
echo "<td>" . $participant['Auto'] . "<img id='".$participant['name_id']."' onclick='deleteDriver()' class='delete' src='img/tonne.gif' align='right' data-url='backend/queries.php?decision=deleteDriver&id=".$participant['name_id']."'/></td>";
echo "</tr>";
}
?>
<script>
function deleteDriver()
{
var dataString = "decision=deleteDriver";
$.ajax({
type: 'POST',
url: 'queries.php',
data: dataString
}
});
}
</script>

Sum 1 to a value by clicking an image - PHP

I guys, I need yo help for this. I have this code, wich shows me the products I have in my shopping cart:
for($i=0;$i<count($_SESSION['productos']);$i++)
{
$id = $_SESSION['productos'][$i];
$prods = mysql_query('SELECT * from productos where idprod='.$id.'');
$row = mysql_fetch_array($prods);
echo "<tr>";
echo "<td>" . $row['nombre']; echo "</td>";
if($_GET[action]=="suma")
{
$_SESSION['unidades'][$i] = $_SESSION['unidades'][$i] + 1;
}
elseif($_GET[action]=="resta")
{
$_SESSION['unidades'][$i] = $_SESSION['unidades'][$i] - 1;
}
echo "<td><input name=".$i." type='text' value=" . $_SESSION['unidades'][$i]; echo " size='5'/></td>";
echo "<td><a href='carro_detalle.php?action=suma'><img src='images/flecharriba.png' width='10x' height='10px'/></a></td>";
echo "<td><a href='carro_detalle.php?action=resta'><img src='images/flechabajo.png' width='10px' height='10px'/></a></td>";
echo "<td>" . $row['precio']; echo "</td>";
echo "<td>" . $row['precio'] * $_SESSION['unidades'][$i]; echo "</td>";
echo "</tr>";
}
I need to sum 1 unity or rest 1 unity to $_SESSION['unidades'][$i] just to the selected product, when I click the two images respectively.
The thing is that when I click, it adds me 1 to all the products. Any easy way of doing this without using $_GET vars? I dont have high knowledge about JavasScript.
Thanks!!
You probably should remove your condition from the loop and put it outside of it:
if($_GET[action]=="suma")
{
$_SESSION['unidades'][$i] = $_SESSION['unidades'][$i] + 1;
}
elseif($_GET[action]=="resta")
{
$_SESSION['unidades'][$i] = $_SESSION['unidades'][$i] - 1;
}
for($i=0;$i<count($_SESSION['productos']);$i++)
{
$id = $_SESSION['productos'][$i];
$prods = mysql_query('SELECT * from productos where idprod='.$id.'');
$row = mysql_fetch_array($prods);
echo "<tr>";
echo "<td>" . $row['nombre']; echo "</td>";
echo "<td><input name=".$i." type='text' value=" . $_SESSION['unidades'][$i]; echo " size='5'/></td>";
echo "<td><a href='carro_detalle.php?action=suma'><img src='images/flecharriba.png' width='10x' height='10px'/></a></td>";
echo "<td><a href='carro_detalle.php?action=resta'><img src='images/flechabajo.png' width='10px' height='10px'/></a></td>";
echo "<td>" . $row['precio']; echo "</td>";
echo "<td>" . $row['precio'] * $_SESSION['unidades'][$i]; echo "</td>";
echo "</tr>";
}

Get row content to a popup window

I have used this function to pop up a window, when a user clicked the table row
<script type="text/javascript">
$(document).ready(function() {
$("td.abc").click(function() {
var t = 'Ticket ID: ' + $(this).find('td:eq(0)').html()+'\n'+'\n';
var r = 'Subject: ' + $(this).find('td:eq(1)').html()+'\n'+'\n';
var e = 'Messege: ' + $(this).find('td:eq(2)').html()+'\n'+'\n';
var f = 'Developer: ' + $(this).find('td:eq(3)').html()+'\n'+'\n';
var w = 'Current Status: ' + $(this).find('td:eq(4)').html()+'\n'+'\n';
var q = 'Uploaded Date & Time: ' + $(this).find('td:eq(5)').html()+'\n'+'\n';
var o = $("#79").attr("name")+'\n'+'\n';
alert(t+r+e+f+w+q+o);
});
});
</script>
my table is as follows
echo "<br> <table border='0' id='example' width='980' align='center'>
<tr>
<th width='60'>Ticket ID</th>
<th width='150'>Subject</th>
<th width='670'>Messege</th>
<th width='60'>Developer</th>
<th width='70'>Status</th>
<th width='105'>Date - Time</th>
</tr>";
while($row = mysql_fetch_array($result)) {
//echo $row['jobSatus'];
echo "<tr>";
echo "<td class=\"abc\" width='60'>" . $row['id'] . "</td>";
echo "<td class=\"abc\" width='150'>" . $row['subject'] . "</td>";
echo "<td class=\"abc\" width='670'>" . $row['msg'] . "</td>";
echo "<td class=\"abc\" width='60'>" . $row['developer'] . "</td>";
echo "<td class=\"abc\"width='60'>" . $row['jobstatus'] . "</td>";
echo "<td class=\"abc\" width='105'>" . $row['date_time'] . "</td>";
echo "<input class=\"abc\" type='hidden' name=".$row['image']." id=".$row['id'].">";
echo "</tr>";
}
echo "</table>";
Now inside the pop window I don't get any values. It says "undefined". I would be very thankful if someone could show what I have done wrong.
try to change this...
var t = 'Ticket ID: ' + $(this).find('td:eq(0)').html()+'\n'+'\n';
to this
var t = 'Ticket ID: ' +$(this).closest('td:eq(0)').attr('class');
Hope this will help....
You are clicking on a table cell, not a table row
$("td.abc").click(function() {
^^
Change it to look at the table
$("#example").on("click", "tr", function () {
or
$("#example").on("click", "tr:has(td.abc)", function () {
And your HTML markup is invalid since an input element can not be a child element of a tr.
Set onclick on table-row
$("tr.ticker-row").click(function(ev) {
var $this = $(ev.currentTarget);
var t = 'Ticket ID: ' + $this.find('td:eq(0)').html()+'\n'+'\n';
var r = 'Subject: ' + $this.find('td:eq(1)').html()+'\n'+'\n';
var e = 'Messege: ' + $this.find('td:eq(2)').html()+'\n'+'\n';
var f = 'Developer: ' + $this.find('td:eq(3)').html()+'\n'+'\n';
var w = 'Current Status: ' + $this.find('td:eq(4)').html()+'\n'+'\n';
var q = 'Uploaded Date & Time: ' + $this.find('td:eq(5)').html()+'\n'+'\n';
var o = $this.find('input').attr('name') + '\n'+'\n';
alert(t+r+e+f+w+q+o);
});
On php, do not insert any node in tr except td
while($row = mysql_fetch_array($result)) {
//echo $row['jobSatus'];
echo "<tr class=\"ticket-row\" data-row-index=\"".$row['id']."\">";
echo "<td class=\"abc\" width='60'>" . $row['id'] . "<input class=\"abc\" type='hidden' name=".$row['image']." ></td>";
echo "<td class=\"abc\" width='150'>" . $row['subject'] . "</td>";
echo "<td class=\"abc\" width='670'>" . $row['msg'] . "</td>";
echo "<td class=\"abc\" width='60'>" . $row['developer'] . "</td>";
echo "<td class=\"abc\"width='60'>" . $row['jobstatus'] . "</td>";
echo "<td class=\"abc\" width='105'>" . $row['date_time'] . "</td>";
echo "</tr>";
}
echo "</table>";

Categories

Resources