Hello everyone, I'm having a conceptual breakdown... I am stuck on event handlers. The task is to click a table row (or just a cell if necessary) to trigger a routine to break out the record to display the full record set, update it, or delete it. I have tried a whole variety of traditional and modern event handlers and listeners, but as you have probably already guessed, nothing has worked. I have broken it down to the simplest possible in-element handler but still no joy.
I suspect that the problem may be the order of processing; I have learned that PHP is the first in order, so perhaps attaching event handlers to echoed HTML won't work. I'm grasping at straws here, and I hope someone can clear up the issue. I would like an explanation of the theory, not just a code fix, so the proverbial light will illuminate.
The end code will be much more involved, but here is the most basic version to simply get the onclick handler to function with a simple 'hello' alert. Why doesn't it work?
echo "<div id='wrap'>";
echo "<table id='myTable' align='center'>";
$sql="SELECT * FROM Complex ORDER BY Name" . $num;
$result = $db->query($sql);
// Column headings: The MySQL table column names
while($row = mysqli_fetch_assoc($result)) //Get Rows - Display in column format
// Table row data in table columns
echo "<tr id='myRow'><td class='link' id='myCell'><a href='#' onclick='alert('hello!')>".$row['Key_ID']." - ".$row['Name']."</td>
<td class='link'><a href='#1'>".$row['Address1']."</td>
<td class='link'><a href='#1'>".$row['Address2']."</td>
<td class='link'><a href='#1'>".$row['City']." ".$row['State']." ".$row['Zip']."</td></tr>";
} //end of function
} //end of class pagination
JS to execute php script passing variable
Hello everyone on Easter morning...
The task: Take the record number of the clicked row and pass that value to a new php script [displayRec.php], and load the record for display, edit & save, or delete. Ideally, I would like the new window to overlay the window of the clicked row, and when work is done, return to the previous window for another selection.
I tried AJAX [ajax_post( )] to transfer the value of keyid to displayRec.php but without success, and that code has broken the original script. Some AJAX response code is present for testing purposes, but that is not needed.
- Why did ajax_post() break the original script?
- Using js, how do I execute displayRec.php while passing keyid?
The modified script
var tbl = document.getElementById("myTable");
var trs = tbl.rows;
for ( var t = 0; t < trs.length; ++t )
var tr = trs[t]; // one row
if ( tr.id.substring(0,3) == "ROW" )
tr.onclick = pickRow;
function pickRow( )
var keyid = this.id.substring(3); // get the ID of the <tr> past the "ROW"
alert( "You clicked on the row with keyid " + keyid );
function ajax_post( )
var ajax = ajaxObj("POST", "displayRec.php");
ajax.onreadystatechange = function()
if(ajaxReturn(ajax) == true)
//document.getElementById("status").innerHTML = response;
ajax.send("keyid=" . keyid );
The script, displayRec.php:
//<!-- ******** displayRec.php ******** -->
echo $_POST["keyid"]." is ".$_POST["keyid"];
echo "displayRec worked!";
As always, I want to understand the fix so please explain your suggestions in detail, and theory, concepts, and references are always welcome.
Thanks again and happy Easter