pass jquery value to php variable

**jarv01980** · Feb 3, 2012 07:39

Hi All,
I really hope someone can help as I'm having a tough time trying to sort this.
I've the following script in my header.php file:

Code:

$(document).ready(function(){      
	$.ajaxSetup({cache:false});     
	$(".locationID").click(function(){         
		var post_id = $(this).attr("rel"); 
		//alert($(this).attr('rel'));
		$("#single-home-container").html("loading...");         
		$("#single-home-container").html(post_id);
		//$("#single-home-container").text(post_id);

		$.post("footer.php", {"locationID": post_id});

		return false;    
	});  
});

It passes the value I need into this div in my footer.php file:

Code:

<div id="single-home-container"></div>

However, I really need to get the value and pass it into a php variable so I can use it in a mysql query. So I've got this:

Code:

<?php 
$locID = $_POST['locationID']; 
echo 'Result: '.$locID;
?>
But it simply wont get the value. Any help is much appreciated!

**sdleihssirhc** · Feb 3, 2012 14:33

Sorry for a dumb question, but how do you know it won't get the value? From the code you presented, it doesn't look like there's any way to confirm or deny.

**jarv01980** · Feb 4, 2012 03:15

Thanks for the reply. Surely, if the code worked, I would be able to see the value when I print the php variable:

Code:

<?php 
$locID = $_POST['locationID']; 
echo 'Result: '.$locID;
?>

As $locID should contain the value from the jquery code

Code:

$.post("footer.php", {"locationID": post_id});

Or have I miss understood? :-(
Thanks

**paul_wilkins** · Feb 4, 2012 07:14

You may want to instead var_dump of the $_POST variable, so that you can determine whether the information you need is there or not and then troubleshoot from there.

**sdleihssirhc** · Feb 4, 2012 10:59

Also, keep in mind that you're sending an AJAX request without specifying a "success" function, so there still wouldn't be any way to check what your PHP echos/dumps. You'd have to do something like this:

Code JavaScript:

$.post("footer.php", {"locationID": post_id}, function (txt) {
    alert(txt);
});

**jarv01980** · Feb 5, 2012 10:22

Thanks for the replies.

I tried var_dump and it just shows an empty array.

If I add:

Code:

$.post("footer.php", {"locationID": post_id}, function (txt) {
    alert(txt);
});

It doesn't do anything. I'm astounded it's not so simple to just pass a value into PHP's

Code:

<?php $locID = $_POST['locationID']; echo 'Result: '.$locID;?>

:-(

**paul_wilkins** · Feb 5, 2012 15:57

Originally Posted by jarv01980

It doesn't do anything. I'm astounded it's not so simple to just pass a value into PHP

A simple test shows that your scripting code works works without any problems.

HTML Code:

<html>
<head>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
var post_id = 20;
$.post("footer.php", {"locationID": post_id}, function (txt) {
    alert(txt);
});
</script>
</body>
</html>

footer.php

Code php:

<?php
$location_id = filter_input(INPUT_POST, 'locationID', FILTER_SANITIZE_NUMBER_INT);
echo 'Footer with location id of ' . htmlentities($location_id);
?>

The footer would have worked too with only:

Code:

echo 'Footer with location id of ' . $_POST['locationID'];

but it's best to make good use of input filtering and output protection as a normal way of doing things.

Given that the above JavaScript code works fine, this points the finger at something else other than the $.post() code being the problem.

**jarv01980** · Feb 6, 2012 02:28

Thanks paul_wilkins.

With that, I can see the result in the pop up/alert but the php statement doesn't print the value? Is there a way to print it out in the php and not the alert?
Thanks again

**paul_wilkins** · Feb 6, 2012 02:36

Originally Posted by jarv01980

With that, I can see the result in the pop up/alert but the php statement doesn't print the value? Is there a way to print it out in the php and not the alert?
Thanks again

Ahh, this may be something that you need to learn more about,

When jQuery's posts to the php file, the output of that PHP file is sent back to the function in the txt variable.

**jarv01980** · Feb 6, 2012 02:45

Oh I see.:-( hmmm, this is proving tricky.

Please can I ask you to advise how i get it from the text variable to the php variable as in:

Code:

<?php echo 'Footer with location id of ' . $_POST['locationID']; ?>

Thanks again, your help really is very much appreciated!

**paul_wilkins** · Feb 7, 2012 08:07

Originally Posted by jarv01980

Oh I see.:-( hmmm, this is proving tricky.

Please can I ask you to advise how i get it from the text variable to the php variable as in:

Code:

<?php echo 'Footer with location id of ' . $_POST['locationID']; ?>

Thanks again, your help really is very much appreciated!

That all depends on how the needed value appears in the HTML code.

**jarv01980** · Feb 7, 2012 08:20

Hi,
I'm simply trying to get the ID of a link so I can pass it to a query. So for example, if can do this:

Code:

<?php $locationID  = $_POST['locationID']; echo 'Location Id is: '.$locationID; ?>

to ensure that it's working.

As I'm trying to load a list of properties on a site and by clicking each one, will load them on the page you're currently on. So I figure, get the ID of the property onclick and pass it to the query. I therefore assume, if the above code works, I can pass the $locationID value to the query to load the info needed. If that helps?

**paul_wilkins** · Feb 7, 2012 23:50

Originally Posted by jarv01980

I therefore assume, if the above code works, I can pass the $locationID value to the query to load the info needed. If that helps?

Yes that does indeed. The code in post #7 demonstrates how to achieve that type of communication, where jQuery is used to post an ajax message to a .php file, and the successful output of that php file is passed back to the function, whereupon you can do something with it.

**jarv01980** · Feb 8, 2012 02:44

Ok. I've been playing around but am still none-the-wiser! So if I post my code, it may help.
I've got header.php with this:

Code:

<script>
$(document).ready(function(){      
	$.ajaxSetup({cache:false});     
	$(".locationID").click(function(){         
		var post_id = $(this).attr("rel"); 
		//alert($(this).attr('rel'));
		$("#single-home-container").html("loading...");         
		$("#single-home-container").html(post_id);

		$.post("test.php", {"locationID": post_id}, function (txt) {
			alert(txt);
		});


		return false;    
	});  
}); 
</script>

I then have footer.php which lists all the dynamic links:

Code:

			<ul>
			<?php	
			$args = array( 
						  'post_type' => 'locations', 
						  'order'    => 'DESC'
						  );
			$loop = new WP_Query( $args );
			while ( $loop->have_posts() ) : $loop->the_post();
			?>	
				<li><a href="#" rel="<?php the_ID(); ?>" class="locationID"><?php the_title(); ?></a></li>
			<?php	
			endwhile;	
			wp_reset_query();
			?>												
			</ul>

In footer.php, I also include a call to a file:

Code:

<?php include(TEMPLATEPATH."/test.php"); ?>

In test.php I want to show the result of the selected link:

Code:

echo 'Footer with location id of ' . $_POST['locationID'];
$the_location_id = $_POST['locationID'];

			<?php	
			$args = array( 
						  'post_type' => 'locations', 
						  'posts_per_page' => 1,
						  'p' => $the_location_id ,
						  );
			$loop = new WP_Query( $args );
			while ( $loop->have_posts() ) : $loop->the_post();
			?>	
			<?php the_title(); ?>
			<?php	
			endwhile;	
			wp_reset_query();
			?>

So As you can see, I'm trying to get the id of the clicked link, pass it to a php variable which I can then use in a query. From what's shown above, surely that's correct? But if I echo the variable

Code:

echo $the_location_id;

nothing is shown

Sorry to keep posting but I really would like to get to grips with it and see what I've done wrong.

Thanks again

**paul_wilkins** · Feb 8, 2012 03:15

Originally Posted by jarv01980

Sorry to keep posting but I really would like to get to grips with it and see what I've done wrong.

So when the page loads, header.php, footer.php and test.php all get included at the same time, and are used to create the page.

If you perform the echo from that test.php page, there naturally won't be any post data for it to use.
It's only when you click a link and the jQuery post occurs on a second access of test.php that the post data will be available, and the output will be sent back to the function as the txt string.

**jarv01980** · Feb 8, 2012 03:19

Yes, they all load at the same time. It's a wordpress site and this is how the pages are constructed.

So does this mean I can't achieve what I'm after? As I say, if I add

Code:

<div id="single-home-container"></div>

to test.php, whenever I click a link, this shows the right value. So I just need to somehow do something as daft as

Code:

<?php $this_id = '<div id="single-home-container"></div>'; ?>

although I know that doesn't assign the value but I think you know what I mean?

**paul_wilkins** · Feb 8, 2012 03:23

Originally Posted by jarv01980

Yes, they all load at the same time. It's a wordpress site and this is how the pages are constructed.

So does this mean I can't achieve what I'm after? As I say, if I add

Code:

<div id="single-home-container"></div>

to test.php, whenever I click a link, this shows the right value. So I just need to somehow do something as daft as

Code:

<?php $this_id = '<div id="single-home-container"></div>'; ?>

although I know that doesn't assign the value but I think you know what I mean?

Would you mind listing down step-by-step what you want to achieve and why?
Perhaps that will help us to understand what you need to achieve, and how to help you achieve it.

**jarv01980** · Feb 8, 2012 03:31

Sure, no problem.
I have a wordpress template. This consists of a header.php, page.php and footer.php

page.php
This shows the information from wordpress for standard pages: Home, About, Contact etc

page.php calls header.php and footer.php in

footer.php contains a loop which pulls in a list of properties from a custom post type. Each propoerty has a unique ID.

I'm trying to show the details of any of the properties on the page you're currently on. The site does not need to load a seperate page for each property. So like having an iframe I guess. Therefore, if you're on About Us. You will see the list of properties. If I click the first property, it will load the details into test.php. I therefore assumed jquery/ajax would best suit as it refreshes page content without reloading the page

Does that help?

**paul_wilkins** · Feb 8, 2012 03:54

Originally Posted by jarv01980

Does that help?

Yes, that does help.

You can use the jQuery's .load() method instead, to more easily achieve that for you.

For example:

Code -"javascript":

$("#objectID").load("test.php", { 'choices[]': ["Jon", "Susan"] } );

Or as you might want to use it:

Code -"javascript":

$("#single-home-container").load("test.php", { 'locationID': $(this).attr("rel") } );

**jarv01980** · Feb 8, 2012 04:02

Ok thanks, so if I add

Code:

$("#single-home-container").load("test.php", { 'locationID': $(this).attr("rel") } );

to the header.
How do I get that in the test.php file to be linked as I've tried:

Code:

echo 'Footer with location id of ' . $_POST['locationID'];
$the_location_id = $_POST['locationID'];
echo '<br>Loc ID '. $the_location_id;
$this_id = '<div id="single-home-container"></div>'; echo $this_id;

Thanks again for your help, it really is appreciated!

**paul_wilkins** · Feb 8, 2012 04:04

Originally Posted by jarv01980

Ok thanks, so if I add

Code:

$("#single-home-container").load("test.php", { 'locationID': $(this).attr("rel") } );

to the header.
How do I get that in the test.php file to be linke

Using .load() it's a GET request that goes to the server, not a POST request.

**jarv01980** · Feb 8, 2012 04:07

Thanks again but:

Code:

$the_location_id = $_GET['locationID'];
echo '<br>Loc ID '. $the_location_id;

Still not showing anything or have I been really thick?

**paul_wilkins** · Feb 8, 2012 04:08

Originally Posted by jarv01980

Thanks again but:

Code:

$the_location_id = $_GET['locationID'];
echo '<br>Loc ID '. $the_location_id;

Still not showing anything or have I been really thick?

Possibly. Do you have a test page?

**jarv01980** · Feb 8, 2012 04:11

Not online as developing locally. To clarify, I now have:
Header.php

Code:

<script>
$(document).ready(function(){      
	$.ajaxSetup({cache:false});     
	$(".locationID").click(function(){         
		var post_id = $(this).attr("rel"); 
		//alert($(this).attr('rel'));
		$("#single-home-container").html("loading...");         
		$("#single-home-container").html(post_id);
		
		$("#single-home-container").load("test.php", { 'locationID': $(this).attr("rel") } );
		
		//$.post("test.php", {"locationID": post_id}, function (txt) {
		//	alert(txt);
		//});

		return false;    
	});  
}); 
</script>

Test.php

Code:

<div id="single-home-container"></div>

<?php 
$the_location_id1 = $_GET['locationID'];
echo '<br>Loc ID '. $the_location_id1;
?>

It still has the remaining loop

footer.php
the same as post #14
Thanks

**paul_wilkins** · Feb 8, 2012 04:15

Originally Posted by jarv01980

It still has the remaining loop

footer.php
the same as post #14
Thanks

It's not allowed for a page to have multiple unique identifiers, as it tends to go against the idea of them being unique, so you'll need to remove that div from the test.php code.

After that, check that the click event is being successfully run.

User Tag List

Thread: pass jquery value to php variable

Thread Tools

Display

pass jquery value to php variable

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions