Get id of hidden field which is returned by ajax

[exhaler]

Hi,

i have a news section on my site and two buttons "next" and "previous", i'm using jquery ajax to load the next or previous news article

 

this is ajax code when the user clicks on "next":

<script type="text/javascript">
$(document).ready(function() {
var loading = '<img src="images/ajax-loader.gif" alt="" />';

// Get next article
$("a.next").click(function() {
	// Show loading image
	$("#news").slideUp("normal", function() {$("#news").html(loading);});

	var id = $(this).attr('next_id');
	var data = 'id=' + id;
                        $.ajax({
		type: "POST",
		url: "includes/get_next_news.php",
		data: data,
		cache: false,

		success: function(result){
			$("#news").slideDown("slow", function() {$("#news").html(result);});
		}						   	
	});	
});
   });
</script>

 

in get_next_news.php i have this:

<?php
$id_main = $_POST['id'];

$query = "SELECT * FROM news ";
$query .= "WHERE id = $id_main ";
$query .= "LIMIT 1";

$result = mysql_query($query);
$row = mysql_fetch_array($result);

$title = stripslashes($row['title']);
$description = $row['description'];

// Get id of next news
$query_next = "SELECT id FROM news ";
$query_next .= "WHERE id > $id_main ";
$query_next .= "ORDER BY id DESC ";
$query_next .= "LIMIT 1";

$result_next = mysql_query($query_next);

if (mysql_num_rows($result_next) == 1){
	$row_next = mysql_fetch_array($result_next);
	$next_id = $row_next['id'];
} else {
	$next_id = 0;
}

echo "<table cellpadding=\"0\" cellspacing=\"0\" width=\"100%\">
			<tr>
				<td valign=\"top\" height=\"1\" align=\"left\" style=\"text-align: justify;\">
					<font class=\"font_style\">
						<b>$title</b>
					</font>
				</td>
			</tr>

			<tr>
			<td valign=\"top\" align=\"left\" style=\"padding-top: 5px; text-align: justify\">
					<font class=\"font_style\" color=\"#616161\">
						$description
					</font>
				</td>
			</tr>

			<input type=\"hidden\" id=\"next\" next_id=\"$next_id\" />
			<input type=\"hidden\" id=\"news_title\" news_title=\"$title\" />
		</table>";
?>

 

after i get the next article i want to change the "next" or "previous" link to point to the id of the next article, so in get_next_news.php  i made a hidden input with attribute next_id which stores the id of the next news article

 

i.e: if we are seeing article with id = 1, then "next" should get us article with id = 2 with attribute next_id = 3.

 

my problem lies within storing next_id to the "next" button

 

i've tried this:

success: function(result){
     var news_next = $("#next").attr('next_id');
     $("#next").attr('next_id') = news_next;
     $("#news").slideDown("slow", function() {$("#news").html(result);});
}

but its not working since it not getting the next_id of the ajax call but the next_id of the article that is currently viewed

 

 

[exhaler]

i've figured out how i can return 2 sets of data from the jquery ajax function

$.ajax({
dataType: "json",
type: "POST",
url: "includes/get_news.php",
data: data,
cache: false,

success: function(json){
	$("#news").slideDown("slow", function() {$("#news").html(json['some_html_outupt']);}); // add html output to page
}						   	
});

 

get_news.php:

<?php
$id_main = $_POST['id'];

$query = "SELECT * FROM news ";
$query .= "WHERE id = $id_main ";
$query .= "LIMIT 1";

$result = mysql_query($query);
$row = mysql_fetch_array($result);

$title = stripslashes($row['title']);
$description = str_replace("<br><hr size=\"2\" width=\"100%\">", " ", $row['description']);

$display = "<table cellpadding=\"0\" cellspacing=\"0\" width=\"100%\">
				<tr>
					<td valign=\"top\" height=\"1\" align=\"left\" style=\"text-align: justify;\">
						<font class=\"font_style\">
							<b>$title</b>
						</font>
					</td>
				</tr>

				<tr>
					<td valign=\"top\" align=\"left\" style=\"padding-top: 5px; text-align: justify;\">
						<font class=\"font_style\" color=\"#616161\">
							$description
						</font>
					</td>
				</tr>
			</table>";

// create json content
echo "{";
echo "\"some_html_outupt\":\"$display\",";
echo "\"some_value_for_js_varialbe_output\":\"asd\"";
echo "}";
?>

 

the code above is working if i removed the html tags (<table>, <tr>, <td>.....) but i want to show it with the tags

any ideas???

[exhaler]

finally able to solve it, it turns out that u can't put spaces in a json and only a single quote:

get_news.php:

$display = '<table cellpadding=\"0\" cellspacing=\"0\" width=\"100%\"><tr><td valign=\"top\" height=\"1\" align=\"left\" style=\"text-align: justify;\"><font class=\"font_style\"><b>' . $title . '</b></font></td></tr><tr><td valign=\"top\" align=\"left\" style=\"padding-top: 5px; text-align: justify;\"><font class=\"font_style\" color=\"#616161\">' . $description . '</font></td></tr></table>';

 

jquery ajax:

$("a.prnex").click(function() {
		// Show loading image
		$("#news").slideUp("normal", function() {$("#news").html(loading);});

		if ($(this).attr('id') == 'next') { 
			var id = $(this).attr('next_id');
		} else {
			var id = $(this).attr('prev_id');
		}
		var data = 'id=' + id;			

		// Get next article
		$.ajax({
			dataType: "json",
			type: "POST",
			url: "includes/get_news.php",
			data: data,
			cache: false,

			success: function(json){
				$("#news").slideDown("slow", function() {$("#news").html(json['html']);});

				// Change title of document
				document.title = 'Pamtek - ' + json['title'];

				// Change id of next article relative to the current one
				if (json['next_id'] != 0 && json['prev_id'] != 0) {
					$("#next").show();
					$("#next").attr('next_id', json['next_id']);

					$("#prev").show();
					$("#prev").attr('prev_id', json['prev_id']);
				} else if (json['next_id'] == 0) {
					$("#next").hide();
				} else if (json['prev_id'] == 0) {
					$("#prev").hide();
				}					
			}						   	
		});	
	});