Saturday 18 November 2017

ASP.NET WEB API Call from Jquery

code for retrieving a web API from jquery


using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using StudentData;

namespace StudentService.Controllers
{
    public class StudentsController : ApiController
    {
     
        public IEnumerable<studentTbl> Get()
        {
            using (studentDBEntities enti = new studentDBEntities())
            {
                return enti.studentTbls.ToList();
            }
        }

        public studentTbl Get(int id)
        {
            using (studentDBEntities enti = new studentDBEntities())
            {
                return enti.studentTbls.FirstOrDefault(e => e.Id == id);
            }
        }

        public HttpResponseMessage Post([FromBody]studentTbl student)
        {
            try {
            using(studentDBEntities enti = new studentDBEntities())
            {
                enti.studentTbls.Add(student);
                enti.SaveChanges();

                var msg = Request.CreateResponse(HttpStatusCode.Created, student);
                msg.Headers.Location = new Uri(Request.RequestUri + student.Id.ToString());

                return msg;
            }
                }
            catch (Exception ex)
            {
                return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
            }
        }

        public HttpResponseMessage Delete(int id)
        {
            using(studentDBEntities enti = new studentDBEntities())
            {
                var enty = enti.studentTbls.FirstOrDefault(e => e.Id == id);
                if(enty == null)
                {
                    return Request.CreateErrorResponse(HttpStatusCode.NotFound, "Student with id " + id.ToString() + "not yet in database");
                }
                else
                {
                    enti.studentTbls.Remove(enty);
                    enti.SaveChanges();
                    return Request.CreateResponse(HttpStatusCode.OK);
                }
             
            }
        }


        public HttpResponseMessage Put(int id,[FromUri] studentTbl student)
        {
            using(studentDBEntities enti = new studentDBEntities())
            {
             
                var enty = enti.studentTbls.FirstOrDefault(e => e.Id == id);
                if(enty == null)
                {
                    return Request.CreateErrorResponse(HttpStatusCode.NotFound, "NOt yet availble");
                }
                else
                {
                enty.Name = student.Name;
                enty.Dept = student.Dept;
                enty.Age = student.Age;

                enti.SaveChanges();
                return Request.CreateResponse(HttpStatusCode.OK, enty);
                }
            }
        }
     
    }
}


html code
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Students data</title>
    <script src="Scripts/jquery-1.10.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var studentList = $('#studentList');

            $('#loadData').click(function () {
                $.ajax({
                    type: 'GET',
                    url: 'api/students',
                    dataType: 'json',
                    success: function (data) {
                        studentList.empty();

                        $.each(data, function (index, val) {
                            var Name = val.Id + " " + val.Name;
                            studentList.append('<li>' + Name + '</li>');
                        })
                    }

                });

            });

            $('#clear').click(function () {
                studentList.empty();
            });
        });

    </script>

</head>
<body>

    <input type="button" id="loadData" value="Show Students" />
    <input type="button" id="clear" value="CLear" />
    <ul id="studentList"></ul>
</body>
</html>


No comments:

Post a Comment

Part 20 consuming rest api in ionic

in this video, I will show you that how you can consume the rest API. in the previous video we have implemented the asp.net web API projec...