Envoyer les données saisies d'un formulaire angularJS dans la bdd mysql
Bonjour,
J'ai crée un formulaire avec angularJS et je souhaiterais envoyer dans la base de données les infos saisies par l'utilisateur via ce formulaire. Mais je n'y arrive pas. Aidez-moi merci.
Voici mon formulaire index.html :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
| <!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link href='http://fonts.googleapis.com/css?family=Merriweather:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<!--Controllers----->
<script src="js/controllers/menu.js"></script>
<title>Notre appli</title>
</head>
<body>
<div ng-app="formApp">
<div ng-controller="FormController">
<form action="insert.php" method="Post">
<label class="labelNom" for="Nom">Nom :</label>
<input id="Nom" type="text" class="inputNom" name="Nom" ng-model="Nom" /> <br/><br/>
<label class="labelPrenom" for="Prenom">Prenom :</label>
<input id="Prenom" type="text" class="inputPrenom" name="Prenom" ng-model="Prenom" /><br/><br/>
<label class="labelAge" for="Age">Age :</label>
<input id="Age" type="text" class="inputAge" name="Age" ng-model="Age" /><br/><br/>
<label class="labelMail" for="Email">Email :</label>
<input id="Email" type="email" class="inputmail" name="Email" ng-model="Email" /><br/><br/>
<label class="labePays" for="Pays">Pays :</label>
<SELECT id="Pays" type="pays" class="selectpays" name="pays" ng-model="Pays">
<OPTION>France
<OPTION>Italie
<OPTION>Gabon
</SELECT>
<br/><br/>
<input type="button" value="ajouterPerson" ng-click="insertdata()"/><br/>
</form>
</div>
</div>
</body>
</html> |
Voici mon fichier JS menu.js :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| 'use strict';
var myApp = angular.module('formApp', []);
// On ajoute à notre application un contrôleur FormController
myApp.controller('FormController', function($scope, $http) {
$scope.insertdata = function(){
$http.post('insert.php',{
'nom':$scope.Nom,
'prenom':$scope.Prenom,
'Age':$scope.Age,
'Email':$scope.Email,
'pays':$scope.Pays})
.success(function(data,status, headers, config){
console.log("data inserted Successfully");}).
}
}); |
Voici le fichier qui est sensé traiter les données du formulaire pour les envoyer dans la base insert.php :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
| <?php
$data = json_decode(file_get_contents("php://input"));
$nom=mysql_real_escape_string($data->Nom);
$prenom=mysql_real_escape_string($data->Prenom);
$age=mysql_real_escape_string($data->Age);
$email=mysql_real_escape_string($data->Email);
$pays=mysql_real_escape_string($data->Pays);
mysql_connect("localhost","root"," ");
mysql_select_db("angular");
mysql_query("INSERT INTO angular(nom,prenom,age,mail,pays) VALUES('$nom','$prenom','$age','$email','$pays')");
?> |
