Passing PHP variable to Jquery without refresh

Question

I apologize upfront for my lack of jquery knowledge. In this website I am building, a user is presented with a number of thumbnail images representing plants. When a thumbnail i

Answer 1

Im pretty sure you dont need to query PHP each time ... something like this would work :

<img class-"imgclick" src="/small-plant.jpg" data-id="123" />

This would be the output from your server side (php if thats what your using) - it stores the ID of the image in the data attribute

JavaScript :

$(document).ready(function() {
   $('.imglink').click(function(event) {
      event.preventDefault();
      $('dialogid')
        .data('image_id', $(this).data('id'))
        .dialog('open');
   })
})

the image id from the data attribute is then passed to the data attribute of the dialog. This attribute can be accessed using $(this).data('image_id') form within the dialog then

Answer 2

Use the jQuery AJAX method to gather data from a PHP file and display it on the page. It is very easy and you can pass any variables (parameters) you like to the page.

http://api.jquery.com/jQuery.ajax/

For example:

// This will send a request to a PHP page
$.ajax({
    url: "http://example.com/test.php",
    dataType: "html",
    success: function(data){
        // Place the returned data into your content
        $('#image').html(data);
    }
});