Click here to Skip to main content
15,792,870 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Im trying to learn angular. I am currently in the stage of learning about $http requests to my MVC API.

EDIT: Slowly discovering the problem, it has something to do with the the pushing of the data from form into the array. the error message I am getting back is "TypeError: Converting circular structure to JSON"

I have a simple and I mean simple HTML form that allows me to collect 2 pieces of information and collect it into an Angularjs array and then pass it to the WEB API method.

But my main problem is that If I spell the parameter incorrectly if calls the method and the value of the input parameter is blank. If I spell the parameter correctly it doesn't call the method at all. any pointer to help me learn what is going on?

Thanks
Simon

HTML
<div ng-app="Demo">
  <div ng-controller="MyController">
    <input type="text" id="username" name="username" placeholder="name..." ng-model="user.name"/>
    <input type="text" id="otherdetails" name="otherdetails" placeholder="name..." ng-model="user.name"/>

    <button type="button" ng-click="Add(user)">Save</button>
    <button type="button" ng-click="SaveUsers()">Save To Web API</button>
  </div>
</div>


My Angular code is as follows

JavaScript
angular.module('Demo', []);
angular.modeul('Demo').controller('ButtonCtrl', function($scope, $http) {
  $scope.user = [];

  $scope.Add = function(user) {
    $scope.user.push(user);
  };

  $scope.SaveUsers = function() {
    var request = $http({
      method: "post",
      url: '/Home/Index',
      data: {user: $scope.user }
    });

    request.success(function() {
      alert('success');
    });

    request.error(function() {
      alter('failed');
    });
  };
};


My C# code
C#
[HttpPost]
    public ActionResult Index(List<Person> user)
    {
        List<Models.Person> data = new List<Models.Person>();

        return null;
    }

    public class Person
    {
      public string Name {get;set;}
      public string Here {get;set;}
    }
Posted
Updated 21-Oct-14 0:43am
v2

1 solution

Solved it. Well at least I can get it to pass the information to the controller just not sure if it is the angular way of doing such a thing.

JavaScript
$scope.user = [];

//had to manually define the new entry onto the
//the user array
$scope.Add = function (user) {
    $scope.user.push({
        Name: user.name,
        Here: user.other
    });
};
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900