mardi 3 novembre 2015

Update Individual MySQL Records on Checkbox Click with AngularJS

I am creating a golf tournament check-in app and want to be able to update an individual record in the MySQL database when a checkbox is clicked. So, when someone checks in they click the checkbox by their name and I want it to then update the database record of that person (the checked in column set to 1 for the specific id of the person) so that others can see that the person is checked in almost immediately.

I am not sure how to get both the id and the checkedin value to update only the affected record when a checkbox is clicked.

app.js

var checkinApp = angular.module('checkinApp', []);

checkinApp.controller('checkinController', function($scope, $http, $location, $anchorScroll) {

$http.get('lib/api.php').success(function(data) {
    $scope.checkindata = data;
});


$scope.processForm = function(checkedindata) {
    $http.post('lib/process.php', { gid : checkedindata.gid, checkedin : checkedindata.checkedin })
      .then(function(data) {
        console.log(data);
       })
  };

});

HTML/Output

<table class="table table-striped table-responsive">
    <tbody>
                <tr>
                    <th>Checked In</th>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Company</th>
                    <th>Starting Hole</th>
                </tr>
                <tr ng-repeat="item in checkindata">
                    <td><input type="checkbox" name="checkedin" ng-model='checkedin' ng-change='processForm(checkedindata)' ng-checked="item.checkedin == 1"/></td>
                    <td>{{item.fname}}</td>
                    <td>{{item.lname}}</td>
                    <td>{{item.cname}}</td>
                    <td>{{item.hole}}</td>
                </tr>
    </tbody>
</table>

process.php

<?php
require_once('../includes/cred.php');


$checkedin = $_POST['checkedin'];

$sth = $dbh->prepare("UPDATE golfers SET checkedin=$checkedin");
$sth->execute();

DB Table DB Table

Output Output




Aucun commentaire:

Enregistrer un commentaire