First create a class Library:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace BO
{
public class EMP
{
public int EID { get; set; }
public string NAME { get; set; }
}
}
Create a web api :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Http;
using WebApplication13.Models;
using BO;
namespace WebApplication13.Controllers
{
public class EmpserviceController : ApiController
{
[HttpGet]
public List<BO.EMP> Gets()
{
using (Database1Entities obj = new Database1Entities())
{
return obj.EMPs.ToList().ConvertAll(m => new BO.EMP() { EID=m.EID,NAME=m.NAME });
}
}
[HttpGet]
public BO.EMP Gets(int EID)
{
using (Database1Entities obj = new Database1Entities())
{
return obj.EMPs.ToList().ConvertAll(m => new BO.EMP() { EID = m.EID, NAME = m.NAME }).FirstOrDefault(n => n.EID == EID);
}
}
[HttpPost]
public string Post(BO.EMP emp)
{
using (Database1Entities obj = new Database1Entities())
{
WebApplication13.Models.EMP emp1 = new Models.EMP();
emp1.EID = emp.EID;
emp1.NAME = emp.NAME;
obj.EMPs.Add(emp1);
obj.SaveChanges();
return "Data Saved.";
}
}
[HttpPut]
public string Put(BO.EMP emp)
{
using (Database1Entities obj = new Database1Entities())
{
WebApplication13.Models.EMP emp1 = obj.EMPs.SingleOrDefault(m => m.EID == emp.EID);
emp1.NAME = emp.NAME;
obj.SaveChanges();
return "Data Updated.";
}
}
[HttpDelete]
public string Delete(int EID)
{
using (Database1Entities obj = new Database1Entities())
{
WebApplication13.Models.EMP emp1 = obj.EMPs.SingleOrDefault(m => m.EID == EID);
obj.EMPs.Remove(emp1);
obj.SaveChanges();
return "Data Deleted.";
}
}
}
}
MVC controller :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Net;
using Newtonsoft.Json;
using BO;
using System.Text;
namespace WebApplication1.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
[HttpGet]
public JsonResult Gets()
{
using (WebClient wc = new WebClient())
{
string s = wc.DownloadString("http://localhost:63795/api/Empservice");
List<EMP> lst = (List<EMP>)JsonConvert.DeserializeObject(s,typeof(List<EMP>));
return Json(lst, JsonRequestBehavior.AllowGet);
}
}
[HttpGet]
public JsonResult Get(int EID)
{
using (WebClient wc = new WebClient())
{
string s = wc.DownloadString("http://localhost:63795/api/Empservice/Get?EID="+EID);
EMP lst = (EMP)JsonConvert.DeserializeObject(s,typeof(EMP));
return Json(lst, JsonRequestBehavior.AllowGet);
}
}
[HttpPost]
public string Save(EMP emp)
{
using (WebClient wc = new WebClient())
{
wc.Encoding = Encoding.UTF8;
wc.Headers["Content-Type"] = "application/json";
wc.UploadString("http://localhost:63795/api/Empservice/Post", "Post", JsonConvert.SerializeObject(emp));
return "Data Saved.";
}
}
[HttpPost]
public string Update(EMP emp)
{
using (WebClient wc = new WebClient())
{
wc.Encoding = Encoding.UTF8;
wc.Headers["Content-Type"] = "application/json";
wc.UploadString("http://localhost:63795/api/Empservice/Put", "Put", JsonConvert.SerializeObject(emp));
return "Data Updated.";
}
}
[HttpGet]
public string Delete(int EID)
{
using (WebClient wc = new WebClient())
{
wc.Encoding = Encoding.UTF8;
wc.Headers["Content-Type"] = "applicaton/json";
wc.UploadString("http://localhost:63795/api/Empservice/Delete?EID=" + EID, "Delete", JsonConvert.SerializeObject(EID));
return "Data Deleted.";
}
}
}
}
View :
<link href="~/Content/bootstrap.css" rel="stylesheet" />
<link href="~/Content/bootstrap-theme.css" rel="stylesheet" />
<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/angular-route.js"></script>
<div class="container" ng-app="app" ng-controller="ctrl">
<form class="form-horizontal" novalidate name="frmEmp">
<div class="form-group" ng-class="{'has-error':frmEmp.txtEid.$invalid,'has-success':frmEmp.txtEid.$valid}">
<label class="control-label col-lg-4">EID</label>
<div class="col-lg-4">
<input type="text" name="txtEid" id="txtEid" ng-model="EMP.EID" ng-required="frmEmp.txtEid.$invalid" class="form-control">
</div>
<span class="has-error help-block " ng-show="frmEmp.txtEid.$invalid">
Eid should not be blank.
</span>
</div>
<div class="form-group" ng-class="{'has-error':frmEmp.txtName.$invalid,'has-success':frmEmp.txtName.$valid}">
<label class="control-label col-lg-4">NAME</label>
<div class="col-lg-4">
<input type="text" name="txtName" ng-model="EMP.NAME" ng-required="frmEmp.txtName.$invalid" class="form-control">
</div>
<span class="has-error help-block" ng-show="frmEmp.txtName.$invalid">
Name should not be blank.
</span>
</div>
<div class="form-group" >
<label class="control-label col-lg-4"></label>
<div class="col-lg-4">
<input type="button" value="Save" class="btn btn-primary" style="width:80px" ng-click="save(frmEmp.$valid)">
<input type="button" value="Update" class="btn btn-primary" style="width:80px" ng-click="update(frmEmp.$valid)">
<input type="button" value="Reset" class="btn btn-primary" style="width:80px" ng-click="reset()">
</div>
</div>
<div class="row">
<table class="table table-bordered table-condensed table-hover table-responsive table-striped">
<thead class="bg-primary">
<tr>
<th>EID</th>
<th>NAME</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="c in list">
<td>{{c.EID}}</td>
<td>{{c.NAME}}</td>
<td><a ng-click="edit(c.EID)">Edit</a>|<a ng-click="del(c.EID)">Delete</a></td>
</tr>
</tbody>
</table>
</div>
</form>
</div>
<script type="text/javascript">
(function ()
{
"use strict";
angular.module("app", ['ngRoute'])
.controller("ctrl", function ($scope, EmpService, $route) {
var emp = {
EID: null,
NAME: null
};
function CLR() {
$scope.EMP = emp;
} CLR();
function fill() {
EmpService.Gets().then(function (response) {
$scope.list = response.data;
});
} fill();
$scope.save = function (isValid) {
if (isValid) {
EmpService.Save($scope.EMP).then(function (response) {
alert(response.data);
$route.reload();
CLR();
fill();
});
}
}
$scope.update = function (isValid) {
if (isValid) {
EmpService.Update($scope.EMP).then(function (response) {
alert(response.data);
$route.reload();
CLR();
fill();
});
}
}
$scope.del = function (s) {
if (confirm('Do you want to delete it ?')) {
EmpService.Delete(s).then(function (response) {
alert(response.data);
$templateCache.removeAll();
fill();
});
}
}
$scope.edit = function (s) {
EmpService.Get(s).then(function (response) {
$scope.EMP = response.data;
});
}
$scope.reset = function ()
{
CLR();
}
})
.factory("EmpService", function ($http) {
var fac = {};
fac.Save = function (x) {
return $http({
url: "/Home/Save",
method: "Post",
data: x
});
}
fac.Update = function (x) {
return $http({
url: "/Home/Update",
method: "Post",
data: x
});
}
fac.Gets = function () {
return $http({
url: "/Home/Gets",
method: "Get"
});
}
fac.Get = function (S) {
return $http({
url: "/Home/Get?EID=" + S,
method: "Get"
});
}
fac.Delete = function (S) {
return $http({
url: "/Home/Delete?EID=" + S,
method: "Get"
});
}
return fac;
});
}());
</script>
No comments:
Post a Comment