Лайки через AJAX
 

Всем привет.я вот написал систему лайков для картинок и подскажите почему когда я нажимаю "лайк" на картинку то в ответ мне присылает как бы дубликат этой же страницы?
и все картинки становятся громадными и форма комментариев также дублируется и на страничке их получаются пары.прикреплённые картинки показывают до и после нажатия лайк и на картинке показывает вторую форму.написал код отправки запроса на страницу likeimgs.php которая взаимодействует с ajax методом load.

///здесь код страницы fullscreen.php с формой///

if(isset($_GET['aloneImgcar']) and $_GET['aloneImgcar'] != ""){
    $aloneImgcar = $_GET['aloneImgcar'];
    $mainKey = $_GET['aloneImgcar'];
    $table = "auto";
    $alonekey = 'aloneImgcar=' . $mainKey;
}
if(isset($_GET['aloneImgGirl']) and $_GET['aloneImgGirl'] != ""){
    $aloneImgGirl = $_GET['aloneImgGirl'];
    $mainKey = $_GET['aloneImgGirl'];
    $table = "girls";
    $alonekey = 'aloneImgGirl=' . $mainKey;
}
if(isset($_GET['funimgs']) and $_GET['funimgs'] != ""){
    $funimgs = $_GET['funimgs'];
    $mainKey = $_GET['funimgs'];
    $table = "funny";
    $alonekey = 'funimgs=' . $mainKey;
}
 
$rud = mysql_connect("localhost","sky","111111");
$turnOn = mysql_select_db("pics",$rud);
 
$zapros = mysql_query("SELECT * FROM $table WHERE id=$mainKey");
$background = mysql_fetch_array($zapros);

В качестве значений в input передал переменные(написанные сверху) для передачи их к javascript который будет передавать их скрипту likeimgs.php
Написал отслеживание события клика к type="button" id="submit" для отправки этих скрытых полей с values:

<div class="countLikesandView">
    <form action="likesvideo.php" method="post">
    <input type="hidden" id="ip" name="ip" value="<?php echo $_SERVER['REMOTE_ADDR'];?>">
    <input type="hidden" id="id" name="id" value="<?php echo $mainKey;?>">
    <input type="hidden" id="parametrurl" name="parametrurl" value="<?php echo $alonekey;?>">
    <input type="hidden" id="table" name="table" value="<?php echo $table;?>">
    <input type="button" id="submit" value="liked?">
        <?php 
echo "<span style='color:red;'>" . $background['likers'] . "</span>";
if(!empty($_SESSION['viewed'])){
echo $_SESSION['viewed'];
unset($_SESSION['viewed']); 
}
    ?>
    </form>
    </div>
и типа если будет клик по #submit то подгрузить данные с likeimgs.php
<script type="text/javascript">
$('#submit').click(function(){
var ip = $('#ip').attr('value');
var id = $('#id').attr('value');
var parametrurl = $('#parametrurl').attr('value');
var table = $('#table').attr('value');
$('.backgroundFromfullscreen').load('likeimgs.php', {ip:ip,id:id,parametrurl:parametrurl,table:table});
});
</script>

///конец кода страницы fullscreen.php с формой///

///здесь код страницы likeimgs.php которая сообщает оценена ли картинка и если нет то обновить ячейку таблицы
и затем подгружать количество лайков из этой страницы в страницу fullscreen.php///

$rud = mysql_connect("localhost","sky","111111");
mysql_select_db("pics",$rud);
if(isset($_POST['ip'])){
    $ip = $_POST['ip'];
}
if(isset($_POST['id'])){
    $id = $_POST['id'];
}
if(isset($_POST['parametrurl'])){
    $parametrurl = $_POST['parametrurl'];
}
if(isset($_POST['loadauto'])){
    $loadauto = $_POST['loadauto'];
}
if(isset($_POST['table'])){
    $table = $_POST['table'];
}
 
if($table == 'auto'){
    $ipusersforpics = 'ipusersforauto';
}
if($table == 'girls'){
    $ipusersforpics = 'ipusersforgirls';
}
if($table == 'funny'){
    $ipusersforpics = 'ipusersforgirls';
}
 
 
$myrow3 = mysql_query("SELECT * FROM $ipusersforpics");
$itog3 = mysql_fetch_array($myrow3);
do{
if(isset($itog3['post']) && isset($itog3['ip']) && $itog3['ip'] == $ip && $itog3['post'] == $id){
$_SESSION['viewed'] = "Вы уже оценили эту картинку";
header("location:fullscreen.php?$parametrurl");
exit;
}
}
while($itog3 = mysql_fetch_array($myrow3));
$myrow = mysql_query("SELECT * FROM $table WHERE id='$id'");
$itog = mysql_fetch_array($myrow);
$likers = $itog['likers'] + 1;
$myrow1 = mysql_query("UPDATE $table SET likers='$likers' WHERE id=$id");
$myrow2 = mysql_query("INSERT INTO $ipusersforpics(ip,post) VALUES('$ip','$id')");
$myrow4 = mysql_query("SELECT * FROM $table WHERE id=$id");
$itog4 = mysql_fetch_array($myrow4);
do{
$res = $itog4['likers'];
}
while($itog4 = mysql_fetch_array($myrow4));
 
$_SESSION['viewed'] = "thank you for like";
header("location:fullscreen.php?$parametrurl");
exit;
echo <<< MyObject
<p>{$res}</p>
MyObject;

и как я заметил что то не так с этим тэгом так как оно возвращает значения

<input type="hidden" id="parametrurl" name="parametrurl" value="<?php echo $alonekey;?>">

так как этот тэг несёт в себе адрес страницы в value с именем переменной parametrurl которая отлавливается в likeimgs.php и возвращает результат(оценили картинку или нет)
при помощи PHP

$_SESSION['viewed'] = "Вы уже оценили эту картинку";
header("location:fullscreen.php?$parametrurl");

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

Постарался поподробней объяснить думаю понятно.

Потому, что структура кода неверна. Если асинхронный запрос клиента происходит к файлу источнику, то этот запрос должен обрабатываться и возвращаться ответ до любого вывода в браузер, а код должен завершаться выходом.

PS. Не дубликат у вас, а отправление формы естественным путем и как следствие обновление страницы. Не работает у вас ajax, код неверен. Не $('#submit').click(function() { ... обрабатывать надо, а

$('form').submit(function(e) { 
    e.prevetDefault(); //отменяем отправление формы естественным образом
    //далее код

Но это не отменяет того, о чем сказано выше.

Ну и каков результат? А я ведь не все "странности" отметил, не стал говорить об этом header("location:fullscreen.php?$parametrurl");.

Передача сервером заголовка, это - клиент принял заголовок и обращается по указанному адресу в нем. На JS это будет выглядеть так:

window.location.href = "fullscreen.php?$parametrurl";

хотя конечно тут все и без js произойдет. Но надо понимать, что здесь window, это главное окно. Если образно, то это главное приложение, а Ajax, это будет дочернее приложение, без окна. И дочернее приложение никак не влияет на на главное, ему просто предписано сделать запрос по указанному адресу, а по ответу сообщить об этом главному приложению. Главное приложение получив это сообщение получает ответ и использует его по назначению.

Если сервер ответил на Ajax заголовком header("location: ..."), то дочернее приложение перейдет по указанному адресу, и если по этому адресу код страницы, то ответом и будет эта страница.

Это может быть еще одной причиной бага в вашем коде. Не стал говорить об этом сразу, так как не совсем понятно что вообще творится, ибо exit; и за ним echo <<< MyObject никак не может быть.

И в дополнение - цикл do ... while для разбора ресурса, это вы из какого-то очень дремучего учебника почерпнули, данный цикл вообще тут боком, нужно использовать while. Начиная с версии РНР 5.5 на применение оригинального расширения MySQL вы будете получать ошибку - "расширение устарело ...", а в версии 7.0 оно вообще удалено. Переходите сразу на mysqli или PDO.

laimas,
Привет laimas да и вправду этот exit тут по сути лишнее и он прерывает действие после которого <<< MyObject вообще бесполезен.думаю и думаю что же не так и всё равно пока не могу понять что же может быть аналогом header("location: ...") так,чтобы AJAX не присылал заголовком и чтобы ставилась единица без всяких этих громадных картинок и форм дублирующихся.какое же тогда решение может быть?это только последний шаг который ставит границу перед заливкой сайта на хостинг

Если после асинхронного запроса нужно перенаправить пользователя на другую страницу, то клиенту этот адрес нужно не заголовком передавать, а как данные. На клиенте выполнить js код показанный выше.

И читайте о безопасности:

$table = $_POST['table'];
$id = $_POST['id'];
...
"SELECT * FROM $table WHERE id='$id'"

и др., такое ни в коем случае делать нельзя. Данные пришедшие извне не фильтрованные и без экранирования подставленные в запрос, это просто огромная дыра в безопасности. Кто вас научил оперировать явно в запросах структурой базы данных, именами таблиц как параметрами запроса? Ну разве же так можно.

laimas,
Привет laimas хотел уточнить на счёт последнего сообщения.ты написал клиенту этот адрес нужно не заголовком передавать, а как данные.Как данными передать не понял?можешь чуть поподробней и желательно с кодом написать это а то просто средне знаю систему JS и немного блуждаю в этих понятиях.

Сначала наведите порядок в структуре кода своего, в файлах, а то в этом коде кроме бардака ничего нет. Может и перенаправлять никуда не потребуется?

laimas,
А что нужно чтобы не перенаправлять?какой для этого код вообще существует в JS?попытался всё сделать на одной странице fullscreen.php и убрал header т.е. header("location:fullscreen.php?$parametrurl"); чтобы не перенаправлял
и при нажатии на лайк и в load записал эту же страницу -> load('fullscreen.php', {ip:ip,id:id,parametrurl:parametrurl,table:table}) ;
и опять же картинки большие:
первая картинка до лайка

и вторая после лайка

<script type="text/javascript">
$('#submit').click(function(){
var ip = $('#ip').attr('value');
var id = $('#id').attr('value');
var parametrurl = $('#parametrurl').attr('value');
var table = $('#table').attr('value');
$('.backgroundFromfullscreen').load('fullscreen.php', {ip:ip,id:id,parametrurl:parametrurl,table:table});
});
</script>

<?php include("blocks/footer.php");
$rud = mysql_connect("localhost","sky","111111");
mysql_select_db("pics",$rud);
if(isset($_POST['ip'])){
	$ip = $_POST['ip'];
}
if(isset($_POST['id'])){
	$id = $_POST['id'];
}
if(isset($_POST['parametrurl'])){
	$parametrurl = $_POST['parametrurl'];
}
if(isset($_POST['loadauto'])){
	$loadauto = $_POST['loadauto'];
}
if(isset($_POST['table'])){
	$table = $_POST['table'];
}

if($table == 'auto'){
	$ipusersforpics = 'ipusersforauto';
}
if($table == 'girls'){
	$ipusersforpics = 'ipusersforgirls';
}
if($table == 'funny'){
	$ipusersforpics = 'ipusersforfunny';
}


$myrow3 = mysql_query("SELECT * FROM $ipusersforpics");
$itog3 = mysql_fetch_array($myrow3);

while($itog3 = mysql_fetch_array($myrow3));
$myrow = mysql_query("SELECT * FROM $table WHERE id='$id'");
$itog = mysql_fetch_array($myrow);
$likers = $itog['likers'] + 1;
$myrow1 = mysql_query("UPDATE $table SET likers='$likers' WHERE id=$id");
$myrow2 = mysql_query("INSERT INTO $ipusersforpics(ip,post) VALUES('$ip','$id')");
$myrow4 = mysql_query("SELECT * FROM $table WHERE id=$id");
$itog4 = mysql_fetch_array($myrow4);

?>

и как я заметил этот load('fullscreen.php', {ip:ip,id:id,parametrurl:parametrurl,table:table}) ; с указанием этой же страницы fullscreen.php также выдаёт огромные картинки хотя я и убрал этот
header("location:fullscreen.php?$parametrurl"); но если их убрать вместе с $_SESSION то и в ответ ничего не высылает оценена ли картинка ранее или нет.как-то так.иначе как можно сделать то?у меня уже есть начало это проверка if(isset($itog3['post']) && isset($itog3['ip']) && $itog3['ip'] == $ip && $itog3['post'] == $id)
обновление и занесение лайка:
myrow1 = mysql_query("UPDATE $table SET likers='$likers' WHERE id=$id");
$myrow2 = mysql_query("INSERT INTO $ipusersforpics(ip,post) VALUES('$ip','$id')");
но что-то не сходится вообще.как быть даже не знаю
https://yandex.kz/collections/card/5...3d42696ee6c39/
https://yandex.kz/collections/card/5...3d42696ee6c3a/

Во-первых ваш код дырявый, я уже писал об этом, такого ни в коем случае на сервере быть не должно.

Не перенаправлять, это значит обработчик, к которому производит запрос клиент, выполняет задачу полностью, он и возвращает ответ. Ваш код читать сложно, потому как в нем "мусора" много, непонятных для чего запросов... А mysql_fetch_array возвращает две копии одних и тех же данных, одна как индексный набор, вторая ассоциативный, а оно нужно? В общем все это похоже на какой-то бардак, поэтому и ничего не скажу "как".

laimas,
Привет laimas спасибо хоть немного за помощь за то что открыл мне глаза на настоящий мусор и за то что я должен был навести порядок в структуре кода и это подтолкнула меня разобрать тему get и знаешь я тут уже по настоящему нашёл выход как делать лайки и при том без получения громадных копий картинок и это решение при помощи функции $.get или даже post который я уже освоил и вот он долгожданный код:
//Использовал страницу fullscreen.php//

<form method="post">
	<input type="hidden" id="ip" name="ip" value="<?php echo $_SERVER['REMOTE_ADDR'];?>">
	<input type="hidden" id="id" name="id" value="<?php echo $mainKey;?>">
	<input type="hidden" id="parametrurl" name="parametrurl" value="<?php echo $alonekey;?>">
	<input type="hidden" id="table" name="table" value="<?php echo $table;?>">
	<input type="button" id="submit" value="liked?">
	[PHP]<?php echo "<span style='color:red;'>" . $background['likers'] . "</span>";?>[/PHP]
    <span id="spanget"></span>
</form>

<script type="text/javascript">
$('#submit').click(function(){
var ip = $('#ip').attr('value');
var id = $('#id').attr('value');
var parametrurl = $('#parametrurl').attr('value');
var table = $('#table').attr('value');
$.get('likeimgs.php', {ip:ip,id:id,parametrurl:parametrurl,table:table},function(spanget){
	$('#spanget').text(spanget);
});
});

 </script>

//конец страницы fullscreen.php//

//начало страницы likeimgs.php//

$rud = mysql_connect("localhost","sky","111111");
mysql_select_db("pics",$rud);
if(isset($_GET['ip'])){
	$ip = $_GET['ip'];
}
if(isset($_GET['id'])){
	$id = $_GET['id'];
}
if(isset($_GET['parametrurl'])){
	$parametrurl = $_GET['parametrurl'];
}

if(isset($_GET['table'])){
	$table = $_GET['table'];
}

if($table == 'auto'){
	$ipusersforpics = 'ipusersforauto';
}
if($table == 'girls'){
	$ipusersforpics = 'ipusersforgirls';
}
if($table == 'funny'){
	$ipusersforpics = 'ipusersforfunny';
}


$myrow3 = mysql_query("SELECT * FROM $ipusersforpics");
$itog3 = mysql_fetch_array($myrow3);
do{
if(isset($itog3['post']) && isset($itog3['ip']) && $itog3['ip'] == $ip && $itog3['post'] == $id){
$reply = "Вы уже оценили эту картинку";
echo $reply;
exit;
}
}
while($itog3 = mysql_fetch_array($myrow3));
$myrow = mysql_query("SELECT * FROM $table WHERE id='$id'");
$itog = mysql_fetch_array($myrow);
$likers = $itog['likers'] + 1;
$myrow1 = mysql_query("UPDATE $table SET likers='$likers' WHERE id=$id");
$myrow2 = mysql_query("INSERT INTO $ipusersforpics(ip,post) VALUES('$ip','$id')");

$myrow4 = mysql_query("SELECT * FROM $table WHERE id=$id");
$itog4 = mysql_fetch_array($myrow4);

if($myrow1 and $myrow2 == true){
$reply = "thank you for like";	
echo $reply;
exit;
}

//конец страницы likeimgs.php//

На странице fullscreen.php в теге form создал span чтобы сообщать была ли оценена картинка и если да то на странице likeimgs.php есть переменная $reply и к нему приписал echo для вывода сообщения а если не была оценена картинка то также echo выводит переменную $reply -> $reply = "thank you for like";и всё как надо работает но вот только на странице fullscreen.php в теге form имеется эта запись которая выводит запись из таблицы куда записываются лайки echo "<span style='color:red;'>" . $background['likers'] . "</span>" и проблемка пока в том что цифры стоят на месте(как на картинках в ссылках снизу)и не обновляются асинхронно а остальное как "thank you for like" или "Вы уже оценили эту картинку" работают без ошибок и на должном уровне и остался только последний шаг а именно асинхронно обновлять лайк.как тут быть в этом случае?в function(spanget) в скрипте spanget помогает изымать данные из страницы likeimgs.php и именно поэтому благодаря if else выводятся тексты а как лайки не изымать чтобы они уже обновлялись асинхронно не понимаю.помоги мне плиз.буду очень рад тому что наше решение сработает

https://yandex.kz/collections/card/5...708c8e6b99744/
https://yandex.kz/collections/card/5...708c8e6b99745/