current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 5 down vote favorite
4

I am trying to insert data from front end to mysql db using angularjs. But it is not geting inserted to the db even though there are no error messages. Following is the code that I use.

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>

and following is my php file

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."; 
    }
?>

I know I am doing something stupid here. I have just started to learn angularjs today. when i try the php code with plain html to insert into db it works perfectly.I am not getting what I am doing wrong here. Hope someone will help me out here

share|improve this question
    
If the php is working without the angular, then we can discount it as the cause, but you should be using mysqli_* or PDO rather than the mysql_* functions. Using the Chrome developer tool, or similar, can you see the XHR doing the POST to your script? Does it have a value for "add"? I can't see where you are setting the post "add" value, but I am unfamiliar with angular. More information on why not to use mysql_* can be found here –  boodle Nov 15 '13 at 15:23
    
do you get a callback or at least some response code for request code ? –  Vinod Louis Nov 15 '13 at 15:26
    
Definitely looks like you are not sending a _POST["add"] value, and so not entering the if. –  boodle Nov 15 '13 at 15:27
    
But the same code is working perfectly in regular php... @boodle –  Tuttu Mon Nov 15 '13 at 15:33
    
i am not geting the response...if i am right I should get "Your information has been successfully added to the database." as response . But not geting it when done with angularjs. But i gets the response in regular php @VinodLouis –  Tuttu Mon Nov 15 '13 at 15:35

2 Answers 2

up vote 6 down vote accepted

Your script for inserting the data is wrong. Replace it with the following

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

and also change the php as follows.

$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.";

This worked for me when I tried with your code.

share|improve this answer
1  
it works here too :) –  StreetCoder Mar 29 at 18:30
up vote 0 down vote

Your php won't do insert without post variable add: 

if(isset($_POST['add']))

But you never send that, your ajax data only includes fname and lname.

Within browser console inspection of request can see all the parameters and values that are sent, as well as data returned if status is 200. When in doubt, start looking there.

share|improve this answer
    
Fname and lname are going and the status of that is 200....!11 –  Tuttu Mon Nov 16 '13 at 8:03
    
did you sort out php logic then? –  charlietfl Nov 16 '13 at 12:29

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.