How to pass PHP variable (from loop process) to Jquery - php

Question

i have a while loop in my coding
while (($i < $num3b)&&($i < ($start+$perpage))) {
$tododetail_id=mysql_result($result3b,$i,"tododetail_id");
$comment=formatUrlsInText(mysql_result($result3b,$i,"comment"));
$staff_name=mysql_result($result3b,$i,"staff_name");
echo "<tr><td><span><font color='#5858FA'>" . $staff_name . nl2br($comment) . "</font>
<span style='float:right' id='create-user'>Reply Message</span>";
$i++;}
How can onclick "Reply Message" jquery will popup $staff_name and $comment accordingly.
This is my jquery code
$( '[id^="create-user"]')
.click(function() {
var nameStf = $(this).data('id');
alert (nameStf);
$( "#dialog-form" ).dialog( "open" );
});
Thanks

Answer 1

You could use the data-attributes
HTML
<span style='float:right' class="reply" data-staffname="staffname" data-comment="staff comment">Reply Message</span>
jQuery
$(document).ready(function() {
$('span.reply').click(function() {
var staffname = $(this).data('staffname');
var comment = $(this).data('comment');
alert(staffname + ': ' + comment);
});
});

Answer 2

When you echo tags, I can't see you are closing them anywhere. Your HTML must be correct in order for jQuery to work properly. Also ID must be unique so use class.
HTML
<tr>
<td>
<span style="color: #5858FA;">SOMETHING 2</span>
<span class="create-user">Reply Message</span>
</td>
</tr>
JS
$('.create-user').click(function(){
var $text = $(this).prev().text();
alert($text);
});
DEMO

Answer 3

Your HTML is a mess, and your jQuery doesn’t correspond with it. You have this line:
$( "#dialog-form" ).dialog( "open" );
But you haven’t shown us any HTML that includes an element with the ID dialog-form.
You should restructure your HTML so you don’t use the font tag, every ID is unique, and tags are properly nested and closed. Run your output HTML through the validator if you’re not sure.
Then, you can do something like this:
$('span').click(function(){
alert($(this).closest('.comment'));
});
Obviously you’ll have to put the comment data in an element with the class comment.
Also, if you want to select an element by its ID with jQuery:
// Incorrect
$('[id^="create-user"]')
// Correct
var $createUser = $('#create-user');
// Also correct (normal JavaScript)
var createUser = document.getElementById('create-user');

Answer 4

id must be unique give it as something like the id from the database. Then put the jquery script inside the loop. or else in the html use a onclick function which passes the id to the JavaScript function.
<?php
echo "<tr><td><span><font color='#5858FA'>" . $staff_name . nl2br($comment) . "</font>
<span style='float:right' id="<?php echo $row['id'];">Reply Message</span>";
$i++;
?>
<script type="text/javascript">
$( "#<?php echo $row['id']; ?>")
.click(function() {
var nameStf = $(this).data('id');
alert (nameStf);
$( "#dialog-form" ).dialog( "open" );
});
</script>
<?php }?>
Try not to use html inside an echo statement since echo is a php statement which loads from the server which is slower than normal html which loads in the browser.