CODEWITHSUNDEEP
phpajaxjquery
Dylan Madisetti
Dylan Madisetti

Reputation: 775

Trigger PHP on simple Jquery event with Ajax

Based the ID of div clicked I want to be able to change an embed link.

This code previously worked when I set up the page with a form.

<embed src=
  "/<?php
     if (isset($_POST['playlist'])) { // if ANY of the divs were clicked
         echo $_POST['playlist']; // echo the choice
     }else{
         echo "5125962"; // As a default playlist
     }
?>">

However my client disliked the page refreshing. Building on that, I discard the forms for this JavaScript

$(document).ready(function() { 
    $(".playlist").click(function(){
      var playlist = $(this).attr('id');
      $.ajax({
        url: '/update/apps/music.php',
        data : playlist,
        type : 'POST',
        success : function(data) {
          $(".PlaylistHolder").load('/update/apps/music.php');
        }
      });
    }); 
});

in place of the .ajax function I also tried

$(".PlaylistHolder").load('/update/apps/music.php', playlist);

The idea was that in place of the whole page refreshing, it would reload the contents of the "PlayListHolder" div. I'm not getting any syntax errors, but my variable won't carry across. In my PHP I tried $_GET and $_REQUEST as well. Any ideas?

Normally I fix my code on my own, but given the nature of debugging I think I'm going to throw up if I the default song one more time. Thanks guys

Upvotes: 4

Views: 1518

Answers (2)

Jayantha Lal Sirisena
Jayantha Lal Sirisena

Reputation: 21366

The posting data should be formatted as a JSON object.You need to format data to post like this,

var list = $(this).attr('id');
      $.ajax({
        url: '/update/apps/music.php',
          data :{playlist: list},
        type : 'POST',
        success : function(data) {
          $(".PlaylistHolder").load('/update/apps/music.php');
        }
      });

Or else you can post a serialized form like this

data :$('#yourFormId').Serialize(),

See Example Here

Upvotes: 3

sgrif
sgrif

Reputation: 3822

You're not actually passing the returned AJAX data. The parameter passed to your function contains whatever your ajax call got from the file. Change

$(".PlaylistHolder").load('/update/apps/music.php');

to

$(".PlaylistHolder").load(data);

Upvotes: 2

Related Questions