web-dev-qa-db-fra.com

Insertion de données du frontal vers mysql db dans angularjs

J'essaie d'insérer des données du front-end dans mysql db en utilisant angularjs. Mais il n'est pas inséré dans la base de données même s'il n'y a pas de messages d'erreur. Voici le code que j'utilise.

index.html

<html ng-app="demoApp">
   <head>
        <title> AngularJS Sample</title>
        <script src="js/angular.min.js"></script>
        <script src="js/angular-route.min.js"></script>
        <script type="text/javascript" src="js/script.js"></script>
    </head>
    <body>
        <div class="container" ng-view>
        </div>
    </body>
</html>

script.js

    demoApp.config( function ($routeProvider,$locationProvider) {
    $routeProvider
        .when('/',
        {
            controller: 'SimpleController',
            templateUrl: 'Partials/view1.html'
        })
        .when('/view2',
        {
            controller: 'SimpleController',
            templateUrl: 'Partials/view2.html'
        })
        .otherwise({redirectTo: '/'});
    });
    demoApp.controller('SimpleController',function ($scope,$http){
    $http.post('server/view.php').success(function(data){
        $scope.friends = data;
    });;
    $scope.addNewFriend = function(add){
        var data = {
            fname:$scope.newFriend.fname,
            lname:$scope.newFriend.lname
        }
        $http.post("server/insert.php",data).success(function(data, status, headers, config){
            console.log("inserted Successfully");
        });
        $scope.friends.Push(data);
        $scope.newFriend = {
            fname:"",
            lname:""
        };
    };   
});

View1.html

<div class="container" style="margin:0px 100px 0px 500px;">
    Name:<input type="text" ng-model="filter.name">
    <br/>
    <ul>
        <li ng-repeat="friend in friends | filter:filter.name | orderBy:'fname'">{{friend.fname}} {{friend.lname}}</li>
    </ul>
    <br/>
    <fieldset style="width:200px;">
        <legend>Add Friend</legend>
        <form name="addcustomer" method="POST">
            First Name:<input type="text" ng-model="newFriend.fname" name="firstname"/>
            <br/>
            Last Name :<input type="text" ng-model="newFriend.lname" name="lastname"/>
            <br/>
            <button data-ng-click="addNewFriend()" name="add">Add Friend</button>
        </form>
    </fieldset>
    <a href="#/view2" style="margin:auto;">Next</a>
</div>

et voici mon fichier php

insert.php

<?php
    if(isset($_POST['add']))
    {
        $firsname=$_POST['firstname'];
        $laname = $_POST['lastname'];
        mysql_connect("localhost", "root", "") or die(mysql_error()); 
        mysql_select_db("angularjs") or die(mysql_error()); 
        mysql_query("INSERT INTO friends (fname,lname) VALUES ('$firsname', '$laname')"); 
        Print "Your information has been successfully added to the database."; 
    }
?> 

Je sais que je fais quelque chose de stupide ici. Je viens de commencer à apprendre angularjs aujourd'hui. quand j'essaye le code de php avec le HTML simple pour l'insérer dans le db cela fonctionne parfaitement. Je n'obtiens pas ce que je fais mal ici. J'espère que quelqu'un m'aidera ici

15
Midhun Mathew

Votre script pour insérer les données est incorrect. Remplacez-le par ce qui suit

$http.post("server/insert.php",{'fstname': $scope.newFriend.fname, 'lstname': $scope.newFriend.lname})
        .success(function(data, status, headers, config){
            console.log("inserted Successfully");
        });

et modifiez également le php comme suit.

$data = json_decode(file_get_contents("php://input"));
$fstname = mysql_real_escape_string($data->fstname);
$lstname = mysql_real_escape_string($data->lstname);
mysql_connect("localhost", "root", "") or die(mysql_error()); 
mysql_select_db("angularjs") or die(mysql_error()); 
mysql_query("INSERT INTO friends (fname,lname) VALUES ('$fstname', '$lstname')"); 
Print "Your information has been successfully added to the database."; 

Cela a fonctionné pour moi lorsque j'ai essayé avec votre code.

17
MidhuN