Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to submit angular js form using ng-click

I am trying to create a from using json file. So I have a json file I am calling it into my html using angular js I am getting problem when I click on save button which is using ng-click , Here I am trying to use the array of user like this:

       <div ng-repeat="x in myWelcome.definition.attributes">
        <div ng-repeat= "y in x.children ">
          <div ng-if ="y.rm_type_name == 'DV_TEXT'">
             <input type="{{ y.node_id }}" name="{{ y.node_id }}" ng-model="user[y.node_id]">
          </div>
          <div ng-if ="y.rm_type_name == 'DV_CODED_TEXT'">
             <input type="{{ y.node_id }}" name="{{ y.node_id }}" ng-model="user[y.node_id]">
          </div>

        </div>
        <h1>You entered: {{user}}</h1>

      </div>
      <input type="submit" ng-click="update(user)" value="Save" />

And my controller is looking like this :

     $scope.update = function(user) {
       console.log(user);
     };

I am getting the undefined in my console here is the plunker : https://plnkr.co/edit/62g4YhkowQtwkyBOPKi5?p=preview


2 Answers

You need to add only one line and I think that will work use this inside your controller and no more changes :

 var app = angular.module('myApp', []);
    app.controller('myCtrl', function($scope, $http) {
      $scope.master = {};
      $scope.user = {};
      $scope.update = function(user) {
        $scope.master = angular.copy(user);
        $scope.user = {};
        console.log(user);
      };
      $http.get("data.json")
      .then(function(response) {
          $scope.myWelcome = response.data;
      });
    });

You only need to add this in your controller $scope.user = {}; and it will work

like image 53
Nilay Singh Avatar answered Sep 04 '25 23:09

Nilay Singh


Try like this, it's a sample one

<form class="form-horizontal" role="form" ng-app="myApp" ng-controller="MyCtrl">

<input class="form-control" id="tittle" placeholder="tittle" ng-model="formInfo.tittle">

<input class="form-control" id="name" placeholder="Name" ng-model="formInfo.Name">

 <button type="submit" ng-click="saveData()" class="btn btn-success">save</button>

 </form>

var app=angular.module('myApp', []);
  app.controller('MyCtrl', ['$scope', function($scope) {
    $scope.formInfo = {};
    $scope.saveData = function() {
    console.log($scope.formInfo);
    }
  }]);
like image 22
balajivaishnav Avatar answered Sep 05 '25 01:09

balajivaishnav