Accessing clicked cell instead of all cells using JQuery and Ajax
I am trying to edit a specific cell once it's clicked. When I click a cell
currently it turns all the td into textboxes. I would like only the
clicked cell do that. How can I access just the clicked cell? Here is my
current code: (ignore the .change function for now; I haven't fixed it
yet.
$(document).ready(function()
{
$(".edit_tr").click(function()
{
$(".text").hide();
$(".editbox").show();
}).change(function()
{
var ID=$(this).attr("#datanum");
for (var i = 0; i < ID; i++)
{
var input=$("#input_"+ID).val();
var text=$("#span_" + ID).val();
var dataString = 'id='+ ID
+'&firstname='+first+'&lastname='+last;
$("#first_"+ID).html('<img src="load.gif" />'); //
Loading image
if(input != text)
{
$.ajax({
type: "POST",
url: "table_edit_ajax.php",
data: dataString,
cache: false,
success: function(html)
{
$("#first_"+ID).html(first);
$("#last_"+ID).html(last);
}
});
}
else
{
alert('Enter something.');
}
}
});
// Edit input box click action
$(".editbox").mouseup(function()
{
return false
});
// Outside click action
$(document).mouseup(function()
{
$(".editbox").hide();
$(".text").show();
});
});
This is my PHP code:
public function displayTable($table)
{
//connect to DB
$con = mysqli_connect(DB_HOST, DB_USER, DB_PASS, DB_NAME);
echo "<table id='table' border='1'>"; //start an HTML table
$dbtable = $table;
$fields =array();
$result = mysqli_query($con, "SHOW COLUMNS FROM ".$dbtable);
//fill fields array with fields from table in database
while ($x = mysqli_fetch_assoc($result))
{
$fields[] = $x['Field'];
}
$fieldsnum = count($fields); //number of fields in array
//create table header from dbtable fields
foreach ($fields as $f)
{
echo "<th>".$f."</th>";
}
//create table rows from dbtable rows
$result = mysqli_query($con, "SELECT * FROM ".$dbtable);
$i = 0;
while ($row = mysqli_fetch_array($result))
{
$j = 0;
echo "<tr class='edit_tr' id='".$j."'>";
foreach ($fields as $f)
{
echo "<td class='edit_td'><span id='span_".$i."'
class='text'>".$row[$f]."</span>
<input type='text' value='".$row[$f]."' class='editbox'
id='input_".$i."'/> </td>";
$i++;
}
$j++;
echo "</tr>";
}
echo "</table>"; //close the HTML table
echo "<label id='datanum'>".$i."</label>";
//close connection
mysqli_close($con);
}
No comments:
Post a Comment