current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0
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 0 down vote favorite

I am creating a simple angularJS application but I am not able to pass data to the APIController. APIController is defined in C# language. When I pass the data with this code-

    var app = angular.module('myApp', []);
    app.controller('MyCtrl', function($scope, $http) {
        $scope.data = {
            Name: '',
            Username: '',
            Password: '',
            Email: ''
        },
        $scope.saveData = function(data) {
            $http ({
                method: 'POST',
                url: '/api/Account',
                data: JSON.stringify(data),
                contentType: "application/json",
                dataType: "json"
            });
        .success(function (data) {
            $scope.registrationShow = function () {
            return true;
         },
         $scope.status = "Data is saved successfully."
     })
    .error(function(error){
        $scope.status = "Unable to register data." + error.message;
    })
  }})

And HTML code is-

<div data-ng-app="myApp">
   <div data-ng-controller="MyCtrl" >
     <form data-ng-submit="saveData()">
        <table style="margin: 25%; margin-top: 100px">
            <tr>
                <td>Name: </td>
                <td>
                    <input type="text" data-ng-model="data.Name" /></td>
            </tr>
            <tr>
                <td>Username: </td>
                <td>
                    <input type="text" data-ng-model="data.Username" /></td>
            </tr>
            <tr>
                <td>Password: </td>
                <td>
                    <input type="password" data-ng-model="data.Password" id="pass" /></td>
            </tr>
            <tr>
                <td>Confirm Password: </td>
                <td>
                    <input type="password" id="confpass" /></td>
            </tr>
            <tr>
                <td>Email: </td>
                <td>
                    <input type="text" data-ng-model="data.Email" /></td>

            </tr>
            <tr>
                <td colspan="2">
                    <button id="btn" style="margin-left: 300px" type="submit" >Save</button></td>
            </tr>
            <tr>
                <td><label>
        {{status}}
    </label></td>
            </tr>

        </table>
    </form>


</div>

My APIControoler class is-

    public class AccountController : ApiController
{
    Database1Entities db = new Database1Entities();

    [HttpPost]
    public HttpResponseMessage PostData([FromBody]User user)
    {
        if (user == null)
        {
            return new HttpResponseMessage(HttpStatusCode.BadRequest);
        }
        else
        {
            User objUser = new User();
            objUser.Name = user.Name;
            objUser.Username = user.Username;
            objUser.Password = user.Password;
            objUser.Email = user.Email;
            db.Users.Add(objUser);
            db.SaveChanges();
            return new HttpResponseMessage(HttpStatusCode.Created);
        }
    }
}

Only "null" data is passing to the controller. I am not able to find out the actual problem. Please help me as soon as possible.

share|improve this question

3 Answers 3

up vote 1 down vote accepted

In your $http call you have semicolon at the end, which throws error on the next line:

$http ({
            method: 'POST',
            url: '/api/Account',
            data: JSON.stringify(data),
            contentType: "application/json",
            dataType: "json"
        }); <-------------------------------------
    .success(function (data) {
        $scope.registrationShow = function () {
        return true;
     },

Try to remove it.

And also i believe problem is, that you try to pass data to your save method. You should get it from scope like this:

data: JSON.stringify($scope.data)
share|improve this answer
    
Thanks, it really worked for me. Actually JSON.stringify(data) was the error. I replaced it with what you provided to me.. :) –  Abhinav Jul 15 at 12:49
    
+1 - forensic viewing to the rescue :-) –  jim tollan Jul 15 at 12:51
    
Glad I could help :) Please mark answer as correct if it was usefull. –  Jan Barta Jul 15 at 12:52
up vote 1 down vote

Hi that might happend because you are using jQuery ajax call

In angular way you please see below:

 $scope.saveData = function(data) { 

                 $http.post('/api/Account',data).then(onSucess, onError);

    function onSucess(data){
    ...
    };

    function onError(){
    ...
    }


    };
share|improve this answer
    
Thanx, this code worked for me as well. And thanx for telling me the short method.. :) –  Abhinav Jul 15 at 12:51
    
+1 for showing the angular approach, definitely worth noting as errors at framework level (in the case of the OP, jquery) can be hard to diagnose –  jim tollan Jul 15 at 12:58
up vote 0 down vote

Simply replace ".success" with ".then" and add error as .then's second function argument. General usage subtopic in [this][1]

[1]: https://docs.angularjs.org/api/ng/service/$http should help

share|improve this answer
1  
Jan Barta's answer should help too! –  Pramod Jul 15 at 12:44

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.