Переменная увеличения / уменьшения на кнопке — PHP Javascript

#javascript #php #onclick #increment #decrement

#javascript #php #onclick #увеличение #уменьшение

Вопрос:

У меня есть кнопка «нравится / не похоже» и поле «Количество лайков», и оно отображает переменную, которая получает количество лайков следующим образом:

PHP-HTML:

 <span>likes: <?php echo $row['likes'];?></span>
<button type="submit"  class="btn btn-custom btn-sm liketoggle" name ="like">

//Printing 'Like' if its been liked by user, and 'Unlike' if not liked by user
<? $qid = $row['Question_ID']; $query2 = "SELECT * FROM likes WHERE 
       user_id='$user_id' and qid = '$qid'";
      $results2 = mysqli_query($con,$query2);
      if(mysqli_num_rows($results2) == 0){ echo '<span>Like</span>';} 
      else{echo '<span>Unlike</span>';}?></button>
  

Javascript — Для переключения типа «нравится» / «не похоже»:

 $(".liketoggle").click(function () {
            $(this).find("span").text(function(i, v){
               return v === 'Like' ? 'Unlike' : 'Like'
               return v === 'Unlike' ? 'Like' : 'Unlike'
            })
        });
  

Есть ли способ увеличить количество лайков ($ row [‘likes’]), когда пользователь нажимает «Нравится», и таким же образом уменьшается, когда не нравится?

Комментарии:

1. Добро пожаловать в SO. Короче говоря, нет. Вы пытаетесь смешать код на стороне сервера и js-код. Вам нужно было бы отправить новую переменную на сервер, чтобы она отображала новую страницу, или вы могли бы реализовать ajax или что-то динамическое в этом роде. лучшим подходом было бы создать конечную точку rest, чтобы вы могли вызывать ее в любое время, когда захотите увеличить или уменьшить значение.

2. AJAX — довольно широкая тема, но основы довольно просты с jQuery. Найдите $.post информацию о том, что вам нужно сделать. Используйте AJAX и загляните в JSON и json_decode для получения дополнительной информации на стороне сервера. JSON — это просто объектная нотация JavaScript. По сути, это способ кодирования структурированных данных, чтобы их можно было передавать в запросе we на сервер и обратно при использовании AJAX. JSON в основном заменяет X в AJAX (асинхронность JavaScript и XML), но вряд ли кто-то использует XML в наши дни. XML, как и JSON, является способом передачи структурированных данных, но он больше похож на HTML (HTML является производным от XML)

3. Плюс AJAX звучит лучше, чем AJAJ … lol. Не бойтесь публиковать другой вопрос или искать AJAX на страницах stack overflow, если вы застряли. Когда вы перейдете к ее обновлению, вы можете сделать что-то вроде этого REPLACE INTO likes SET like=0 WHERE question_id=? AND user_id=? с помощью replace, вам не нужно выбирать между insert и update, если ваши строки уникальны. dev.mysql.com/doc/refman/8.0/en/replace.html

4. AJAX выполняет свою работу, обновляя лайки в базе данных, но количество лайков остается неизменным во внешнем интерфейсе, и я хочу, чтобы это число увеличивалось без обновления страницы. @ArtisticPhoenix

5. Как я могу использовать $.post в этом случае? @ArtisticPhoenix

Ответ №1:

Вы можете использовать js для изменения числа.

 <span>likes: <span class="likes-count"><?php echo $row['likes'];?></span></span>
<button type="submit"  class="btn btn-custom btn-sm liketoggle" name ="like">

//Printing 'Like' if its been liked by user, and 'Unlike' if not liked by user
<?php $qid = $row['Question_ID']; $query2 = "SELECT * FROM likes WHERE 
       user_id='$user_id' and qid = '$qid'";
      $results2 = mysqli_query($con,$query2);
      if(mysqli_num_rows($results2) == 0){ echo '<span>Like</span>';} 
      else{echo '<span>Unlike</span>';}?></button>
  

JS:

 $(".liketoggle").click(function () {

            $(this).find("span").text(function(i, v){
               return v === 'Like' ? 'Unlike' : 'Like'
               return v === 'Unlike' ? 'Like' : 'Unlike'
            });

            var likes = $('.likes-count').text();
                likes = likes ? parseInt(likes) : 0;

             if($(this).find("span").text() == 'Like') likes  ;
             else if(likes > 0) likes--;

             $('.likes-count').text(likes);

        });
  

Комментарии:

1. Увеличивающие десятичные числа и не увеличивающиеся на 1. Пожалуйста, сообщите.

2. Вы должны знать, какое число является like , чтобы использовать мой метод. В противном случае вам нужно будет выполнить вызов ajax для вычисления лайков перед их печатью.

3. Как это возможно с AJAX? Я не очень знаком с AJAX, как я могу вызвать это в моем случае?