Как отследить выбранный checkbox

Question

Konstantin LazarevApril 4, 2017, 7:49 a.m.

Как отследить выбранный checkbox

<?php
mysqli_set_charset($con, "utf8");
$text=array();
$name=array();
$date=array();
$email=array();
$id=array();

$i=0;
if(mysqli_connect_errno())
{
    echo "Failed".mysqli_connect_error();
}
{
  $query="SELECT text, name, email, date_create, blog_id FROM tbl_comments WHERE moderate=0";
     $result=mysqli_query($con, $query);
     
     $count=mysqli_num_rows($result); // Данная функция определяет количество записей выведенных из таблици
     if($count!=0)
     {
         while($row=mysqli_fetch_array($result))
         {
             $text[$i]=$row['text'];
             $name[$i]=$row['name'];
             $email[$i]=$row['email'];
             $date[$i]=$row['date_create'];
             $id[$i]=$row['blog_id'];
             $i++;
         }   
     }
}
 ?>
 <html>
    <head>
        <title>Модерация комментариев</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">   
    </head>
    <body style="width: 1340px; margin: 0px auto; background: #8fa8a8; font-family: arial;">       
            <div style="width:1340px; background: grey; height:50px;"></div> 
            <?php
            if(count($text)==0)
            {
                echo"<div style='background:white;  line-height: 300px;
 font-size: 40px; width: 1340px; height: 550px; text-align:center;'>Нет сообщений для модерации</div>";
            }
            else
            {
                 echo "<div style='background: blue; width: 1340px; height:50px; border-bottom: 1px solid black;' >
                <div style='background: red; width: 210px; float:left; height: 50px; font-size: 20px; line-height:40px; text-align:center;'>Название статьи</div>
                <div style='background: yellow; width: 110px; float:left; height: 50px; font-size: 20px; line-height:40px; text-align:center;'>Дата</div>
                <div style='background: blue; width: 180px; float:left; height: 50px; font-size: 20px; line-height:40px; text-align:center;'>Email</div>
                <div style='background: yellow; width: 210px; float:left; height: 50px; font-size: 20px; line-height:40px; text-align:center;'>Имя</div>
                <div style='background: orange; width: 510px; float:left; height: 50px; font-size: 20px; line-height:40px; text-align:center;'>Текст сообщения</div>
                 <div style='background: green; width: 120px; float:left; height: 50px; font-size: 20px; line-height:40px; text-align:center;'>Активация</div>
                </div>"; 
                
                for($x=0; $x<count($text); $x++)
                {
                    echo "<div style='width: 1340px; height: 50px; background: white; border-bottom: 1px solid black;'>
                    <div style='background: white; width: 209px; border-right: 1px solid black; float:left; height: 50px; font-size: 12px; line-height:40px; text-align:center;'>$id[$x]</div>
    <div style='background: white; width: 109px; font-size: 10px; border-right: 1px solid black; float:left; height: 50px; line-height:40px; text-align:center;'>$date[$x]</div> 
    <div style='background: white; width: 179px; float:left; border-right: 1px solid black; height: 50px; font-size: 12px; line-height:40px; text-align:center;'>$email[$x]</div>
    <div style='background: white; width: 209px; float:left; height: 50px; font-size: 12px; border-right: 1px solid black; line-height:40px; text-align:center;'>$name[$x]</div>                
     <div style='background: white; width: 509px; float:left; height: 50px; font-size: 12px; border-right: 1px solid black; line-height:40px; text-align:center;'>$text[$x]</div>                
     <div style='background: white; width: 120px; float:left; height: 50px;  line-height:40px; text-align:center;'> <input type='checkbox' name='Tabs' id='Button' style='margin-top:20px;'></div>               
                   
                    </div>";
                }
                echo "<div style='background: white; width: 1340px; height:50px;'>
      <button  type='button' style='margin-top: 10px; width:100px; height: 30px; border: 1px solid blue; margin-left:1230px;'>Активировать</button>            
                </div>";
            }
            ?>
    <div style="width:1340px; background: grey; height:50px;"></div> 
        
    </body>
    
</html>

We recommend hosting TIMEWEB

Stable hosting, on which the social network EVILEG is located. For projects on Django we recommend VDS hosting.

Subscribe to the discussion2

Section subscription6

Do you like it? Share on social networks!

KL

April 4, 2017, 7:50 a.m.

Как отследить какой checkbox был нажат.

April 4, 2017, 8:16 a.m.

Можно к примеру добавить атрибут data-type="checkbox" и навешать на все объекты с этим атрибутом обработчик.

То есть в html это будет выглядеть так:

<input type='checkbox' data-type="checkbox" name='Tabs' id='Button' style='margin-top:20px;'>

А в подключаемом javascript файле обработчик и подключение обработчика будет выглядеть так:

function checkbox_clicked()
{
    console.log($(this)); 
    // $(this) будет объектом, который будет являться чекбоксом, по которому кликнули

    // А здесь уже реализуете логику получения данных с чекбокса

    return false;
}

// Это автоматически подключит обработчик при загрузке javascript файла
$(function() {
    $('[data-type="checkbox"]').click(checkbox_clicked);
});

Обработчик будет подключён ко всем чекбоксам, которые содержат данный атрибут data-type="checkbox" . Естественно, здесь используется jQuery

KL

April 4, 2017, 8:22 a.m.

С помощью php можно что то сделать? Например, динамически присвоить id к checkbox и через метод post?

April 4, 2017, 8:32 a.m.

Да, конечно. У вас же там в цикле создаются чекбоксы. Я так понял, что каждый чекбокс отвечает за конкретный комментарий, который вы модерируете. Можно либо присваивать id, который будет равен Primary Key комментария в базе данных. Либо также добавить атрибут data-id="Primary Key" комментария в базе данных. То есть в PHP помечаете это всё дело Id-шниками. Навешиваете обработчик, как я показал выше в javascript. А когда кликаете по чекбоксам, то кидаете POST AJAX Запрос в сторону сервера. Я сейчас так всякие лайки, дислайки и добавление в избранное переделываю на сайте. Вполне работоспособно.

function checkbox_clicked()
{
    var checkbox = $(this);

    $.ajax({
        url : "/url/to/moderate/comment/",
        type : 'POST',
        data : { 'obj' : checkbox.data('id') }, // Если задано в виде атрибута data-id="125" - 125 - это Primary Key комментария.

        success : function (json) {
        // ToDO comething
        }
    });

    return false;
}

KL

April 4, 2017, 8:38 a.m.

я javascript не знаю. Могу работать только с php. Как будет выглядеть функция обработки нажатия кнопки и проверки checkbox.

April 4, 2017, 9 a.m.

Вот тут такой казус. Я как раз с PHP знаком ровно настолько, насколько необходимо было, чтобы поправить вёрстку и заполнение страниц для Wordpress.

Если принимать POST запрос, то там будут передаваться параметры с id каждого элемента формы и соответствующий статус. В случае с чекбоксом это должно быть true или false (ну или checked, unchecked)

Вот их и нужно растаскивать. Но без понятия, как правильно принимать PHP Post запрос, может если кто-то кто работает с PHP заглянет в тему, то подскажут.

Что касается javascript - то учите его. Если бэкенд может быть разный, то фронтенд - это в основном javascript.

KL

April 4, 2017, 10:22 a.m.

 echo"<form method='post' action='checkboxForm.php'>";
                for($x=0; $x<count($text); $x++)
                {
                     $article=array();
                     $i=0;
                     $query="SELECT name FROM tbl_press WHERE id=$id[$x]";
     $result=mysqli_query($con, $query);
     $count=mysqli_num_rows($result); // Данная функция определяет количество записей выведенных из таблици
     if($count!=0)
     {
         while($row=mysqli_fetch_array($result))
         {
             $article[$i]=$row['name'];
             $i++;
         }   
     }
                    
                    echo "
                    <div style='width: 1340px; height: 50px; background: white; border-bottom: 1px solid black;'>
                    <div style='background: white; width: 209px; border-right: 1px solid black; float:left; height: 50px; font-size: 12px; line-height:40px; text-align:center;'>
                    
                    $article[0]</div>
    <div style='background: white; width: 109px; font-size: 10px; border-right: 1px solid black; float:left; height: 50px; line-height:40px; text-align:center;'>$date[$x]</div> 
    <div style='background: white; width: 179px; float:left; border-right: 1px solid black; height: 50px; font-size: 12px; line-height:40px; text-align:center;'>$email[$x]</div>
    <div style='background: white; width: 209px; float:left; height: 50px; font-size: 12px; border-right: 1px solid black; line-height:40px; text-align:center;'>$name[$x]</div>                
     <div style='background: white; width: 509px; float:left; height: 50px; font-size: 12px; border-right: 1px solid black; line-height:40px; text-align:center;'>$text[$x]</div> 
     <div style='background: white; width: 120px; float:left; height: 50px;  line-height:40px; text-align:center;'> <input type='checkbox' name='checkboxArray[]' value='$idmain[$x]' style='margin-top:20px;'></div>               
                   
                    </div>";
                }
                echo "<div style='background: white; width: 1340px; height:50px;'>
      <button type='submit' name='button' style='margin-top: 10px; width:100px; height: 30px; border: 1px solid blue; margin-left:1230px;'>Активировать</button>            
               </div>";
            }
            echo "</form>";

Форма отсылает данные в файл checkboxForm.php

KL

April 4, 2017, 10:25 a.m.
The answer was marked as a solution.

<?php  
   $aDoor = $_POST['checkboxArray'];
  if(empty($aDoor))
  {
    echo '<meta http-equiv="refresh" content="0; url=http://www.example.com/moderate.php">';
  }
  else
  {
    $N = count($aDoor);
    for($i=0; $i<$N; $i++)
    {
        $con=mysqli_connect("localhost", "*******", "*******", "******");
        $query="UPDATE tbl_comments SET moderate=1 WHERE id=$aDoor[$i]";
     $result=mysqli_query($con, $query);
    }
     echo '<meta http-equiv="refresh" content="0; url=http://example.com">';
  }
?>

Файл обработки формы, с редиректом обратно на страницу.

Как отследить выбранный checkbox

We recommend hosting TIMEWEB

Comments