Load PHP page content without page refresh - php

Question

I am trying to load content from a PHP page when user clicks on a link:
The user can click the link to get the AJAX data in the file: message.php
I currently have this code in message.php
$('#pmid<?php echo $convoData['id']; ?>').click(function(){
$.ajax({
type:"GET", //this is the default
url: "/index.php?i=pm&p=rr",
data: {id:"<?php echo $convoData['id']; ?>"}
})
.done(function( stuff ) {
$( "#name" ).html( stuff );
$( "#post" ).html( otherstuff );
$( "")
});
});
And the HTML:
Chat with <span id="name"></span> //The $name should be added to here
<ul id="post"></ul> //The $post should be added to here
The page where the AJAX is getting the data from is named: get.php, it looks like this:
$id = $_GET['id'];
$get=mysql_query("SELECT * FROM private_messages WHERE id='$id'");
$getData=mysql_fetch_assoc($get);
//Set the variables that needs to be send back to the other page.
$getUser=$user->getUserData($getData['sender_id']);
$name=$getUser['username'];
$post = '
<li>
<img width="30" height="30" src="images/avatar-male.jpg">
<div class="bubble">
<a class="user-name" href="">'.$name.'</a>
<p class="message">
'.$getData['subject'].'
</p>
<p class="time">
</p>
</div>
</li>
';
echo $name;
echo $post;
So, the problem is that currently all the data is just being printed in #name
How can I do so the $name will get printed in #name and the $post in #post?

Answer 1

Return the output as a json encoded array with two keys and on the response show the values based on keys like this
In your php
$arrRet = array();
$arrRet['name'] = $name;
$arrRet['post'] = $post;
echo json_encode($arrRet);
die();
In the ajax
$.ajax({
type:"GET",
url: "/index.php?i=pm&p=rr",
dataType:'json',
data: {id:"<?php echo $convoData['id']; ?>"},
success : function(res){
if(res){
$( "#name").html(res.name);
$( "#post").html(res.post);
}
}
});

Answer 2

I'd use json to pass the two variables:
JS:
$('#pmid<?php echo $convoData['id']; ?>').click(function(){
$.ajax({
type:"GET", //this is the default
url: "/index.php?i=pm&p=rr",
data: {id:"<?php echo $convoData['id']; ?>",},
dataType: 'json'
})
.done(function( stuff ) {
$( "#name" ).html( stuff[0] );
$( "#post" ).html( stuff[1] );
$( "")
});
});
PHP:
echo json_encode(array($name,$post));

Answer 3

try returning it like this:
$output = array();
$output['name'] = $name;
$output['post'] = $post;
$output = json_encode($output);
echo json_encode($output); exit;
Then with the return in js try :
function(data){
$( "#name" ).html( data.name );
$( "#post" ).html( data.post );
}