堆栈内存溢出
  简体   繁体   English

如何根据复选框更新数据库值？ jQuery的/ PHP的/阿贾克斯

[英]How to update database value based on checkbox? Jquery/php/ajax

 原文  2018-03-25 05:34:57  2   2    php/ jquery/ mysql/ ajax/ checkbox

问题描述

Been trying for hours trying to figure this out but not getting anywhere. 尝试了几个小时试图解决这个问题，但是却一无所获。

I am using labels as a checkbox. 我正在使用标签作为复选框。 On check a checkbox, I would like the value of the database to be updated to 1. If the user unchecks the checkbox, I would like the value in the database to be update to 0. 在选中一个复选框时，我希望将数据库的值更新为1。如果用户取消选中该复选框，我希望将数据库中的值更新为0。

This is the page: 这是页面： 

 <!DOCTYPE html> <html> <head> <title>Territory</title> <meta charset="UTF-8"> <link rel="stylesheet" type="text/css" href="css/style.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <?php require_once 'config.php'; $sql = "SELECT id, address, suburb, lat, lng, date, time FROM addresses"; $result = $conn->query($sql); echo '<table style="margin:0 auto; max-width:320px;"> <tr> </tr>'; if ($result->num_rows > 0) { // output data of each row while($row = $result->fetch_assoc()) { echo '<tr> <td><span style="font-weight:bold;">'.$row["address"].' '. $row["suburb"].'</span> <button style="float:right;" type="button">Go</button><br><br> <div class="row"> <input type="checkbox" name="id" id="home['. $row["id"].']" value="1"/> <label class="label" for="home['. $row["id"].']" id="home['. $row["id"].']"></label> <span id="dropdown"> <select class="dropdown1" name="nhd1" id="'. $row["id"].'" > <option></option> <option>Mon</option> <option>Tue</option> <option>Wed</option> <option>Thu</option> <option>Fri</option> <option>Sat</option> <option>Sun</option> </select> <select class="dropdown2" name="nht1" id="'. $row["id"].'" > <option></option> <option>8:00am</option> <option>8:30am</option> <option>9:00am</option> <option>9:30am</option> <option>10:00am</option> <option>10:30am</option> <option>11:00am</option> <option>11:30am</option> <option>12:00pm</option> <option>12:30pm</option> <option>1:00pm</option> <option>1:30pm</option> <option>2:00pm</option> <option>2:30pm</option> <option>3:00pm</option> <option>3:30pm</option> <option>4:00pm</option> <option>4:30pm</option> <option>5:00pm</option> <option>5:30pm</option> <option>6:00pm</option> <option>6:30pm</option> <option>7:00pm</option> <option>7:30pm</option> </select> <select class="dropdown1" name="nhd2" id="'. $row["id"].'" > <option></option> <option>Mon</option> <option>Tue</option> <option>Wed</option> <option>Thu</option> <option>Fri</option> <option>Sat</option> <option>Sun</option> </select> <select class="dropdown2" name="nht2" id="'. $row["id"].'" > <option></option> <option>8:00am</option> <option>8:30am</option> <option>9:00am</option> <option>9:30am</option> <option>10:00am</option> <option>10:30am</option> <option>11:00am</option> <option>11:30am</option> <option>12:00pm</option> <option>12:30pm</option> <option>1:00pm</option> <option>1:30pm</option> <option>2:00pm</option> <option>2:30pm</option> <option>3:00pm</option> <option>3:30pm</option> <option>4:00pm</option> <option>4:30pm</option> <option>5:00pm</option> <option>5:30pm</option> <option>6:00pm</option> <option>6:30pm</option> <option>7:00pm</option> <option>7:30pm</option> </select> </span> </div> <input style="width:98.5%; margin-top:5px;" type="text" name="notes" placeholder="Add note"> <br><br> </td> <td> </td> </tr>'; echo '</div>'; } } else { echo "0 results"; } echo '</table>'; $conn->close(); ?> <script> $(document).ready(function(){ $('input[type="checkbox"]').click(function(){ var home = 0; if ($('input[type="checkbox"]').is(":checked")) { var home = 1; } var id = $(this).val(); $.ajax({ url:"updateaddress.php", method:"POST", data:{home:home,id:id,}, success: function(data){ alert(data); }, }); }); }); $(document).ready(function(){ $('select[name=nhd1]').change(function(){ var nhd1 = $(this).val(); var id = $(this).attr('id'); $.ajax({ url:"updateaddress.php", method:"POST", data:{nhd1:nhd1,id:id,}, }); }); }); $(document).ready(function(){ $('select[name=nhd2]').change(function(){ var nhd2 = $(this).val(); var id = $(this).attr('id'); $.ajax({ url:"updateaddress.php", method:"POST", data:{nhd2:nhd2,id:id,}, }); }); }); //learn to refresh page just in case more than one group working on map </script> 

      echo '<tr>

      <td><span style="font-weight:bold;">'.$row["address"].' '. $row["suburb"].'</span> <button style="float:right;" type="button">Go</button><br><br>


    <div class="row">
        <input type="checkbox" name="home['. $row["id"].']" id="home['. $row["id"].']" value="1"/>
        <label class="label" for="home['. $row["id"].']" id="home['. $row["id"].']"></label>

    </div>
        <input style="width:98.5%; margin-top:5px;" type="text" name="notes" placeholder="Add note">
        <br><br>
      </td>
      <td>

      </td>


    </tr>';
echo '</div>';


<script>

$(document).ready(function(){
   $('input[type="checkbox"]').click(function(){

       if ($('input[type="checkbox"]').is(":checked")) {
           var home = 1;
           var id = $(this).attr('id');
        $.ajax({
             url:"updateaddress.php",
             method:"POST",
             data:{home:home,id:id,},
       }

        });
   });
});

</script>

This is the query: 这是查询： 

<?php
// Include config file
require_once 'config.php';

$id = mysqli_real_escape_string($conn, $_POST['id']);
$home = mysqli_real_escape_string($conn, $_POST['home']);
$nhd1 = mysqli_real_escape_string($conn, $_POST['nhd1']);
$nht1 = mysqli_real_escape_string($conn, $_POST['nht1']);
$nhd2 = mysqli_real_escape_string($conn, $_POST['nhd2']);
$nht1 = mysqli_real_escape_string($conn, $_POST['nht2']);

if(isset($_POST["home"])) {
  $sql = "UPDATE addresses SET home='$home' WHERE id=$id";
  if($conn->query($sql) === TRUE){

    } else {
      echo "error" . $sql . "<br>".$conn->error;
    }
  }

2 个解决方案

解决方案1
 0  2018-03-25 05:44:28

Create another input checkbox with same name and value of 0. If you don't click the checkbox, it will return the input box with same name and value of 0 or otherwise it will return value of 1. 创建另一个具有相同名称和值0的输入复选框。如果不单击该复选框，它将返回具有相同名称和值0的输入框，否则将返回值1。 

<input type="checkbox" name="home['. $row["id"].']" id="home['. $row["id"].']" value="1"/>
<input type="hidden" name="home['. $row["id"].']" id="home['. $row["id"].']" value="0"/>

解决方案2
 0  2018-03-25 06:09:10

In the below code block, there was problem with your checkbox id not correctly set, as well as its value. 在下面的代码块中，您的复选框ID及其值设置不正确存在问题。 I fixed it with: 我用以下方法修复了它： 

echo '<tr>

      <td><span style="font-weight:bold;">'.$row["address"].' '. $row["suburb"].'</span> <button style="float:right;" type="button">Go</button><br><br>


    <div class="row">
        <input type="checkbox" name="id" id="id" value="'.$row["id"].'"/>
        <label class="label" for="home['. $row["id"].']" id="home['. $row["id"].']"></label>

    </div>
        <input style="width:98.5%; margin-top:5px;" type="text" name="notes" placeholder="Add note">
        <br><br>
      </td>
      <td>

      </td>


    </tr>';
echo '</div>';

You have syntax errors in your JQuery script. 您的JQuery脚本中有语法错误。 They're fixed. 他们是固定的。 Also you're not setting home = 0 when uncheck happens. 当取消选中时，您也不会将home设置为0。 And you don't check for status response from server. 并且您不检查服务器的状态响应。 I added that as well. 我也添加了。

Try this: 尝试这个： 

<script>

$(document).ready(function(){
   $('input[type="checkbox"]').click(function(){
        var home = 0;

       if ($('input[type="checkbox"]').is(":checked")) {
            var home = 1;
       }

        var id = $(this).val();
        $.ajax({
             url:"updateaddress.php",
             method:"POST",
             data:{home:home,id:id,},
             success: function(data){
                alert(data);
            },
       });

   });
});

</script>

In your updateaddress.php, I added an status output to notify you of successful update. 在您的updateaddress.php中，我添加了状态输出以通知您更新成功。

Change to: 改成： 

<?php
require_once 'config.php';

print_r( $_POST );

$id = mysqli_real_escape_string($conn, $_POST['id']);
$home = mysqli_real_escape_string($conn, $_POST['home']);
$nhd1 = mysqli_real_escape_string($conn, $_POST['nhd1']);
$nht1 = mysqli_real_escape_string($conn, $_POST['nht1']);
$nhd2 = mysqli_real_escape_string($conn, $_POST['nhd2']);
$nht1 = mysqli_real_escape_string($conn, $_POST['nht2']);

if(isset($_POST["home"])) {
  $sql = "UPDATE addresses SET home='$home' WHERE id=$id";
  if($conn->query($sql) === TRUE){
    echo "Success";
    } else {
      echo "error" . $sql . "<br>".$conn->error;
    }
  }

?>

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 AJAX / jQuery / PHP / MySQL - 如何更新数据库 - AJAX / jQuery / PHP / MySQL - how to update a database 使用PHP / jQuery / Ajax完成编辑后，更新数据库中的值 - Update value in the database when done editing using PHP/jQuery/Ajax 如何通过使用jQuery Ajax单击以传递PHP复选框值 - how to pass checkbox value by click to php using jquery ajax 如何从PHP中的数据库获取复选框值以获取更新数据？ - how to get checkbox value from database in php for update data? 如何基于PHP中的数据库值显示选中的复选框 - how to show checked checkbox based on database value in php 通过ajax，php，jquery传递复选框的值 - Pass the value of checkbox via ajax, php, jquery 取消选中jquery中复选框的值（使用ajax和php） - Uncheck value for checkbox in jquery (with ajax and php) 如何通过检查Ajax或php中的文本框值来更新数据库值 - How to update database value by checking textbox value in ajax or php PHP复选框设置为基于数据库值进行检查 - PHP checkbox set to check based on database value PHP和jQuery使用复选框值更新文本框 - PHP and jQuery update textbox with checkbox value
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM