В чем ошибка AJAX или PHP?

Друзья, всем привет!

Задача следующая: сделать вывод постов по 3 штуки с помощью AJAX через кнопку "Далее".

Проблемы: 1) видимо, у меня с руками; 2) я не работал до этого с jQuery и AJAX и совсем чуть-чуть работал с JS; 3) при нажатии на "Далее" скриптом beforSend срабатывает, а вот ответа от succes нет.

На примере попроще у меня все заработало, поэтому предполагаю, что дело в файле-обработчике PHP.

Что имеем:

Вот такой у меня HTML там же JS и там же PHP:

<?php
	session_start();
	$user_id = $_SESSION['id'];
?>
<!DOCTYPE html>
<html>
<head>
	<title>Blog</title>
	<meta charset = 'utf-8'>
	<!--<meta name="viewport" content="width=device-width, initial-scale=1">-->
	<meta http-equiv="X-UA-Compatible" content="IE=Edge">
	<link rel = 'stylesheet' href = 'css/main.css'>
	<link rel = 'stylesheet' href = 'css/main_blog.css'>
	<script src="js/jquery.js"></script>
	<script>
		function funcBefore() {
			$("#preload").show();
		}
		
		function funcSuccess(content) {
			$("#preload").hide();
			if(content != 0)
			{
				$(".post").append(content);
				start += 3;
			} else
			{
				$("#load_more").hide();
			}
		}
	
		$(document).ready (function() {
			var start = 3;
			$("#load_more").bind("click", function() {
				$.ajax ({
					url: "action.php",
					type: "GET",
					data: ({"start": start}),
					beforeSend: funcBefore,
					success: funcSuccess
				});
			});
		});
	</script>
	<!--[if IE]>
		<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
	<![endif]-->
</head>
<body>
	<div class="wrapper">
	
		<nav>
			<div class = "logo"></div>
			<ul>
		<?php
		
			if($_SESSION['rights'] == 'a' || $_SESSION['rights'] == 'u')
			{
				
				require_once('userpic_load.php');
				echo "<li class = 'auth'><a href = 'profile.php?" . $user_id . "'><img class = 'avatar' src = '$img'>Профиль</a></li>";
				echo "<li class = 'auth_exit' id = 'dropDown'><a href = 'exit.php?$user_id''>Выход</a></li>";
			} else
			{
		?>
				<li><a href = "login.html"><span class = "avatar"></span>Войти|Регистрация</a></li>
		<?php
			}
		?>
				<li><a href = "index.html#aboutme">Обо мне</a></li>
				<li><a href = "blog.php">Блог</a></li>
				<li><a href = "index.html#getintouch">Обратная связь</a></li>
			</ul>
		</nav>
		
		<main>
			<h1>Привет! Добро пожаловать в мой Блог!</h1>
	<?php
		require_once ('main_blog.php');

		foreach($articles as $note):
	?>
			<div class = "information">
	<?php 
		require('count_comments.php');
	?>
				<p><a href = "comments.php?note=<?php echo $note['id'];?>#comments" class = "count_comments"><?php echo $allcomments_num;?> Комментарий</a></p>
				<p>Запись создана: <a href = "comments.php?note=<?php echo $note['id'];?>"><?php echo $note['created'];?></a></p>
			</div>
			<div class = "post">
				<h2><?php echo $note['title'];?></h2>
				<p><?php $note['article'] = mb_substr($note['article'], 0, 650); echo $note['article'] . '...'; ?></p>

				<a href = "comments.php?note=<?php echo $note['id'];?>">Читать дальше</a>
			</div>
				<?php endforeach;?>
				<button id = "load_more">Дальше</button>
				<span id = "preload" style = "display: none;">Загрузка данных...</span>
				
			<div class = "pages">
		<?php
			for($page = 1; $page <= $num_pages; $page++)
			{
				if($page == $current_page)
				{
		?>
					 <a href = "blog.php?page=<?php echo $page;?>" class = "current"><?php echo $page;?></a>
		<?php
				} else
				{
		?>
					<a href = "blog.php?page=<?php echo $page;?>"><?php echo $page;?></a>
		<?php
				}
			}
		?>
			</div>
		</main>
		
		<div class="buffer"></div>
		
	</div>
	
	<footer>
		<p>Изготовлено</p>
	</footer>
</body>
</html>


Вот это файл, который выбирает первые 3 поста из базы:

<?php
	require_once ('blogbd.php');
	
	/*$on_page = 5;
	
	$query  = "SELECT COUNT(*) FROM notes";
	$count_notes = mysqli_query($link, $query);
	$count_records = mysqli_fetch_row($count_notes);
	$count_records = $count_records[0];
	
	$num_pages = ceil($count_records / $on_page);
	$current_page = isset($_GET['page']) ? (int)$_GET['page'] : 1;
	
	if ($current_page < 1)
	{
		$current_page = 1;
	} elseif($current_page > $num_pages)
	{
		$current_page = $num_page;
	}
	
	$start_from = ($current_page - 1) * $on_page;

	$query = "SELECT * FROM notes ORDER BY id DESC LIMIT $start_from, $on_page";*/
	$query = "SELECT * FROM notes ORDER BY id DESC LIMIT 3";
	$select_note = mysqli_query($link, $query);
	$articles = array();
	while($article = mysqli_fetch_array($select_note))
	{
		$articles[] = $article;
	}
?>


А это исправленный обработчик AJAX:

<?php
		include("blogbd.php");
	
	if(isset($_GET["start"])){
			$start = $_GET["start"];
			
		// Получаем 3 статьи, начиная с последней отображенной
		$query = "SELECT * FROM notes ORDER BY id DESC LIMIT $start, 3";
		$select_note = mysqli_query($link, $query);
		if(mysql_num_rows($select_note) > 0){
			$note = mysql_fetch_array($select_note);       
				while($note = mysqli_fetch_array($select_note))
				{
					 $start++;
					 printf("<div class='post'>
					 <h2>%s</h2>
					 <p>%s</p>
					 </div>",$note['title'],$note['article']);
				}
						 sleep(1); //Сделана задержка в 1 секунду чтобы можно проследить выполнение запроса
				}else{
							echo 0; //Если записи закончились
				}
	 }
?>


Есть еще вариант, через JSON, но он тоже не сработал.

Вот что выдает:
069b4c198f1e47788730f0ef7a2c4f1c.PNG
26e1f77fc2f34f16a6133307b7624353.PNG

Самое интересное:

В таком варианте работает:

$(document).ready (function() {
			$("#load_more").bind("click", function() {
				$.ajax ({
					url: "action.php",
					type: "GET",
					data: ({name: "name", number: "number"}),
					beforeSend: funcBefore,
					success: funcSuccess
				});
			});
		});
		
		function funcBefore() {
			$("#preload").show();
			$("#next").hide();
		}
		
		function funcSuccess(content) {
			$("#preload").hide();
			$("#next").show();
			if(content != 0)
			{
				$(".post").append(content);
			} else
			{
				$("#load_more").hide();
			}
		}


include("blogbd.php");
	
	$query = "SELECT * FROM notes ORDER BY id ASC LIMIT 3";
	$select_note = mysqli_query($link, $query);
	while($note = mysqli_fetch_array($select_note))
	{
		$_POST['name'] = $note['title'];
		$_POST['number'] = $note['article'];
	echo	"<div class = 'post'>
					<h2>" . $_POST['name'] . "</h2>
					<p>" . $_POST['number'] . "</p>
				</div>";
	}


Но не понятно как выводить по 3 поста.
  • Вопрос задан
  • 811 просмотров
Пригласить эксперта
Ответы на вопрос 5
@vGrabko99
html, css, js, php, golang, mysql
как минимум в говнокоде. Вам тут не кто его разбирать не будет
Ответ написан
@nelson
Включите на сервере показ ошибок и посмотрите что у вас отдаёт сервер на этот AJAX-запрос (при помощи инструментов веб-разработчика в браузере).
Ответ написан
Комментировать
Ivanq
@Ivanq
Знаю php, js, html, css
Загляните в F12 - вкладка "консоль". Там обычно бывает все, что нужно. Приложите скриншот, пожалуйста. С ошибками.
Ответ написан
axaxa_man
@axaxa_man
web developer
в ajax у вас {
success: funcSuccess }
разве не должно быть что-то вроде
success:funcSuccess(data) раз уж функция funSuccess должна параметр content получать ?
Ответ написан
art1z
@art1z
Программист-многостаночник в EffectiveSoft
Ну так пишет же русским языком 'start' is undefined
start объявлен внутри функции (локальная переменная):
$(document).ready (function() {
      var start = 3;
      ...

и снаружи к ней доступа нет.
Простейшее решение - перенести var start =3; на уровень выше (перед funcSuccess)
Более грамотное - внимательно вкурить https://learn.javascript.ru/first-steps
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы