MySQL Query onclick event on table row

Question

I intend to run a query onclick event on table row.

I have created a function in javascript and I can read the id of each row.

Now I wanted to be able to run a query with this id as a condition.

Can they help me please?

Realize my question?

Below I show my code.

-------------Javascript Function-----------------!

    <script>
function addRowHandlers() {
    var table = document.getElementById("tableId");
    var rows = table.getElementsByTagName("td");
    for (i = 0; i < rows.length; i++) {
        var currentRow = table.rows[i];
        var createClickHandler = 
            function(row) 
            {
                return function() { 
                                        var cell = row.getElementsByTagName("td")[1];
                                        var id = cell.innerHTML;
                                        alert("id:" + id);
                                 };
            };

        currentRow.onclick = createClickHandler(currentRow);
    }
}
window.onload = addRowHandlers();
</script>

-----Query I intend to run-----------

$result= mysql_query("select * from tasks where idTask = id");

while($row = mysql_fetch_array($result))
{
    $image = $row['image'];
    header("Content-type:image/jpeg");
    echo $image;
}

enter image description here

In place of your alert("id:" + id);, you need to do an Ajax call to your php file. There are many examples, both in standard javascript and using the jquery library, here on SO. — Sean
– Sean, Commented Sep 29, 2014 at 14:44
Thanks for reply. I'm new to programming PHP. could you be more explicit please? — rpirez
– rpirez, Commented Sep 29, 2014 at 14:46
Ajax using standard javascript - stackoverflow.com/questions/8567114/… Ajax using the jQuery library - stackoverflow.com/questions/5004233/… and a little of both - stackoverflow.com/questions/14220321/… — Sean
– Sean, Commented Sep 29, 2014 at 14:57
Thanks again for your reply. I really try all examples tha you gave me, but I can't do what I want :( Can you tell me if there is a simple way to execute the query inside javascript code? — rpirez
– rpirez, Commented Sep 29, 2014 at 15:18
Your php query can't be executed directly in javascript code. Php is executed on server-side, before the page is loaded to the browser, and javascript is executed client-side, after the page is loaded. If you want to execute php after the page has been loaded, you have to use ajax to contact the server to run the code, and then load it dynamically on response. I will post an answer/example in a few minutes. — Sean
– Sean, Commented Sep 29, 2014 at 15:29

Sean · Accepted Answer · 2014-09-30 15:38:19Z

You need to use Ajax to send your id to a seperate php file, and then return the data. I use the jQuery library, so this example uses $.post() - (http://api.jquery.com/jquery.post/) and jQuery UI .dialog() - (http://jqueryui.com/dialog/) to popup the result similar to alert()

javascript code

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
function addRowHandlers() {
    var table = document.getElementById("tableId");
    var rows = table.getElementsByTagName("td");
    for (i = 0; i < rows.length; i++) {
        var currentRow = table.rows[i];
        var createClickHandler = 
            function(row) 
            {
                return function() { 
                                        var cell = row.getElementsByTagName("td")[1];
                                        var id = cell.innerHTML;

                                        //use ajax to post id to ajax.php file
                                        $.post( "ajax.php", { id:id }, function( data ) { 
                                              //add result to a div and create a modal/dialog popup similar to alert()
                                              $('<div />').html('data').dialog();
                                        });

                                 };
            };

        currentRow.onclick = createClickHandler(currentRow);
    }
}
window.onload = addRowHandlers();
</script>

ajax.php (seperate file, randomly named ajax.php)

$id = mysql_real_escape_string($_POST['id');    

$result= mysql_query("select * from tasks where idTask = $id");

while($row = mysql_fetch_array($result))
{
    $image = $row['image'];
    header("Content-type:image/jpeg");
    echo $image;
}

Than you very much for your reply. Do not have to apologize, the family comes first. I used the code that you put and the result was a box with a multiple characters.You want that I post a print screen? How can I fix that?Sincere greetings.

Collectives™ on Stack Overflow

MySQL Query onclick event on table row

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related