We Keep Coding

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.

Cannot get element id in javascript inside for loop

I am trying to use getElementById() inside loop as the id of my each div I want to get is in sequence like total_comments1, total_comments2, total_comments3,.. and so on. This ids are assigned by output using php.
Here is my code to display my div:
<?php
$i=0;
while( $row = mysqli_fetch_assoc($ret) ):
$i++;
?>
<tr>
<td class="col3 col">
<div id="<?php echo "total_comments".$i ?>"></div>
</td>
</tr>
Here is my javascript code:
<script>
for(var i in (result.response)) {
var a=document.getElementById("total_comments" + i );
a.innerHTML = result.response[i].posts;
}
</script>
When I use only "total_posts" in document.getElementBy ID it does not give any error. But when I use "total_posts"+i it gives error on next line. Cannot set property 'innerHTML' of null

Array have starting index from 0.
In your case, you are incrementing $i before assigning.
That is causing your ids start from 1 not 0
You should increment it after assigning.
Corrected code:
<?php
$i=0;
while ($row = mysqli_fetch_assoc($ret)):
?>
<tr>
<td class="col3 col">
<div id="<?php echo "total_comments".$i ?>"></div>
</td>
</tr>
<?php
$i++;
endwhile;
?>

The problem is on your php cycle, try to change it like this:
<?php
$i=0;
while($row = mysqli_fetch_assoc($ret) {
echo '<tr><td class="col3 col">'
.'<div id="total_comments'.$i.'"></div>'
.'</td></tr>';
$i++;
}
?>

Datatables can not be responsive as example

i have a trouble with the datatables there.
I trying to add a datatables with responsive as the image
It's ok when i put it as a separate file but when i add the data from my database, i can not press on the plus icon to show detail about the member as the image
i just change the data and i don't know why it doesn't work.
Can you help?
This is my code: (i did close php tag for the first open php but i dont know why i can not post it on here)
<?php
$stt= 1;
$sql= "SELECT * from users ORDER BY level DESC";
//thuc hien cau lenh voi bien conn lay tu file connection.php
$query= mysqli_query($conn, $sql);
while ($data=mysqli_fetch_array($query)){
<tr>
<th scope="row"><?php echo $stt++?></th>
<td><?php echo $data["firstname"]?></td>
<td><?php echo $data["lastname"]?></td>
<td><?php echo $data["username"]?></td>
<td><?php echo $data["email"]?></td>
<td><?php echo $data["phone"]?></td>
<td>
<?php
if($data["level"] == 1){
echo "Administrator";
}else{
echo "Member";
}
?>
</td>
<td>
Detail
</td>
</tr>
<?php
}
?>

Please change your code
<th scope="row"><?php echo $stt++?></th>
to
<td scope="row"><?php echo $stt++?></td>
change th to td will fix your problem.

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 ?>')"

How to get value table row value using jquery/ajax

<?php
include "config.php";
// Fetch the data
$con = mysql_query("select * from product");
?>
<div style=" height:250px; overflow:auto;">
<table class="table table-striped table-bordered dTableR" id="ajxtable">
<tr>
<th>Jobno</th>
<th>Product</th>
<th>Qty</th>
<th>Designed by</th>
<th>Action</th>
</tr>
<?php
while ($row = mysql_fetch_array($con)) {
$id = $row['id'];
$pcode = $row['pcode'];
$lproduct = $row['lproduct'];
$mrprate = $row['mrprate'];
?>
<tr>
<td><?php echo $id; ?></td>
<td><?php echo $lproduct; ?></td>
<td><?php echo $mrprate; ?></td>
<td><?php echo "admin"; ?></td>
<td><input type="button" id="addmorePOIbutton1" style="width:25px;" value="+" onClick=""/>
<input type="button" id="delPOIbutton1" style="width:25px;" value="-" onClick=""/></td>
</tr>
<?php
}
?>
</table>
</div>
This is ajax page. Below table is auto refreshed every 5 seconds.
My doubt is how to get that particular row value.
When i click table row + button, get these particular row values, and place to index page text box and this '+' button also hide.
Kindly suggest any jquery or ajax code for adding below code.
I am new to jquery ,,anybody help me with sample code..that would help me greately. Thanks in advance

$(document).ready(function () {
$('#yourtablename tr').click(function (event) {
alert($(this).attr('id')); //trying to alert id of the clicked row
});
});
Above code may be help you and another solution is:
$('td').click(function(){
var row_index = $(this).parent().index();
var col_index = $(this).index();
});