Controller :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcApplication7.Models;
using System.Data.Entity;
namespace MvcApplication7.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
[OutputCache(Duration=0)]
public JsonResult Gets()
{
using (Database1Entities obj = new Database1Entities())
{
return Json(obj.EMPs.ToList(), JsonRequestBehavior.AllowGet);
}
}
public JsonResult Get(int Id)
{
using (Database1Entities obj = new Database1Entities())
{
return Json(obj.EMPs.SingleOrDefault(m=>m.EID==Id), JsonRequestBehavior.AllowGet);
}
}
public JsonResult Getc()
{
using (Database1Entities obj = new Database1Entities())
{
List<COUNTRY> lst = new List<COUNTRY>() { new COUNTRY() { CID=0, CNAME="Select" } };
return Json(lst.Union(obj.COUNTRies).ToList(), JsonRequestBehavior.AllowGet);
}
}
public JsonResult Getcn(int cid)
{
using (Database1Entities obj = new Database1Entities())
{
return Json(obj.COUNTRies.SingleOrDefault(m=>m.CID==cid).CNAME, JsonRequestBehavior.AllowGet);
}
}
public JsonResult Getsn(int sid)
{
using (Database1Entities obj = new Database1Entities())
{
return Json(obj.STATEs.SingleOrDefault(m => m.SID == sid).SNAME, JsonRequestBehavior.AllowGet);
}
}
public JsonResult Getst(int cid)
{
using (Database1Entities obj = new Database1Entities())
{
List<STATE> lst = new List<STATE>() { new STATE() { SID = 0, SNAME = "Select" } };
return Json(lst.Union(obj.STATEs.Where(m=>m.CID==cid)).ToList(), JsonRequestBehavior.AllowGet);
}
}
public string Save(EMP emp)
{
using (Database1Entities obj = new Database1Entities())
{
obj.Entry(emp).State = EntityState.Added;
obj.SaveChanges();
return "Data Saved";
}
}
public string Update(EMP emp)
{
using (Database1Entities obj = new Database1Entities())
{
obj.Entry(emp).State = EntityState.Modified;
obj.SaveChanges();
return "Data Updated";
}
}
public string Delete(EMP emp)
{
using (Database1Entities obj = new Database1Entities())
{
obj.Entry(emp).State = EntityState.Deleted;
obj.SaveChanges();
return "Data Deleted";
}
}
}
}
View :
<link href="~/bootstrap-3.3.5-dist/bootstrap-3.3.5-dist/css/bootstrap.min.css" rel="stylesheet" />
<link href="~/bootstrap-3.3.5-dist/bootstrap-3.3.5-dist/css/bootstrap-theme.min.css" rel="stylesheet" />
<script src="~/Scripts/jquery-2.1.4.min.js"></script>
<script src="~/Scripts/angular.min.js"></script>
<script src="~/Scripts/dirPagination.js"></script>
<style>
.sort-icon {
font-size: 9px;
margin-left: 5px;
}
th {
cursor: pointer;
}
</style>
<br /><br />
<div class="container" ng-app="app" ng-controller="Ctr">
<form class="form-horizontal">
<div class="form-group">
<label class="col-lg-3 control-label">EID</label>
<div class="col-lg-3">
<input type="text" ng-model="EMP.EID" id="tb" class="form-control" />
</div>
</div>
<div class="form-group">
<label class="col-lg-3 control-label">NAME</label>
<div class="col-lg-3">
<input type="text" ng-model="EMP.NAME" class="form-control" />
</div>
</div>
<div class="form-group">
<label class="col-lg-3 control-label">ADDRESS</label>
<div class="col-lg-3">
<textarea ng-model="EMP.ADDRESS" class="form-control"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-lg-3 control-label">PASSWORD</label>
<div class="col-lg-3">
<input type="password" ng-model="EMP.PASSWORD" class="form-control" />
</div>
</div>
<div class="form-group">
<label class="col-lg-3 control-label">GENDER</label>
<div class="col-lg-3">
<input type="radio" ng-model="EMP.GENDER" value="Male" />Male
<input type="radio" ng-model="EMP.GENDER" value="Female" />Female
</div>
</div>
<div class="form-group">
<label class="col-lg-3 control-label">COUNTRY</label>
<div class="col-lg-3">
<select id="ddl" ng-model="EMP.CID" class="form-control">
<option ng-repeat="c in listc" value={{c.CID}}>{{c.CNAME}}</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-lg-3 control-label">STATE</label>
<div class="col-lg-3">
<select id="ddl1" ng-model="EMP.SID" class="form-control">
<option ng-repeat="c in lists" value={{c.SID}}>{{c.SNAME}}</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-lg-3 control-label"></label>
<div class="col-lg-3">
<input type="button" value="Save" class="btn btn-primary" ng-click="save()" style="width:80px" />
<input type="button" value="Update" class="btn btn-primary" ng-click="update()" style="width:80px" />
<input type="button" value="Reset" class="btn btn-primary" ng-click="reset()" style="width:80px" />
</div>
</div>
<div class="form-group">
<label class="col-lg-1 control-label">Search</label>
<div class="col-lg-11">
<input type="text" ng-model="search" class="form-control" style="width:200px" />
</div>
</div>
<div class="row">
<table class="table table-bordered table-hover table-responsive table-striped">
<thead class="bg-primary">
<tr>
<th ng-click="order('EID')">
EID
<span class="glyphicon sort-icon" ng-show="sortKey=='EID'" ng-class="{'glyphicon-chevron-up':reverse,'glyphicon-chevron-down':!reverse}"></span>
</th>
<th ng-click="order('NAME')">
NAME
<span class="glyphicon sort-icon" ng-show="sortKey=='NAME'" ng-class="{'glyphicon-chevron-up':reverse,'glyphicon-chevron-down':!reverse}"></span>
</th>
<th>UPDATE</th>
<th>DELETE</th>
</tr>
</thead>
<tbody>
<tr dir-paginate="c in list|filter:search|orderBy:predicate:reverse|itemsPerPage:2">
<td>{{c.EID}}</td>
<td>{{c.NAME}}</td>
<td><a ng-click="edit(c.EID)">Edit</a></td>
<td><a ng-click="del(c)">Delete</a></td>
</tr>
<tr>
<td colspan="4">
<dir-pagination-controls max-size="2"
direction-links="true"
boundary-links="true">
</dir-pagination-controls>
</td>
</tr>
</tbody>
</table>
</div>
</form>
</div>
<script type="text/javascript">
function emp()
{
EID = '';
NAME = '';
ADDRESS = '';
PASSWORD = '';
GENDER = '';
CID = '';
SID = '';
}
angular.module("app", ['angularUtils.directives.dirPagination']).controller("Ctr", function ($scope, $http)
{
var m;
m = $http({
url: '/Home/Getc',
method: 'Get',
});
m.then(function (d) {
$scope.listc = d.data;
});
function clear()
{
$scope.EMP = new emp();
$('#tb').focus();
$('#ddl :selected').text('');
$('#ddl1 :selected').text('');
} clear();
$('#ddl').change(function () {
fillddl($(this).val());
});
function fillddl(p)
{
m = $http({
url: '/Home/Getst',
method: 'post',
data: { cid: p }
});
m.then(function (d) {
$scope.lists = d.data;
});
}
function fill()
{
m = $http({
url: '/Home/Gets',
method: 'Get',
});
m.then(function (d) {
$scope.list = d.data;
});
} fill();
$scope.save = function ()
{
m = $http({
url: '/Home/save',
method: 'post',
data: { emp: $scope.EMP }
});
m.then(function (d) {
alert(d.data);
clear();
fill();
});
}
$scope.update = function () {
m = $http({
url: '/Home/update',
method: 'post',
data: { emp: $scope.EMP }
});
m.then(function (d) {
alert(d.data);
clear();
fill();
});
}
$scope.reset = function ()
{
clear();
}
$scope.edit = function (p) {
m = $http({
url: '/Home/Get',
method: 'post',
data: { Id: p }
});
m.then(function (d) {
$scope.EMP = d.data;
fillc(d.data.CID);;
fillddl(d.data.CID);
fills( d.data.SID);
});
}
function fillc(p)
{
m = $http({
url: '/Home/Getcn',
method: 'post',
data: { cid: p }
});
m.then(function (d) {
$('#ddl :selected').text(d.data);
});
}
function fills(p) {
m = $http({
url: '/Home/Getsn',
method: 'post',
data: { sid: p }
});
m.then(function (d) {
$('#ddl1 :selected').text(d.data);
});
}
$scope.del = function (p) {
if (confirm('Do you want to delete it ?'))
{
m = $http({
url: '/Home/Delete',
method: 'post',
data: { emp: p }
});
m.then(function (d) {
alert(d.data);
fill();
});
}
}
$scope.order = function (p) {
$scope.reverse = ($scope.predicate === p) ? !$scope.reverse : false;
$scope.predicate = p;
}
});
</script>
