title: Inserting data from front end to mysql db in angularjs
body: <p>I am trying to insert data from front end to mysql db using angularjs. <strong>But it is not geting inserted to the db even though there are no error messages</strong>. Following is the code that I use.</p>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;html ng-app="demoApp"&gt;
     &lt;head&gt;
          &lt;title&gt; AngularJS Sample&lt;/title&gt;
          &lt;script src="js/angular.min.js"&gt;&lt;/script&gt;
          &lt;script src="js/angular-route.min.js"&gt;&lt;/script&gt;
          &lt;script type="text/javascript" src="js/script.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div class="container" ng-view&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>script.js</strong></p>
  
  <pre><code>    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:""
          };
      };   
  });
  </code></pre>
  
  <p><strong>View1.html</strong></p>
  
  <pre><code>&lt;div class="container" style="margin:0px 100px 0px 500px;"&gt;
      Name:&lt;input type="text" ng-model="filter.name"&gt;
      &lt;br/&gt;
      &lt;ul&gt;
          &lt;li ng-repeat="friend in friends | filter:filter.name | orderBy:'fname'"&gt;{{friend.fname}} {{friend.lname}}&lt;/li&gt;
      &lt;/ul&gt;
      &lt;br/&gt;
      &lt;fieldset style="width:200px;"&gt;
          &lt;legend&gt;Add Friend&lt;/legend&gt;
          &lt;form name="addcustomer" method="POST"&gt;
              First Name:&lt;input type="text" ng-model="newFriend.fname" name="firstname"/&gt;
              &lt;br/&gt;
              Last Name :&lt;input type="text" ng-model="newFriend.lname" name="lastname"/&gt;
              &lt;br/&gt;
              &lt;button data-ng-click="addNewFriend()" name="add"&gt;Add Friend&lt;/button&gt;
          &lt;/form&gt;
      &lt;/fieldset&gt;
      &lt;a href="#/view2" style="margin:auto;"&gt;Next&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and following is my php file </p>
  
  <p><strong>insert.php</strong></p>
  
  <pre><code>&lt;?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."; 
      }
  ?&gt; 
  </code></pre>
  
  <p>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</p>