How to Insert data Angularjs to php


insert data anglarjs

Controller :

App.controller('AppuserController', ['$scope', '$http', '$state', 'toaster', '$timeout', function($scope, $http, $state, toaster, $timeout) {
var notestoaster = {
type: 'success',

};
// bind here all data from the form
$scope.account = {};
// place the message if something goes wrong
//$scope.authMsg = '';
var data = {'type': notestoaster.type};
$scope.login = function() {
// $scope.authMsg = '';

if ($scope.registerForm.$valid) {

$http
.post('app/api/phpfiles/appuser.php', {username: $scope.username,email:$scope.email,role: $scope.role, password: $scope.password, type: $scope.type, })
.then(function(response) {
response = response.data;
if (data != "")
{
//alert( response.type);
toaster.pop(response.type, notestoaster.title, response.response);
$timeout(function() {

$state.go('app.dashboard1');

}, 2000);
}
// assumes if ok, response is an object with some data, if not, a string with error
// customize according to your api
// if ( (response['account']==undefined) )
//{
//$scope.authMsg = 'Incorrect credentials.';

//      }else{

//    }  
//   }, function(x) {$scope.authMsg = 'Server Request Error';
});
}
else {
// set as dirty if the user click directly to login so we show the validation messages
$scope.registerForm.account_email.$dirty = true;
$scope.registerForm.account_password.$dirty = true;
}
};
}]);

Html Code :

<div class="col-lg-6" ng-controller="AppuserController">
         <form name="registerForm" ng-submit="login()"  novalidate="" class="form-validate" method="post">
            <!-- START panel-->
            <div class="panel panel-default">
               <div class="panel-heading">
                  <div class="panel-title">Create APP User</div>
               </div>
               <div class="panel-body">
                  <div class="form-group">
                     <label class="control-label">User name *</label>
                    <input id="username" type="text" name="username" ng-model="username" ng-pattern="/^[a-zA-Z0-9]{6,24}$/" class="form-control" />
                     <span ng-show="registerForm.username.$dirty &amp;&amp; registerForm.username.$error.pattern" class="text-danger">Username should be greater then six character and less then 24 character</span>
                  </div>
                  <div class="form-group">
                     <label class="control-label">Email (optional)</label>
                    <input id="email" type="email" name="email" ng-model="email" ng-pattern="" class="form-control" />
                     <span ng-show="registerForm.email.$dirty &amp;&amp; registerForm.email.$error.pattern" class="text-danger">Invalid Email</span>
                  </div>
                  <div class="form-group">
                     <label class="control-label">Password *</label>
                     <input id="id-password" type="password" name="password" ng-model="password" ng-pattern="/^\w{8,24}$/" class="form-control" />
                     <span ng-show="registerForm.password.$dirty &amp;&amp; registerForm.password.$error.pattern" class="text-danger">Password greater then eight characters</span>
                  </div>
                  <div class="form-group">
                     <label class="control-label">Confirm Password *</label>
                     <input type="password" name="confirm_match" required="" ng-model="password2" ui-validate="'$value==password'" ui-validate-watch="'validator.password1'" class="form-control" />
                     <span ng-show="registerForm.confirm_match.$dirty &amp;&amp; registerForm.confirm_match.$error.validator" class="text-danger">Password does Not match</span>
                  </div>
                  <div class="form-group">
                    <label class="control-label">Select *</label>
                         <select name="role" required="" ng-model="role" class="form-control">
                            <option value="">Select</option>
                            <option value="admin" name="role">Admin</option>
                            <option value="manager" name="role">Manager</option>
                            <option value="datauser" name="role">Data user</option>
                         </select>
                   </div>
                  <div class="required">* Required fields</div>
               </div>
               <div class="panel-footer">
                  <div class="clearfix">                
                     <div class="pull-right">
                        <button type="submit" class="btn btn-primary">Create</button>
                     </div>
                  </div>
               </div>
            </div>
            <!-- END panel-->
         </form>
      </div>
    </div>


PHP API Code :

<?php
class createappuser {

private $conn;

function __construct(){
$type='error';
$response='';

if (!isset($_SESSION)) {

            session_start();
        }

require_once 'dbconnect.php';

//opening db connection

$db = new dbconnect();

$this->conn = $db->connect();

}

/**
*Creating new record
*/

public function appuser(){
try {

$d=file_get_contents("php://input");
   $d=json_decode($d);
$username=$d->username;
$email=$d->email;
$role =$d->role;
$password =base64_encode($d->password);

     $sql = $this->conn->prepare("insert into `tbl_user`(username,email,role,password) VALUES(:username,:email,:role,:password)");
$success = $sql->execute(array(':username' => $username,':email' =>$email, ':role' => $role, ':password' => ($password)));
 
if($success)
 {
$type='success';
$response= 'App User Created Successfully';
}
else
{
$type='error';
$response= "Duplicate Entry. Please Try Again ";
}

 print_r (json_encode(array('account'=>array('username'=>$username,'role'=>$role,'password'=>$password,),'type'=>$type,'response'=>$response)));
 
   exit();
}

catch(PDOExecption $e)
{
echo 'ERROR' .$e->getMessage();
}
}
}
$appuser = new createappuser();
$appuser->appuser();

?>




How to Insert data Angularjs to php Dev2Tricks 5 of 5
Controller : App.controller('AppuserController', ['$scope', '$http', '$state', 'toaster', ...

Share this

Related Posts

Previous
Next Post »