Home Posting NULL Data to asp.net core controller using angularjs
Reply: 0

Posting NULL Data to asp.net core controller using angularjs

user6416
1#
user6416 Published in May 25, 2018, 11:11 am

i am posting data from angularjs to .net core controller, but i am getting null values

StudentController

[HttpPost]
        public JsonResult AddStudent(Student stu)
        {
            if (stu != null)
            {

                    db.Students.Add(stu);
                    db.SaveChanges();
                    return Json(stu);

            }
            else
            {
                return Json("Some Error Occured");
            }
        }

Module.js

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

Service.js

myApp.service("myService", function ($http) {

    //get All Eployee



    // Add Employee
    this.AddEmp = function (Employee) {
        var response = $http({
            method: 'post',
            url: 'Employee/AddStudent/',
            data: JSON.stringify(Employee),
            dataType: 'json'

        });
        console.log(JSON.stringify(Employee));
        return response;
    }


});

Controller.js

myApp.controller("myCntrl", function ($scope, myService) {
    $scope.divEmployee = false;
    GetAllEmployee();
    //To Get All Records 
    function GetAllEmployee() {

        var getData = myService.getEmployees();

        getData.then(function (emp) {
            $scope.employees = emp.data;
        }, function () {
            alert('Error in getting records');
        });
    }



    $scope.AddUpdateEmployee = function () {

        var Employee = {
            Name: $scope.employeeName,
            Email: $scope.employeeAddress,
            Age: $scope.employeeEmail
        };
        console.log(Employee);
        var getAction = $scope.Action;

        if (getAction == "Update") {
            Employee.Id = $scope.employeeId;
            var getData = myService.updateEmp(Employee);
            getData.then(function (msg) {
                GetAllEmployee();

                $scope.divEmployee = false;
            }, function () {
                alert('Error in updating record');
            });
        } else {
            var getData = myService.AddEmp(Employee);
            getData.then(function (msg) {
                GetAllEmployee();
                alert(msg.data);
                $scope.divEmployee = false;
            }, function () {
                alert('Error in adding record');
            });
        }
    }

    $scope.AddEmployeeDiv = function () {
        ClearFields();
        $scope.Action = "Add";
        $scope.divEmployee = true;
    }

    //$scope.deleteEmployee = function (employee) {
    //    var getData = myService.DeleteEmp(employee.Id);
    //    getData.then(function (msg) {
    //        GetAllEmployee();
    //        alert('Employee Deleted');
    //    }, function () {
    //        alert('Error in Deleting Record');
    //    });
    //}

    function ClearFields() {
        $scope.employeeId = "";
        $scope.employeeName = "";
        $scope.employeeEmail = "";
        $scope.employeeAdress = "";
    }
});

Index.cshtml

<div ng-controller="myCntrl">

    <h1> Employee Details Page</h1>

    <br />

    <input type="button" class="btnAdd" value=" Add Employee" ng-click="AddEmployeeDiv()" />

    <div class="divList">
        <p class="divHead">Employee List</p>
        <table cellpadding="12" class="table table-bordered table-hover">
            <tr>
                <td><b>ID</b></td>
                <td><b>Name</b></td>
                <td><b>Email</b></td>
                <td><b>Age</b></td>
                <td><b>Actions</b></td>
            </tr>
            <tr ng-repeat="employee in employees">
                <td>
                    {{employee.id}}
                </td>
                <td>
                    {{employee.StudentName}}
                </td>
                <td>
                    {{employee.StudnetAddress}}
                </td>
                <td>
                    {{employee.StudentEmail}}
                </td>
                <td>
                    <span ng-click="editEmployee(employee)" class="btnAdd">Edit</span>
                    <span ng-click="deleteEmployee(employee)" class="btnRed">Delete</span>
                </td>
            </tr>
        </table>
    </div>

    <div ng-show="divEmployee">
        <p class="divHead">{{Action}} Employee</p>
        <table>
            <tr>
                <td><b>Id</b></td>
                <td>
                    <input type="text" disabled="disabled" ng-model="employeeId" />
                </td>
            </tr>
            <tr>
                <td><b>Name</b></td>
                <td>
                    <input type="text" ng-model="employeeName" />
                </td>
            </tr>
            <tr>
                <td><b>Email</b></td>
                <td>
                    <input type="text" ng-model="employeeAddress" />
                </td>
            </tr>
            <tr>
                <td><b>Age</b></td>
                <td>
                    <input type="text" ng-model="employeeEmail" />
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="button" class="btnAdd" value="Save" ng-click="AddUpdateEmployee()" />
                </td>
            </tr>
        </table>
    </div>
</div>
@*New record Modal addition..*@
@section scripts{

<script src="~/lib/angular/Module.js"></script>
<script src="~/lib/angular/Service.js"></script>
<script src="~/lib/angular/Controller.js"></script>

}

I just want you to check my POST function, i tried to check console.log as well its working fine i am getting data but when i check in asp.net core i am not getting data.

You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.346381 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO