Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Getting AJAX to work with PHP variables

Posted on 2008-11-06
8
Medium Priority
?
713 Views
Last Modified: 2012-06-21
My code is below. It is for a gallery that can be found here

http://test.shanedj.com/deborahtarr/gallery/

There is a favorites button that has the <a href> assigned to it.  I have it at teh moment so that it passes my variable to JavaScript and stores the Value. Eventually there will be a page where all the collected variable will be sent to and thus display the favorited images.

Here's what I want (but am struggling) to do.

Display on the page when any image has been favorited a link to "Go To Favorites", possibly need to refresh but without the page reloading.

Get the variable from JavaScript to PHP in the variable name $imgID

Hope you can help! Keep it simple i'm still learning on the JavaScript side of things!
<?php 
session_start();
 
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Gallery of Work - Deborah Tarr</title>
<link rel="stylesheet" href="../css/jd.gallery.css" type="text/css" media="screen" />
<link rel="stylesheet" href="../css/main.css" type="text/css" />
<script src="../scripts/mootools.v1.11.js" type="text/javascript"></script>
<script src="../scripts/jd.gallery.js" type="text/javascript"></script>
<script src="../scripts/jd.gallery.set.js" type="text/javascript"></script>
<script src="../scripts/jquery.js" type="text/javascript"></script>
 
<script type="text/javascript">
  jQuery.noConflict();
	
	function startGallery() {
	var myGallery = new gallery($('myGallery'), {
	timed: false
	});
	}
	window.addEvent('domready', startGallery);
	
	function addTo(id){
	jQuery.post(".", { fav: id, date: new Date().getTime() }, 
         function() 
         {
            //alert(id);
			
         }
         );
	}	
</script> 
 
</head>
 
<body>
<?php if ($_GET['fav']){echo "Added";} ?>
<div id="myGallery">
    <div class="imageElement">
      <h4>Swans</h4>
      <p>Some Swans by the canal.</p>
<a href="javascript:addTo(1);" title="Favorite this image" class="open" rel="nofollow"></a>
      <img src="../images/brugges2006/1.jpg" class="full" />
    </div>
    <div class="imageElement">
      <h4>Castle</h4>
      <p>Orange lit castle.</p>
      <a href="javascript:addTo(2);" title="Favorite this image" class="open" rel="nofollow"></a>
      <img src="../images/brugges2006/2.jpg" class="full" />
    </div>
</div>
 
</body>
</html>

Open in new window

0
Comment
Question by:ShaneJones
  • 4
  • 4
8 Comments
 
LVL 5

Accepted Solution

by:
vibrazy earned 2000 total points
ID: 22895554
Hi,

I think the best solution will be when the user clicks on add to favourite, it will send a variable to a page called favourite.php and send $_GET['id'].

//favourite.php
This page could add the ids to a session variable etc.
and return 'sucess' if all goes well then display message "added to favourite".

Then you could create a favourite_show.php page that will get the session id and show the images.


$.get('favourite.php', 
{
    'id': (id of images stored in javascript)
}
, function(data){
    if(!data)
    {
        alert("There was an error with the processing of your information.\nPlease try again later.");
    }
    else
    {
        if(data == 'success')
        {
            //process the page
            //display message         
        }
        else
        {
            alert("There was an error with the processing of your information.\nPlease try again later.");
        }
    }
});

Open in new window

0
 
LVL 12

Author Comment

by:ShaneJones
ID: 22895723
so on favourite.php shoulkd I just have $_GET['id'] and then when a user goes to favourite_show.php i could just have echo $_GET['id']  ??
0
 
LVL 5

Expert Comment

by:vibrazy
ID: 22896073
In your favourite.php, you will have a script that adds the ids of the images the users are clicking (add to favourite), and store it in a session variable.

$_SESSION['favourite'][] = $_GET['image.jpg'];
$_SESSION['favourite'][] = $_GET['image2.jpg'];
etc..

So basically if the user clicks  on add to favourite it will send the url of the image/or id, add to a session.

So then if they go to favourite_show_images,php, you will have the url of all the images they have added to the session, and display them.

<?php
foreach($_SESSION['favourite'] as $url)
{
echo '<img src="' . $url .'" />
}
?>
Or whatever code you have.

Regards,
Dan
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 12

Author Comment

by:ShaneJones
ID: 22896623
This is defo getting there now. something not quite working tho it it is adding to the session just not bringing it back on teh showfav.php page.

For some reason after favouriting a few pictures it just outputs
<br><br><br><br><br><br>

but I am expecting

1<br>2<br>5<br>6<br>9<br>11<br>

have shows my 3 pages of code below.

Thanks

MY INDEX.PHP PAGE ////////////////////////
<?php 
session_start();
 
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Gallery of Work - Deborah Tarr</title>
<link rel="stylesheet" href="../css/jd.gallery.css" type="text/css" media="screen" />
<link rel="stylesheet" href="../css/main.css" type="text/css" />
<script src="../scripts/mootools.v1.11.js" type="text/javascript"></script>
<script src="../scripts/jd.gallery.js" type="text/javascript"></script>
<script src="../scripts/jd.gallery.set.js" type="text/javascript"></script>
<script src="../scripts/jquery.js" type="text/javascript"></script>
 
<script type="text/javascript">
  jQuery.noConflict();
	
	function startGallery() {
	var myGallery = new gallery($('myGallery'), {
	timed: false
	});
	}
	window.addEvent('domready', startGallery);
	
	function addTo(id){
	jQuery.post(".", { fav: id, date: new Date().getTime() }, 
         function() 
         {
            //alert(id);
			
         }
         );
		
	jQuery.get('fav.php', 
	{
	    'id': id
	}
	, function(data){
	    if(!data)
	    {
	        alert("There was an error with the processing of your information.\nPlease try again later.");
	    }
	    else
	    {
	        if(data == 'success')
	        {
	            //process the page
	            //display message         
	        }
	        else
	        {
	            alert("There was an error with the processing of your information.\nPlease try again later.");
	        }
	    }
	})
}
 
;	
</script> 
 
</head>
 
<body>
<div id="myGallery">
    <div class="imageElement">
      <h4>Swans</h4>
      <p>Some Swans by the canal.</p>
<a href="javascript:addTo(1);" title="Favorite this image" class="open" rel="nofollow"></a>
      <img src="../images/brugges2006/1.jpg" class="full" />
    </div>
    <div class="imageElement">
      <h4>Castle</h4>
      <p>Orange lit castle.</p>
      <a href="javascript:addTo(2);" title="Favorite this image" class="open" rel="nofollow"></a>
      <img src="../images/brugges2006/2.jpg" class="full" />
    </div>
</div>
<a href="showfav.php">View Favs</a>
</body>
</html>
 
 
MY FAV.PHP PAGE
<?php
session_start();
$_SESSION['favourite'][] = $_REQUEST['fav'];
 
?>
 
MY SHOWFAV.PHP PAGE
<?php
session_start();
foreach($_SESSION['favourite'] as $imgID)
	{
		echo $imgID .'<br />';
	}
 
?>

Open in new window

0
 
LVL 5

Expert Comment

by:vibrazy
ID: 22896886
Try this

foreach ($_SESSION['favourite'] as $key=>$value) {
    echo $value."<br/>";
    }

Open in new window

0
 
LVL 5

Expert Comment

by:vibrazy
ID: 22897050
I think you might need to tweak afterwards, and add some checks into your php files.. So if someone tries to add an id that is already in the SESSION array, it doesnt add..or use unique_array(), "i think", to remove duplicate ids.

I can see its coming together nicely

Weldone
0
 
LVL 12

Author Comment

by:ShaneJones
ID: 22898208
Brilliant, I have the JS and PHP communicating now. Thats all I asked for. The PHP stuff now I think I can cover off....

Thanks again for your help.... :)
0
 
LVL 12

Author Closing Comment

by:ShaneJones
ID: 31513909
Epic Win,,, totally does what I need now
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
Suggested Courses

577 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question