Load PHP function with jQuery Ajax

Question

I have a file which is loaded at the top of my document, which is called Videos.php. Inside that file are several functions, such as getYoutubeVideos. On some pages, I need to call upon that function several times (up to 50), and it of course creates major lag on load times. So I have been trying to figure out how to call that function in, only when it is need (when someone clicks the show videos button). I have very little experience with jQuery's ajax abilities. I would like the ajax call to be made inside of something like this:

           jQuery('a[rel=VideoPreview1).click(function(){
                jQuery ("a[rel=VideoPreview1]").hide();
                jQuery ("a[rel=HideVideoPreview1]").show();
                jQuery ("#VideoPreview1").show();

                                //AJAX STUFF HERE

                preventDefault();
            });

Ok I have created this based on the responses, but it is still not working:

jQuery Code:

        jQuery(document).ready(function(){ 

            jQuery("a[rel=VideoPreview5]").click(function(){
                jQuery("a[rel=VideoPreview5]").hide();
                jQuery("a[rel=HideVideoPreview5]").show();
                jQuery.post("/Classes/Video.php", {action: "getYoutubeVideos",
artist: "Train", track: "Hey, Soul Sister"},
                    function(data){
                        jQuery("#VideoPreview5").html(data);
                    }, 'json');
                jQuery("#VideoPreview5").show();
                preventDefault();
            });
            jQuery("a[rel=HideVideoPreview5]").click(function(){
                jQuery("a[rel=VideoPreview5]").show();
                jQuery("a[rel=HideVideoPreview5]").hide();
                jQuery("#VideoPreview5").hide();
                preventDefault();
            });
        });

And the PHP code:

    $Action = isset($_POST['action']);
    $Artist = isset($_POST['artist']);
    $Track = isset($_POST['track']);
    if($Action == 'getYoutubeVideos')
    {
        echo 'where are the videos';
        echo json_encode(getYoutubeVideos($Artist.' '.$Track, 1, 5, 'relevance'));
    }

Answer 1

$.post('Videos.php', {
    'action': 'getYoutubeVideos'
}, function(data) {
    // do your stuff
}, 'json');

In your php code, do something like this:

$action = isset($_POST['action'])? $_POST['action'] : '';
if($action == 'getYoutubeVideos')
{
    echo json_encode(getYoutubeVideos());
}

Then data in your JavaScript function will be the array/object/value returned by getYoutubeVideos().

Answer 2

I would do the JS part like ThiefMaster describes, but the php part would i handle a little bit different.

I would do something like this:

if(isset($_POST['action'], $_POST['par1'], $_POST['par2'])
{
    $action = $_POST['action'];
    $result = $this->$action($_POST['par1'], $_POST['par2]);
    echo json_encode(result);
}

But be careful, if you have some methods in the class which shouldn't be called by the user, trough manipulating POST data, then you need some way to whitelist the methods the JavaScript may call. You can do it by prefixing the methods i.e:

 $this->jsMethod.$action(....);

or by simple if/switch condition.