Not able to insert value in DB via Angular JS with MVC4

Question

I built a sample MVC application in which I tried to implement functionality to insert a record using angular js.

Here is the index cshtml page.

@{
    ViewBag.Title = "Add User";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@section adduser 
{
    @*Index.html*@
    <div class="container-fluid" ng-app='MyData' ng-controller='DataController'>
        <table class="table table-striped table-bordered table-responsive">
            <tr>
                <td>
                    <label class="text-primary">User Name:</label>
                </td>
                <td>
                    <input type="text" id="txtUserName" class="text-primary" required="required" ng-model="newUser" />
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="submit" id="btnSubmit" class="btn btn-success" ng-click="AddUser()" />
                </td>
            </tr>
        </table>
    </div>
}

Here is the Model js code

var myData = angular.module('MyData', []);

Here is the controller JS code

myData.controller("DataController", function($scope) {
    $scope.newUser = "";
    $scope.addUser = function() {
        $http.post("/Home/AddUser/", { newUser: $scope.newUser }).success(function (result) {
            alert(result.success);
        }).error(function(data) {
            console.log(data);
        });
    };
});

Here is the post method inside controller which i am calling through angular js

[HttpPost]
        public JsonResult AddUser(string name)
        {
            var db = new SchedulerEntities();
            db.Users.Add(new User {Name = name});
            db.SaveChanges();
            return null;
        }

I am adding an entry into DB from controller method but nothing is happening...

Can you show us the error you get ?? Is the value received in AddUser method correctly ? — Ahmed Eid
– Ahmed Eid, Commented Aug 6, 2015 at 11:12
I am not able to get error info as well because debugger is not pointing at the line of code. — rsn
– rsn, Commented Aug 6, 2015 at 11:48

Yasser Shaikh · Accepted Answer · 2015-08-06 12:41:38Z

3

I think you need to declare $http in the function:

myData.controller("DataController", function($scope, $http) {
    $scope.newUser = "";
    $scope.addUser = function() {
        $http.post("/Home/AddUser/", { newUser: $scope.newUser })
        .success(function (result) {
            alert(result.success);
        }).error(function(data) {
            console.log(data);
        });
    };
});

edited Aug 6, 2015 at 12:41

Yasser Shaikh

47.9k50 gold badges208 silver badges289 bronze badges

answered Aug 6, 2015 at 12:27

bigneo

1411 silver badge10 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Yasser Shaikh Over a year ago

this would work for you @rsn. But I would suggestion you to use angular services to post data and use that services in your controller.

Collectives™ on Stack Overflow

Not able to insert value in DB via Angular JS with MVC4

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related