Question

好吧，所以我更改了代码，我想要做的是在表中列出用户，并且当我按下按钮时，每个用户都有一个切换切换按钮（带有CSS的复选框），它将改变数据库中用户是1还是0，具体取决于复选框的值。此时使用2个按钮会更容易，但是我想使用相同的按钮。我已经有了表格，并且正在显示用户，并且状态仅用于测试，单击该复选框似乎并没有保持选中状态，我想知道如何使用该复选框的值，因此可以将其插入到数据库（是的，我必须更改查询）。

UPDATE.PHP

//update.php

include('database_connection.php');

$message = '';

$form_data = json_decode(file_get_contents("php://input"));

$query = "UPDATE tbl_user SET state=1 WHERE id = '".$form_data->id."'";

$statement = $connect->prepare($query);
if($statement->execute())
{
 $message = 'User updated';
}

$output = array(
 'message' => $message
);

echo json_encode($output);

?>

INDEX.PHP

<html>  
    <head>  
        <title>Prueba</title>  
        <link href="StyleCheckBox.css" rel="stylesheet" type="text/css"/>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>  
    </head>  
    <body>  


        <div class="container">  
   <br />
            <h3 align="center">Prueba</h3><br />
   <div class="table-responsive" ng-app="liveApp" ng-controller="liveController" ng-init="fetchData()">
                <div class="alert alert-success alert-dismissible" ng-show="success" >
                    <a href="#" class="close" data-dismiss="alert" ng-click="closeMsg()" aria-label="close">&times;</a>
                    {{successMessage}}
                </div>
                <form name="testform" ng-submit="insertData()">
                    <table class="table table-bordered table-striped">
                        <thead>
                            <tr>
                                <th>State</th>
                                <th>Item</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td><input type="text" ng-model="addData.first_name" class="form-control" placeholder="Enter state" ng-required="true" /></td>
                                <td><input type="text" ng-model="addData.last_name" class="form-control" placeholder="Enter user" ng-required="true" /></td>
                                <td><button type="submit" class="btn btn-success btn-sm" ng-disabled="testform.$invalid">Add</button></td>
                            </tr>
                            <tr ng-repeat="data in namesData" ng-include="getTemplate(data)">
                            </tr>

                        </tbody>
                    </table>
                </form>
                <script type="text/ng-template" id="display">

                    <td>{{data.first_name}}</td>
                    <td>{{data.last_name}}</td>
                    <td>
                        <input type="checkbox" class="toggle-switch" ng-click="deleteData(data.id)">
                    </td>
                </script>

   </div>  
  </div>
    </body>  
</html>  
<script>
var app = angular.module('liveApp', []);

app.controller('liveController', function($scope, $http){

    $scope.formData = {};
    $scope.addData = {};
    $scope.success = false;

    $scope.getTemplate = function(data){
        if (data.id === $scope.formData.id)
        {
            return 'edit';
        }
        else
        {
            return 'display';
        }
    };

    $scope.fetchData = function(){
        $http.get('select.php').success(function(data){
            $scope.namesData = data;
        });
    };

    $scope.insertData = function(){
        $http({
            method:"POST",
            url:"insert.php",
            data:$scope.addData,
        }).success(function(data){
            $scope.success = true;
            $scope.successMessage = data.message;
            $scope.fetchData();
            $scope.addData = {};
        });
    };

    $scope.reset = function(){
        $scope.formData = {};
    };

    $scope.closeMsg = function(){
        $scope.success = false;
    };

    $scope.deleteData = function(id){

            $http({
                method:"POST",
                url:"delete.php",
                data:{'id':id}
            }).success(function(data){
                $scope.success = true;
                $scope.successMessage = data.message;
                $scope.fetchData();
            }); 

    };

});

</script>

如何使用复选框javascript / php将值更新为1或0到数据库？

0 个答案: