Angular js et POST

Bonjour,

Je veux poster des données via un formulaire avec angular js.

Le 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
<div ng-controller="clientCtrl" ng-init="getLocalisations();">
	<form action="#client/list" method="post">
        <div class="input-group col-md-4">
		 <label for="nom">NOM</label>
		  <input type="text" class="form-control" placeholder="Nom du client" aria-describedby="sizing-addon1" 
		  	name="nom" 
		  	required ng-model="client.nom"> 
 
		</div>
		<br/>
		<div class="input-group col-md-4">
		  <label for="contact">Contact</label>
		  <input type="text" class="form-control" placeholder="Contact du client" aria-describedby="sizing-addon1" 
		  	name="contact"  
		  	required  ng-model="client.contact">
 
		</div>
		<br/>
 
		<div class="input-group col-md-4">
		  <label for="localisation">Localisation</label>
		  <select name="localisation" id="localisation" class="form-control" ng-model="client.localisation">
		  	<option ng-repeat="item in localisations" 
	  			ng-selected="client.localisation == item.id" 
	  			ng-value="item.id">
	  			{{item.value}}
		  	</option>
		  </select>		  
		</div>
		<br/>
 
 
		<div>
			<button type="submit" class="btn btn-primary btn-xs" ng-click="addClient()"> Valider</button>
		</div>
	</form>
 
	<!-- ce button me sert juste de test -->
	<button ng-click="addClient()">Bonjour</button>
</div>

Le javascript :

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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
app =angular.module('app-dashbord', ['ngAnimate','ngRoute']);
 
 
app.config(['$routeProvider',function($routeProvider) {
 
	$routeProvider.when('/client/list', {
		templateUrl : 'partials/clients/index.php',
		controller : 'clientCtrl'
	})
	.when('/client/au', {
		templateUrl : 'partials/clients/add.php',
		controller : 'clientCtrl'
	})
	.when('/action',{
		templateUrl : 'partials/action.html',
		controller : 'dashbordCtrl'
	})
	/*.otherwise ({
			redirectTo: '/list'
		});*/
 
}]);
 
app.factory('service', ['$http', function ($http) {
 
	var obj ={};
 
	obj.getClients = function(){
		return $http.get('server/index.php/client/index');
	}
 
	obj.getLocalisations = function(){
		return $http.get('server/index.php/localisation/getLocatisations');
	}
 
	obj.addClient = function(client,fn){
		$http.post('server/index.php/client/add',client).then(function(result){
			fn(result);
		}, function(result){
			fn(result);
		});
	}
 
	return obj;
}])
 
 
app.controller('clientCtrl', ['$scope','$http' ,'service', function ($scope,$http,service) {
	//$scope.client = {nom : null, contact :null, localisation :null};
 
	$scope.getClients = function(){
		service.getClients().success(function(data){
			$scope.clients = data['clients'];
		}).error(function(data){
			console.log("une erreur");
		})
	}
 
	$scope.getLocalisations =  function(){
		service.getLocalisations().success(function(data){
			$scope.localisations = data['localisations'];
		}).error(function(data){
			console.log('une erreur');
		})
	}
 
	$scope.addClient = function(){
		service.addClient($scope.client,function(data){
			console.log(data);
		})
	}
 
	/*$scope.setDataForUpdate = function(client){
		$scope.client ={nom :client.nom, contact : client.contact, localisation: client.localisation};
	};*/
 
 
}]);

La fonction backend appelée :

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
	public function add()
	{
		$return = array();
		try{
			$postdata = file_get_contents("php://input");
			$request = json_decode($postdata);
 
			$id = $this->client_model->create(array('nom' => $request->nom , 
														'contact' => $request->contact, 
														'Localisation_id' =>$request->localisation
													)
												);
			if ($id){
				$return['statut'] = 'success';
				$return['message'] = 'Client ajouté avec succès.';
			}
			else
			{
				$return['statut'] = 'error';
				$return['message'] = 'Echec d\'ajout du client.';
			}
 
			//$handle = fopen("C:\Users\ml.diallo\Desktop\log.txt","w");
			// fwrite($handle,var_export(json_encode($return),true));
			// fclose($handle);
			//$this->output->set_content_type('Content-Type: application/json; charset=utf-8')->set_output(json_encode($return));
		}catch(Exception $e){
			$return['statut'] = 'error';
			$return['message'] = 'Echec d\'ajout du client.';
			$return['exception'] = $e->getMessage();
 
		}
		print_r(json_encode($return));
	}

Dans le html j'ai deux boutons, l'un de type submit et l'autre je n'ai rien mis. Ces deux boutons appellent la même fonction addClient via ng-click.

1) Quand je clique sur le deuxième bouton, l'appel ajax se passe bien, les données sont insérées en base et l'object $return est renvoyé (le problème avec cette méthode c'est que la validation du formulaire ne marche pas. Logique !).

2) Quand je clique sur le premier bouton (type submit), là aussi l'appel ajax se passe bien, les données sont insérées en base mais par contre l'objet $return n'est pas renvoyé. Et coté js la fonction error est appelée.

Voici-ci le résultat dans la console :
Pièce jointe 185855

Merci d'avance.