JQuery Adding of row in table not working - javascript

I'm trying to add a row in a table from a data from another table. it says uncaught reference error.
here's the function
function addItem(id, name){
bootbox.confirm("Are you sure?", function(result) {
if (result) {
$('#ingredients_table').append("<tr><td>"+name+"</td></tr>");
}
});
}
here's the table where I'm calling the js function
<?php foreach($inventory as $row): ?>
<tr style="cursor: pointer;" data-toggle="tooltip" data-placement="top" title="Add ingredient" onclick="javascript:addItem(<?php echo $row->inventory_id; ?>, <?php echo $row->name; ?>)">
<td><?php echo $row->name; ?></td>
</tr>
<?php endforeach; ?>
The ID is showing in the table when I switch them, but the name is not.

Hope this will help you :
use '' (quotes) for javascript function arguments
<?php foreach($inventory as $row): ?>
<tr style="cursor: pointer;" data-toggle="tooltip" data-placement="top"
title="Add ingredient"
onclick="javascript:addItem('<?php echo $row->inventory_id; ?>', '<?php echo $row->name; ?>')">
<td><?php echo $row->name; ?></td>

Related

How can i add mouse hover effect on the conditioned background rows according to php result

<?php if($result["staff_follow"]== 'By Party'&& $result["Status"]== 'PENDING'): ?> style="background-color:#E99E3E;
the below feiled is not working.
"onmouseover="this.bgColor='litegreen'" onmouseout="this.bgColor='#E99E3E'"
<?php elseif($result["Status"]== 'PENDING'): ?>style= "background-color:#DB7093; "
<?php endif; ?> >
<!-- <td><?php echo $result["Roll_No"];?></td> -->
<td style="text-align: center;"><?php echo $counter ;?></td>
<td><?php echo $result["Document_Name"];?></td>
<td><?php echo $result["Document_Num"];?></td>
<td><?php echo $result["Extent"];?></td>
<td><?php echo $result["Status"];?></td>
<td><?php echo $result["Document_App_Det"];?></td>
<td><?php echo $result["staff_follow"];?></td>
Try again with this.bgColor='LightGreen'.
The named colors can be found here:
https://htmlcolorcodes.com/color-names/

change <td> tag to editable and submit form after editing cakephp 2

I am working in a cakephp 2 project. On my view I have a table on which I want to make a cell editable. After editing I want want to save it.
I have tried contentEditable of HTML 5. By that I can edit but data is not passed to controller. I also tried innerHTML which change the cell to input but I can't write anything on the input field. How can I solve the problem? Thanks
<script>
function makeInput(e) {
document.getElementById('test').innerHTML= "<input type='text'>"
}
function formSubmit2(){
document.getElementById('StockReportEditForm').submit();
}
</script>
<?php if(!empty($results)): ?>
<?php echo $this->Form->create('StockReport',array('url'=>array('type'=>'post','action'=>'edit')));?>
<table>
<tr>
<th>Year Week</th>
<th>Counter</th>
<th>Refrigerator</th>
<th>Freezer</th>
<th>Summary</th>
</tr>
<?php foreach ($results as $result): ?>
<?php $today = date("Y-m-d", strtotime("+1 week"));
$date = new DateTime($today);
$week = $date->format("W");
$week_int = (int)$week;
$week_int=$week_int-1;
$last_week = (string)$week_int;
$year = date("Y"); ?>
<tr>
<?php if($year.$last_week==$result['StockReport']['yearweek']): ?>
<td onclick="makeInput(this)" id="test">
<?php echo $result['StockReport']['yearweek']; ?>
<?php else:?>
<td><?php echo $result['StockReport']['yearweek'];?></td>
<?php endif ?>
</td>
<td><?php echo $result['StockReport']['counter']; ?></td>
<td><?php echo $result['StockReport']['refrigerator']; ?></td>
<td><?php echo $result['StockReport']['freezer']; ?></td>
<td><?php echo $result['StockReport']['summary']; ?></td>
</tr>
<?php endforeach; ?>
</table>
<?php
// echo $this->Form->submit('Submit');
$options = array(
'label' => 'Submit',
'div' => array(
'class' => 'glass-pill',
),
'id'=>'submitButton',
'onclick'=>'formSubmit2()'
);
echo $this->Form->end($options); ?>
<?php endif; ?>
I would create a hidden input within the td element and when the form is submitted I copy the htmlinner of the contenteditabe to the hidden input value.

Delete a row javascript using row id

Hi guys I have a table created by php in this way:
foreach ($query as $row): ?>
<tr id="<?php echo $row->aic;?>" >
<td><?php echo $row->aic; ?></td>
<td><?php echo $row->denominazione ?></td>
<td><?php echo $row->quantita; ?></td>
<td><?php echo $row->alert; ?></td>
<td>
<a id="bt_modifica"
class="btn btn-default btn-xs"
data-toggle="tooltip"
data-placement="top"
title=""
data-original-title="Modifica">
<img src="<?php echo base_url(); ?>template/images/Modifica.png">
</a>
<a id="bt_elimina>"
class="btn btn-default btn-xs"
data-toggle="tooltip"
data-placement="top"
title=""
data-original-title="Elimina"
onclick="deleteRow(<?php echo $row->aic ?>))">
<img src="<?php echo base_url(); ?>template/images/Elimina.png">
</a>
</td>
</tr>
<?php
endforeach; ?>
</tbody>
I need to delete row by rowId. This table has the dynamics id.
The columns ids are the same id of the sql table; in effect aic is id of sql table! In this way I are sure that the HTML row id is unique.
This is script
function deleteRow(rowID)
{ var row = document.getElementById(rowID);
row.parentElement.removeChild(row);
alert(rowID);
}
}
this code don't delete row.
Change this:
onclick="deleteRow(deleteRow(<?php echo $row->aic ?>))">
to
onclick="deleteRow(<?php echo $row->aic ?>)">
Another potential issue is that this:
<?php echo $row->aic ?>
may not be a number. So, you need to quote it. That is, change:
onclick="deleteRow(<?php echo $row->aic ?>)">
to:
onclick="deleteRow(\"<?php echo $row->aic ?>\")">
2 issues -
The one that might be causing issue - Incorrect Function Name
Other one - Calling deleteRow() twice - within each other (this should not cause any issue though)
So, just change -
function eliminaProdotto(rowID)
to -
function deleteRow(rowID)
Edit:
Based on modified question -
Is $row->aic a string? If yes, then add quotes around it...
onclick="deleteRow('<?php echo $row->aic ?>')"

Cart is updated only once using Jquery and Codeigniter

I am working on Updating Codeigntier Cart with Jquery using Ajax call to update. Here is my jquery function
$(function() {
$('.cart_form select').on('change', function(ev) {
var rowid = $(this).attr('class');
var qty = $(this).val();
var postData_updatecart = {
'rowid' : rowid,
'qty' : qty
};
//posting data to update cart
$.ajax({
url : base_url + 'bookings/update_booking_cart',
type : 'post',
data : postData_updatecart,
beforeSend : function() {
$('#cart_content').html('Updating...');
},
success : function(html) {
//window.location.href = "postproperty.php?type="+suffix+'&page=page1';
$('#cart_content').html(html);
}
});
});
});
I have cart view file as
<div class="cart_form">
<?php echo form_open(base_url().'index.php/bookings/customerdetails', array('class' => 'bookings_form_customer', 'id' => 'bookings_form_customer')); ?>
<table cellpadding="6" cellspacing="1" style="width:100%" border="0">
<tr>
<th style="text-align:left">Item Description</th>
<th style="text-align:left">QTY</th>
<th style="text-align:right">Item Price</th>
<th style="text-align:right">Sub-Total</th>
</tr>
<?php $i = 1; ?>
<?php foreach ($this->cart->contents() as $items): ?>
<?php echo form_hidden($i.'[rowid]', $items['rowid']); ?>
<tr>
<td>
<?php echo $items['name']; ?>
<?php if ($this->cart->has_options($items['rowid']) == TRUE): ?>
<p>
<?php foreach ($this->cart->product_options($items['rowid']) as $option_name => $option_value): ?>
<strong><?php echo $option_name; ?>:</strong> <?php echo $option_value; ?><br />
<?php endforeach; ?>
</p>
<?php endif; ?>
</td>
<td>
<select name="<?php echo $i.'[qty]'; ?>" class="<?php echo $items['rowid']; ?>">
<?php
for($tt=0; $tt<=10; $tt++)
{
?>
<option value="<?php echo $tt; ?>" <?php if($tt==$items['qty']) echo 'selected="selected"'; ?>><?php echo $tt; ?></option>
<?php
}
?>
</select>
</td>
<td style="text-align:right"><?php echo $this->cart->format_number($items['price']); ?></td>
<td style="text-align:right">$<?php echo $this->cart->format_number($items['subtotal']); ?></td>
</tr>
<?php $i++; ?>
<?php endforeach; ?>
<tr>
<td colspan="2"> </td>
<td class="right"><strong>Total</strong></td>
<td class="right">$<?php echo $this->cart->format_number($this->cart->total()); ?></td>
</tr>
</table>
<p><?php echo form_submit('update_cart', 'Update your Cart'); ?></p>
</form>
</div>
Things are working Nice. But, lets say if I have 2 products, if i select one item's qty from 1 to 2, cart is updated and updated cart is shown using AJAX. But, if I immediately change another item's qty then it doesnt work.
The cart view file is inside class 'cart_form'.
Helping hands are appreciated.
I got an answer. You can refer below link
Ajax Request works only once
OR
Directly follow this
REPLACE jquery code part by
$(function() {
$(document).on( "change", "#bookings_form_customer select", function(ev) {
// your code goes here
});
});

Capturing a PHP var inside a foreach loop in javascript and using it in an other PHP page.

I got the following php foreach loop in the A page of my web appliation. And i want to use the $watson variable which is inside this loop in an other php B page. What i did is used this variable as a value in an extra input button:<input type="button"/ value="<?php echo $watson; ?>,so to be able to capture this var in javascript like you see below.
<tbody>
<?php
foreach($records as $r) {
$watson = $r->case_reference;
?>
<tr>
<td><?php echo escape($r->user); ?></td>
<td><?php echo escape($r->customer); ?></td>
<td><?php echo escape($r->vessel); ?></td>
<td><?php echo escape($r->country); ?></td>
<td><?php echo escape($r->port); ?></td>
<td><?php echo escape($r->eta); ?></td>
<td><?php echo escape($r->service_station); ?></td>
<td><?php echo escape($r->type_of_service); ?></td>
<td><?php echo escape($r->case_reference); ?></td>
<td><?php echo escape($r->status); ?></td>
<td><input type="button" value="<?php echo $watson; ?>" onclick="popEdit(this.value);" /></td>
</tr>
<?php
}
?>
</tbody>
The code for the onclick="popEdit(this.value);"function which pops up the B page mentioned above is :
function popEdit(str) {
window.open("example.php?watson="+str, "pop_edit_jobs",
"width=400,height=350,scrollbars=no,left=460,top=400")
}
And the php B page code starts as $ref_num = $_GET['watson']; so i can use the variable.
My problem is that i dont want the input/button in the A page to show the variable on it instead i want it to just show the word EDIT.But to do that i ll have to change its value and then i wont be able to capture this $watson var in javascript.
Any suggestions regarding how to achieve the above effect?
<td><input type="button" value="EDIT" onclick="popEdit('<?php echo $watson; ?>');" /></td>
should achieve the desired effect.
Wrap a form around your entire table, then use submit buttons:
<input type="submit" name="watson" value="<?php echo htmlspecialchars($watson); ?>" />

Categories