same data inserting twice in xampp mysql
Question
I am using PHP 5.6.30 version..when I try to execute the following code data is inserted twice.i am using register.php as view and app.js for http post service.
insert.php (database connection)
<?php
$connect = mysqli_connect("localhost", "root", "","user");
$data = json_decode(file_get_contents("php://input"));
$first_name = mysqli_real_escape_string($connect, $data->firstname);
$last_name = mysqli_real_escape_string($connect, $data->lastname);
$user_name = mysqli_real_escape_string($connect, $data->username);
$emailid = mysqli_real_escape_string($connect,$data->emailid);
$password = mysqli_real_escape_string($connect,$data->password);
$mobile = mysqli_real_escape_string($connect,$data->mobile);
$query = "INSERT INTO register(fname,lname,uname,email,pass,mobile)
VALUES ('$first_name','$last_name','$user_name','$emailid','$password','$mobile')";
$result = mysqli_query($connect, $query) ;
if($result == TRUE)
{
echo "Data Inserted...";
}
else
{
echo 'Error';
}
?>
register.php:
enter code here
<html>
<head><title>Nav</title>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
</script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-
route.js"></script>
<link rel="stylesheet" type="text/css" href="css/header.css"/>
<script src="app.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="RegisterController">
<form ng-submit="rsubmit()" class="rform">REGISTER
<input type="text" class="form-control" name="firstname" ng-
model="firstname" placeholder="firstnamesss" ><br>
<input type="text" class="form-control" name="lastname" ng-
model="lastname" placeholder="lastname" ><br>
<input type="text" class="form-control" name="username" ng-model="username" placeholder="username"><br>
<input type="text" class="form-control" name="emailid" ng-model="emailid" placeholder="emailid" ><br>
<input type="text" class="form-control" name="password" ng-model="password" placeholder="password" required=""/><br>
<input type="text" class="form-control" name="mobile" ng-model="mobile" placeholder="mobileno" ><br>
<button ng-click="rsubmit()" >Register</button>
<a href="#/home">Cancel</a>
<br></h2>
</form>
</div>
</body>
</html>
app.js:
var app = angular.module('myApp', ['ngRoute']);
app.controller('RegisterController',function($scope,$http){
$scope.rsubmit=function(){
$http.post("insert.php" ,{
'firstname':$scope.firstname,
'lastname':$scope.lastname,
'username':$scope.username,
'emailid':$scope.emailid,
'password':$scope.password,
'mobile':$scope.mobile,
} )
.success(function(data){
alert(data);
$scope.firstname = null;
// $scope.lastname = null;
});
}
});
2 answers
solution1
0 ACCPTED 2017-05-15 08:39:26
From the documentation :
Warning: Be careful not to cause "double-submission" by using both the ngClick and ngSubmit handlers together. See the form directive documentation for a detailed discussion of when ngSubmit may be triggered.
In your code you use both ng-submit and ng-click , so you trigger the controller (the request) twice. Just remove the ngClick attribute on the button/ input field and it should work.
solution2
0 2017-05-15 08:56:43
Just remove the ng-click from the button..Button used inside the form always submit the form..So you call the rsubmit function when click the button at same time when you click the button the form is going to submission.The form submission call again the rsubmit function..
Two types of ways for it 1. <button type="button" ng-click="rsubmit()" >Register</button> - It disable the form submission power of button when you use type="button" (or) 2.Skip the action attribute from the form.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.