CODEWITHSUNDEEP
phpjquery
Saint Robson
Saint Robson

Reputation: 5525

How To Use PHP Variable Into jQuery .load() Script?

I have this jQuery script with .load() function and this script saved on file named header.php:

$(document).ready(function() {
    $('.my-wrapper').find(".wrapper-area").append('<div class="loadergif"></div>').load("file001.php?key=XXXXXX", function() {
    $(this).find('.wrapper-area').remove('.loadergif');
    var $container = $('.list-wrap');

    $container.imagesLoaded( function(){
        $container.masonry({
        itemSelector : '.my-wrapper'
        });
    });
});

on the other side, I have this PHP variables on file named body.php :

while($row = mysql_fetch_array($result)){
    $Key = $row['key'];
    echo '<div class="wrapper-area">';
       //jQuery script will produce something here             
    echo '</div><!-- .wrapper-area -->';
}

now the problem is how to bring that $Key from PHP file becomes XXXXXX part of jQuery script : 'file001.php?key=XXXXXX'

please note that $Key is dynamically generated from WHILE loop. means, it has different value each loop cycle.

thanks before

Upvotes: 0

Views: 312

Answers (3)

Nelson Ben&#237;tez Le&#243;n
Nelson Ben&#237;tez Le&#243;n

Reputation: 50643

In PHP, replace your following line:

echo '<div class="wrapper-area">';

for this one:

echo '<div class="wrapper-area" data-key="'.$Key.'">';


In jQuery, replace your following line:

$('.my-wrapper').find(".wrapper-area").append('<div class="loadergif"></div>').load("file001.php?key=XXXXXX", function() {

for this one:

$('.my-wrapper').find(".wrapper-area").each(function() {
   $(this).append('<div class="loadergif"></div>').load("file001.php?key"+$(this).data('key'), function() {
    ...
    ...
}); //close the each() call
}); //close document.ready()

Upvotes: 1

Michael
Michael

Reputation: 12836

You could try this to build the wrappers:

while ($row = mysql_fetch_assoc($result))
{

  echo '<div class="wrapper-area" data-key="' . $row['key'] . '">';

  // ...

}

And this for the jQuery:

$(function()
{

  $('.my-wrapper').find('.wrapper_area').each(function()
  {

    $(this).append('<div class="loadergif"></div>').load('file001.php?key=' + $(this).attr('data-key'), function()
    {
      // ...
    }
    )

  }
  )

}
)

Upvotes: 0

Jay Blanchard
Jay Blanchard

Reputation: 34426

Your question is not quite clear but I think that you want to change your load line to this - 

.load("file001.php", {key:XXXXXX}, function() {

Upvotes: 0

Related Questions