Web Api Using AngularJS

-
using System;
using System.Collections.Generic;
using System.Data;
using System.Data.Entity;
using System.Data.Entity.Infrastructure;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using System.Web.Http.Description;
using AngularJSSample.Models;

namespace AngularJSSample.Controllers
{
    [RoutePrefix("api/employee")]
    public class EmployeesController : ApiController
    {
        private EmployeeEntities db = new EmployeeEntities();

        // GET: api/Employees
        [HttpGet]
        [AllowAnonymous]
        [Route("getemployee")]
        public IQueryable<Employee> GetEmployees()
        {
            return db.Employees;
        }

        // GET: api/Employees/5
        //[ResponseType(typeof(Employee))]
        [HttpGet]
        [AllowAnonymous]
        [Route("employee")]
        public IHttpActionResult GetEmployee(int id)
        {
            Employee employee = db.Employees.Find(id);
            if (employee == null)
            {
                return NotFound();
            }
            return Ok(employee);
        }

        // PUT: api/Employees/5
        [ResponseType(typeof(void))]
        public IHttpActionResult PutEmployee(int id, Employee employee)
        {
            if (!ModelState.IsValid)
            {
                return BadRequest(ModelState);
            }

            if (id != employee.eno)
            {
                return BadRequest();
            }

            db.Entry(employee).State = EntityState.Modified;

            try
            {
                db.SaveChanges();
            }
            catch (DbUpdateConcurrencyException)
            {
                if (!EmployeeExists(id))
                {
                    return NotFound();
                }
                else
                {
                    throw;
                }
            }

            return StatusCode(HttpStatusCode.NoContent);
        }

        // POST: api/Employees
        // [ResponseType(typeof(Employee))]
        [HttpPost]
        [AllowAnonymous]
        [Route("PostEmployee")]
        public IHttpActionResult PostEmployee(Employee employee)
        {
            if (!ModelState.IsValid)
            {
                return BadRequest(ModelState);
            }

            db.Employees.Add(employee);

            try
            {
                db.SaveChanges();
            }
            catch (DbUpdateException)
            {
                if (EmployeeExists(employee.eno))
                {
                    return Conflict();
                }
                else
                {
                    throw;
                }
            }

            return CreatedAtRoute("DefaultApi", new { id = employee.eno }, employee);
        }

        // DELETE: api/Employees/5
        [ResponseType(typeof(Employee))]
        public IHttpActionResult DeleteEmployee(int id)
        {
            Employee employee = db.Employees.Find(id);
            if (employee == null)
            {
                return NotFound();
            }

            db.Employees.Remove(employee);
            db.SaveChanges();

            return Ok(employee);
        }

        protected override void Dispose(bool disposing)
        {
            if (disposing)
            {
                db.Dispose();
            }
            base.Dispose(disposing);
        }

        private bool EmployeeExists(int id)
        {
            return db.Employees.Count(e => e.eno == id) > 0;
        }
    }
}




For HTML page

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script src="Scripts/angular.min.js"></script>
</head>
<body>
    <div ng-app="myApp" ng-controller="myController">

        <table border="1">
            <tr ng-repeat="dataa in remidy">
                <td>{{dataa.eno}}</td>
                <td>{{dataa.ename}}</td>
                <td>{{dataa.salary}}</td>
            </tr>
        </table>

        <button ng-click="myfuntion()">Click Me</button>
        <table border="1">
            <tr ng-repeat="dataa in rem">
                <td>{{dataa.eno}}</td>
                <td>{{dataa.ename}}</td>
                <td>{{dataa.salary}}</td>
            </tr>
        </table>

        Employee Id <input type="number" name="txtEno" id="txtEno" ng-model="txtEno" />
        Employee Name<input type="text" id="txtEname" name="txtEname" ng-model="txtEname" />
        Employee Salary<input type="number" id="txtSalary" name="txtSalary" ng-model="txtSalary" />


        <button ng-click="myfun(txtEno,txtEname,txtSalary)">Save</button>
        <!--app.controller('myController', function ($scope, $http) {
        $http.get("http://localhost:49791/api/employee/GetEmployee").then(function (response) {
        $scope.remidy = response.data;
        });-->
        <!--<div ng-repeat="dataa in remidy"> </div>-->
    </div>

</body>
<script>
    var app = angular.module('myApp', []);


    app.controller('myController', function ($scope, $http) {
        $scope.myfun = function (txtEnos, txtEnames, txtSalarys) {
            debugger;
            $http({
                method: 'POST',
                url: 'http://localhost:49791/api/employee/PostEmployee',
                data: '{"EmployeeDetails":[],"eno":"' + txtEnos + '","ename":"' + txtEnames + '","salary":"' + txtSalarys + '"}',
                headers: { 'Content-Type': 'application/json' }
            }).then(function mySucess(response) {
                alert("sucess");
            }, function myFailure(responce) {
                alert("Failed");
            });
        }
        var count = 0;
        $scope.myfuntion = function () {

            if (count % 2 == 0) {
                $http({
                    method: "GET",
                    url: "http://localhost:49791/api/employee/GetEmployee"
                }).then(function mySucess(respone) {
                    $scope.rem = respone.data;
                }, function myFailure(responce) {
                    responce.ExceptionMessage;
                });
                count++;
            } else {
                $scope.rem = [];
                count++;
            }
        }



        $http({
            method: "GET",
            url: "http://localhost:49791/api/employee/GetEmployee"
        }).then(function mySucess(respone) {
            $scope.remidy = respone.data;
        }, function myFailure(responce) {
            responce.ExceptionMessage;
        });
    });
</script>
</html>



Comments

Post a Comment

Popular posts from this blog

Reverse Sentence using c#

-
using System; namespace ReverseString_Sentence {     class Program     {         static void Main(string[] args)         {             string str = "Hello World!";             Console.WriteLine(str);             string finalStr = "";             string midStr = "";             str = " " + str;             for (int i = str.Length - 1; i >= 0; i--)             {                 if (str[i].ToString() != " ")                 {                     midStr = midStr + str[i];                 }             ...
Read more

How to write Pure java script Program?

-
Image
Create  the Below  folder structure app.js: ==== function submit() {     var name = document.getElementById("txtName").value;     var code = document.getElementById("txtCode").value;     console.log(name + code); } function turnOffLight() {     var a, b, c;     a = 10;     b = 12;     document.getElementById("tagDisplay").innerHTML = a + b; } function turnOnLight() {     /*Comment Implementation       document.getElementById("tagInnerHtmlBasicTag").innerHTML = 'Sreenivas';     */     var x, y;     x = y;     x += y;//x=x+y;     x -= y;//x=x-y;     x *= y;//x=x*y;     x /= y;//x=x/y;     x = 10;     y = 10;     console.log(x | y);     console.log(x ** y);     console.log(x ^ y);     console.log(x >>> y); ...
Read more