iwishiwasacodemonkey
iwishiwasacodemonkey

Reputation: 193

Using jQuery .load() to pass a parameter to and call a php function

This is the jQuery .load function I have. What I want to do is run the php function with a passed value from the jQuery. I think I just don't understand how to pass values with jQuery to the server. Do I perhaps need to use .get or .post? Please advise.

$(document).ready(function(){
  $("#scotland").click(function() {
    $("#Main").load('thumbs.php #Main', $path=./scotland);
  });
});

php div that the jQuery script targets.

<div id="main">
<?php
function thumbnailload($path)
{
$dir_handle = @opendir($path) or die("Unable to open folder");
while (false !== ($file = readdir($dir_handle))) {

if(ereg("(.*)\.(jpg|bmp|jpeg|png|gif)", $file)){
echo "<a href='$path/$file'><img class='thumbnail' src='$path/thumbs/thumb_$file' alt='$file'></a>";
}
}
closedir($dir_handle);
}
thumbnailload($path);
?>
</div>

Upvotes: 1

Views: 19001

Answers (2)

Vinicius Cainelli
Vinicius Cainelli

Reputation: 847

It is usually in early to have this kind of problem, not knowing how to interact with a client-side language (JavaScript) to a server-side (PHP). But let's go!

For the page "thumbs.php" receives a parameter, you must send the data via GET or POST.

Javascript:

$(document).ready(function(){
    $("#scotland").click(function() {
        $("#Main").load('thumbs.php', {'path': 'scotland'});
    });
});

thumbs.php

<div id="main">
    <?php
        if(!empty($_REQUEST['path'])) { // i used $_REQUEST because it receives the data from POST or GET.
            $path = $_REQUEST['path'];
            $dir_handle = @opendir($path) or die("Unable to open folder");
            while (false !== ($file = readdir($dir_handle))) {
                if(ereg("(.*)\.(jpg|bmp|jpeg|png|gif)", $file)) {
                    echo "<a href='$path/$file'><img class='thumbnail' src='$path/thumbs/thumb_$file' alt='$file'></a>";
                }
            }
            closedir($dir_handle);
        } 
    ?>
</div>

The method .load() in jquery uses a GET request type if the data is not passed. In our case, I am passing data ( {'path': 'scotland'} ), so the request is of type POST.

Useful links:

I hope I was helpful =]

Upvotes: 8

Sal
Sal

Reputation: 1655

change you jQuery script to:

$(document).ready(function(){
  $("#scotland").click(function() {
    $("#Main").load('thumbs.php #Main', {'func': 'thumbnailload', 'path': './scotland'});
  });
});

and change PHP code to:

<div id="main">
<?php
$func = $_GET['func'];
switch($func){
    case 'thumbnailload':
       thumbnailload($_GET['path']);
    break;
}

function thumbnailload($path)
{
$dir_handle = @opendir($path) or die("Unable to open folder");
while (false !== ($file = readdir($dir_handle))) {

if(ereg("(.*)\.(jpg|bmp|jpeg|png|gif)", $file)){
echo "<a href='$path/$file'><img class='thumbnail' src='$path/thumbs/thumb_$file' alt='$file'></a>";
}
}
closedir($dir_handle);
}
thumbnailload($path);
?>
</div>

for ref: http://api.jquery.com/load/

Upvotes: 1

Related Questions