Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   переключение страниц без перезагрузки (https://javascript.ru/forum/jquery/36107-pereklyuchenie-stranic-bez-perezagruzki.html)

VEGA 04.03.2013 14:06

переключение страниц без перезагрузки
 
Добрый день
есть проблема.. сделал гостевую на аяксе.. все нормально выводится.. но не могу сделать переключение страниц в гостевой книге без перезагрузки страницы

index.php
<script src="jquery-1.9.1.min.js"></script>
</head>

	
	

<?php
$set['title']='Гостевая книга '; // заголовок страницы


?>
<!-- код формы -->


<form id="myForm"  action="site/action" onsubmit="clearForm(this); return true;">

			Сообщение:

			<textarea id="msg"    cols="36" rows="4" style="width:90%;" ></textarea>


</br></br>

			<input  type="submit" value="Отправить сообщение">

</form>
<div id="messages">
</div>
	
<script>

	function splash()
	{
		if (document.myForm.msg.value  =='')
			{
				alert ("Заполните текст сообщения!");
				return false;	
			}
		return true;   
	}

	// загрузка сообщений из БД в контейнер messages
	function show_messages()
	{
		$.ajax({
			url: "show.php",
				data: "&page=<?=intval($_GET['page'])?>",
			cache: false,
			success: function(html){
				$("#messages").html(html);
			}
		});
	}
	
	
	function clearForm(f) {
  window.setTimeout(function() {
    f.elements.msg.value='';
  }, 100);
}

	
	$(document).ready(function(){
		show_messages();
		// контроль и отправка данных на сервер в фоновом режиме при нажатии на кнопку "отправить сообщение"
		$("#myForm").submit(function(){
			var msg  = $("#msg").val();
			if (msg =='')
			{
				alert ("Заполните текст сообщения!");
				return false;
			}
			$.ajax({
				type: "POST",
				url: "action.php",
				data: "msg="+msg+"&action=add",
				
			
				success: function(msg){
					show_messages();
			   }
			
			});
			return false;
		});
		
	show_messages();
    setInterval("show_messages()", 10000);
	
      

      var flagGoIn = true;
$('#myForm')
	.off('keydown')
	.on('keydown', function(event){
		if (event.keyCode == 17) {
	        $('#myForm').on('keydown', function(event){
			var msg  = $("#msg").val();
				if (event.keyCode == 13 && flagGoIn) {
					if (msg =='')
			{
				alert ("Заполните текст сообщения!");
				return false;
			}
					$.ajax({
				type: "POST",
				url: "action.php",
				data: "msg="+msg+"&action=add",
				

				success: function(msg){
					show_messages();
					clearForm();
					
			   }
			

			
			});
				$('#msg').val('');
					//$('#myForm').off('keydown');
					flagGoIn = false;
					
				}
			})
			.keyup(function(event){
				flagGoIn = true;
			});
		}
	});

      
  

      
	});

</script>	

</body>
</html>


action.php
// получаем переменные из формы
	//$username=$_REQUEST['username'];
	$msg=$_REQUEST['msg'];
	$action=$_REQUEST['action'];
	
	
	$msg=esc(mysql_real_escape_string(stripcslashes(htmlspecialchars($_REQUEST['msg']))));
	
	if ($action=="add")
	{
		// добавление данных в БД 
		$sql="INSERT INTO `us_guest` (id_user,id_user_**, time, msg) values('$us[id]', '0', '$time', '$msg')";

		$r=mysql_query ($sql);
	}
	


?>


show.php
$k_post=mysql_result(mysql_query("SELECT COUNT(*) FROM `us_guest` WHERE `id_user_**` = 0"),0);
$k_page=k_page($k_post,$set['p_str']);

	if ($page!="end")
	{
$page=$_REQUEST['page'];
	}




	if ($page=="end")
	{
	$page=$k_page;
	}


$start=$set['p_str']*$page-$set['p_str'];


if ($k_post==0)
{
echo "Нет сообщений<br/>\n";
}
	$r=mysql_query("SELECT * FROM `us_guest` WHERE `id_user_**` = 0 ORDER BY id DESC  LIMIT $start, $set[p_str] ");// выбор всех записей из БД, отсортированных так, что самая последняя отправленная запись будет всегда первой.
	while ($post=mysql_fetch_array($r))  // для каждой записи организуем вывод.
	{
		......
	}
	
echo'<a href="?page=2">Следующая страница</a><br/>';


Мне нужно чтобы при нажатии на ссылку "Следующая страница" .. страница менялась динамически без перезагрузки страницы.. подскажите пожалуйста как это можно сделать ?

skynet-mfd 04.03.2013 14:52

Вот это забыл наверное

$("#myForm").ajaxForm(function() {

});

skynet-mfd 04.03.2013 15:01

строки 105...115 нужно убрать и задать как раз вот для ajaxForm

skynet-mfd 04.03.2013 15:05

в твоем случае будет что то типа
$("#myForm").ajaxForm({
	                type: "POST",
	                url: "action.php",
	                data: "msg="+msg+"&action=add",
	                success: function(msg){	                        show_messages();
              clearForm();
	               }

type, post можно не указывать и прописать в самой форме

VEGA 04.03.2013 15:16

Цитата:

Сообщение от skynet-mfd (Сообщение 238661)
в твоем случае будет что то типа
$("#myForm").ajaxForm({
	                type: "POST",
	                url: "action.php",
	                data: "msg="+msg+"&action=add",
	                success: function(msg){	                        show_messages();
              clearForm();
	               }

type, post можно не указывать и прописать в самой форме

а что с ссылкой делать ?
echo'<a href="?page=2">Следующая страница</a><br/>';


мне нужно переключать страницы без перезагрузки страницы.. то есть чтобы в файле show.php менялась переменная $page сразу после нажатия ссылки

skynet-mfd 04.03.2013 15:51

чет не совсем понятный show.php, тут курить его надо...

это ято такое data: "&page=<?=intval($_GET['page'])?>",

VEGA 04.03.2013 16:02

Цитата:

Сообщение от skynet-mfd (Сообщение 238674)
чет не совсем понятный show.php, тут курить его надо...

это ято такое data: "&page=<?=intval($_GET['page'])?>",

это я переношу номер страницы в get запросе... чтобы в show.php знать какую страницу выводить..

как сделать так чтобы переключались страницы без перезагрузки страницы.. чтобы в файле show.php менялась переменная $page сразу после нажатия ссылки.. ?

skynet-mfd 04.03.2013 16:05

у тебя на одной странице по одному сообщению?

skynet-mfd 04.03.2013 16:08

по идее номер текущей страницы должен вычисляться в самом show.php и уже передаваться клиенту как факт, где гарантия что страница вообще должна переключиться

skynet-mfd 04.03.2013 16:12

мы вот тут пишем до сих пор на первой стрице

VEGA 04.03.2013 16:12

Цитата:

Сообщение от skynet-mfd (Сообщение 238681)
по идее номер текущей страницы должен вычисляться в самом show.php и уже передаваться клиенту как факт, где гарантия что страница вообще должна переключиться

он там и вычисляется..
но а если юзер переключает страницу ? нажимает на ссылку "Следующая страница" ?

впинципе это ерунда.. с эти разберусь

мне главное понять как менять страницу без перезагрузки

skynet-mfd 04.03.2013 16:38

мм если я правильно понял попробуй так
добавь id для простоты, и сделай якорь а не параметр к php
<a id="next_page" href="#page=2">Следующая страница</a>
потом привяжи событие клика
$("#next_page").live("click",function({
     var num_page = $(this).attr('href').substr(7);
     show_messages(num_page);
}));


как то так :)

VEGA 07.03.2013 03:57

Цитата:

Сообщение от skynet-mfd (Сообщение 238692)
мм если я правильно понял попробуй так
добавь id для простоты, и сделай якорь а не параметр к php
<a id="next_page" href="#page=2">Следующая страница</a>
потом привяжи событие клика
$("#next_page").live("click",function({
     var num_page = $(this).attr('href').substr(7);
     show_messages(num_page);
}));


как то так :)

так вообще не работает.. можно пожалуйста пример ? чтобы я просто адаптировал под свой скрипт

VEGA 07.03.2013 13:52

нашел вот такую функцию

function jQuery_pager($rpp, $count, $href, $opts = array(),$jQuery) {
	$pages = ceil($count / $rpp);

	if (!isset($opts['lastpagedefault']))
		$pagedefault = 0;
	else {
		$pagedefault = floor(($count - 1) / $rpp);
		if ($pagedefault < 0)
			$pagedefault = 0;
	}

	if (isset($_GET['page'])) {
		$page = 0 + (int) $_GET['page'];
		if ($page < 0)
			$page = $pagedefault;
	}
	else
		$page = $pagedefault;

	$pager = "<td class=\"pager\">Страницы:</td><td class=\"pagebr\">&nbsp;</td>";
	$pager2 = "";
	$bregs = "";

	$mp = $pages - 1;
	$as = "<b>«</b>";
	if ($page >= 1) {
        $onClick_prew = 'onclick="SE_Pager(\''.(int)$_GET['id'].'\',\''.($page - 1).'\',\''.$jQuery.'\');return false;"';
		$pager .= "<td class=\"pager\">";
		$pager .= "<a ".$onClick_prew." style=\"text-decoration: none;cursor:pointer;\">$as</a>";
		$pager .= "</td><td class=\"pagebr\">&nbsp;</td>";
	}

	$as = "<b>»</b>";
	if ($page < $mp && $mp >= 0) {
		$onClick_next = 'onclick="SE_Pager(\''.(int)$_GET['id'].'\',\''.($page + 1).'\',\''.$jQuery.'\');return false;"';
		$pager2 .= "<td class=\"pager\">";
		$pager2 .= "<a ".$onClick_next." style=\"text-decoration: none;cursor:pointer;\">$as</a>";
		$pager2 .= "</td>$bregs";
	} else
		$pager2 .= $bregs;

	if ($count) {
		$pagerarr = array();
		$dotted = 0;
		$dotspace = 3;
		$dotend = $pages - $dotspace;
		$curdotend = $page - $dotspace;
		$curdotstart = $page + $dotspace;
		for ($i = 0; $i < $pages; $i++) {
			if (($i >= $dotspace && $i <= $curdotend) || ($i >= $curdotstart && $i < $dotend)) {
				if (!$dotted)
				   $pagerarr[] = "<td class=\"pager\">...</td><td class=\"pagebr\">&nbsp;</td>";
				$dotted = 1;
				continue;
			}
			$dotted = 0;
			$start = $i * $rpp + 1;
			$end = $start + $rpp - 1;
			if ($end > $count)
				$end = $count;

			 $text = $i+1;
			if ($i != $page){
			    $onClick    = 'onclick="SE_Pager(\''.(int)$_GET['id'].'\',\''.$i.'\',\''.$jQuery.'\');return false;"'; 
				$pagerarr[] = "<td class=\"pager\"><a ".$onClick." title=\"$start&nbsp;-&nbsp;$end\"  style=\"text-decoration: none;cursor:pointer;\"><b>$text</b></a></td><td class=\"pagebr\">&nbsp;</td>";
			}else{
				$pagerarr[] = "<td class=\"highlight\"><b>$text</b></td><td class=\"pagebr\">&nbsp;</td>";
			}
				  }
		$pagerstr = join("", $pagerarr);
		$pagertop = "<table class=\"main\"><tr>$pager $pagerstr $pager2</tr></table>\n";
		$pagerbottom = "Всего $count на $i страницах по $rpp на каждой странице.<br /><br /><table class=\"main\">$pager $pagerstr $pager2</table>\n";
	}
	else {
		$pagertop = $pager;
		$pagerbottom = $pagertop;
	}

	$start = $page * $rpp;

	return array($pagertop, $pagerbottom, "LIMIT $start,$rpp");
}


она для другого движка
кто-то понимает как ее можно прикрутить ?


Часовой пояс GMT +3, время: 02:30.