view model
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace Allcontrols.Models
{
public class LEMP
{
public int id { get; set; }
public string label { get; set; }
}
public class EMPVM
{
public int EID { get; set; }
public string NAME { get; set; }
public string ADDRESS { get; set; }
public string PASSWORD { get; set; }
public string GENDER { get; set; }
public bool? ISMARRIED { get; set; }
public int? CID { get; set; }
public int? SID { get; set; }
public List<LEMP> HLIST { get; set; }
public EMPVM()
{
HLIST = new List<LEMP>();
}
}
}
Web Api :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using Allcontrols.Models;
namespace Allcontrols.Controllers
{
[RoutePrefix("api/Empservices")]
public class EmpservicesController : ApiController
{
[HttpGet]
[Route("Countries")]
public HttpResponseMessage Countries()
{
try
{
using (Database1Entities obj = new Database1Entities())
{
var cData = obj.COUNTRies.ToList();
if (cData.Count > 0)
{
return Request.CreateResponse(HttpStatusCode.OK, cData);
}
else
return Request.CreateErrorResponse(HttpStatusCode.NoContent, "Data not avalible.");
}
}
catch (Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
}
}
[HttpGet]
[Route("States/{CID:int}")]
public HttpResponseMessage States(int CID)
{
try
{
using (Database1Entities obj = new Database1Entities())
{
var cData = obj.STATEs.Where(m=>m.CID==CID).ToList();
if (cData.Count > 0)
{
return Request.CreateResponse(HttpStatusCode.OK, cData);
}
else
return Request.CreateErrorResponse(HttpStatusCode.NoContent, "Data not avalible.");
}
}
catch (Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
}
}
[HttpGet]
[Route("Hobbies")]
public HttpResponseMessage Hobbies()
{
try
{
using (Database1Entities obj = new Database1Entities())
{
var cData = obj.HOBBies.ToList();
if (cData.Count > 0)
{
return Request.CreateResponse(HttpStatusCode.OK, cData.Select(m=>new {id=m.HID, label=m.HNAME }).ToList());
}
else
return Request.CreateErrorResponse(HttpStatusCode.NoContent, "Data not avalible.");
}
}
catch (Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
}
}
[HttpGet]
[Route("Emps")]
public HttpResponseMessage Emps()
{
try
{
using (Database1Entities obj = new Database1Entities())
{
var cData = obj.EMPs.ToList();
if (cData.Count > 0)
{
return Request.CreateResponse(HttpStatusCode.OK, cData);
}
else
return Request.CreateErrorResponse(HttpStatusCode.NoContent, "Data not avalible.");
}
}
catch (Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
}
}
[HttpGet]
[Route("Emp/{EID:int}",Name ="GetEmp")]
public HttpResponseMessage Emp(int EID)
{
try
{
using (Database1Entities obj = new Database1Entities())
{
var cData = (from x in obj.EMPs
select new { x.EID, x.NAME, x.ADDRESS, x.PASSWORD, x.GENDER, x.ISMARRIED, x.CID, x.SID, HLIST = obj.HOBBies.Where(m => obj.EMPHMAPINGs.Where(p => p.EID == x.EID).Select(t => t.HID).Contains(m.HID)).Select(k => new { id = k.HID, label = k.HNAME }).ToList() }).SingleOrDefault(n => n.EID == EID);
if (cData!=null)
{
return Request.CreateResponse(HttpStatusCode.OK, cData);
}
else
return Request.CreateErrorResponse(HttpStatusCode.NoContent, "Data not avalible.");
}
}
catch (Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
}
}
[HttpPost]
[Route("Save")]
public HttpResponseMessage Save([FromBody]EMPVM emp)
{
try
{
using (Database1Entities obj = new Database1Entities())
{
var cData = emp;
if (cData!=null)
{
EMP Emp = new EMP();
Emp.EID = emp.EID;
Emp.NAME = emp.NAME;
Emp.ADDRESS = emp.ADDRESS;
Emp.PASSWORD = emp.PASSWORD;
Emp.GENDER = emp.GENDER;
Emp.ISMARRIED = emp.ISMARRIED;
Emp.CID = emp.CID;
Emp.SID = emp.SID;
obj.EMPs.Add(Emp);
obj.SaveChanges();
obj.EMPHMAPINGs.AddRange(emp.HLIST.Select(p => new EMPHMAPING { EID = emp.EID, HID=p.id}).ToList());
obj.SaveChanges();
var request= Request.CreateResponse(HttpStatusCode.Created, "Data Saved.");
request.Headers.Location = new Uri(Url.Link("GetEmp", new { EID = emp.EID }));
return request;
}
else
return Request.CreateErrorResponse(HttpStatusCode.NoContent, "Data not avalible.");
}
}
catch (Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
}
}
[HttpPut]
[Route("Update/{EID:int}")]
public HttpResponseMessage Update([FromUri]int EID,[FromBody]EMPVM emp)
{
try
{
using (Database1Entities obj = new Database1Entities())
{
var cData = emp;
if (cData != null)
{
EMP Emp = obj.EMPs.Find(emp.EID);
Emp.NAME = emp.NAME;
Emp.ADDRESS = emp.ADDRESS;
Emp.PASSWORD = emp.PASSWORD;
Emp.GENDER = emp.GENDER;
Emp.ISMARRIED = emp.ISMARRIED;
Emp.CID = emp.CID;
Emp.SID = emp.SID;
obj.SaveChanges();
obj.EMPHMAPINGs.AddRange(emp.HLIST.Select(p => new EMPHMAPING { EID = emp.EID, HID = p.id }).ToList());
obj.SaveChanges();
obj.EMPHMAPINGs.RemoveRange(obj.EMPHMAPINGs.Where(m => m.EID == emp.EID));
obj.SaveChanges();
obj.EMPHMAPINGs.AddRange(emp.HLIST.Select(m=>new EMPHMAPING { EID=emp.EID,HID=m.id }).ToList());
obj.SaveChanges();
return Request.CreateResponse(HttpStatusCode.OK, "Data Updated.");
}
else
return Request.CreateErrorResponse(HttpStatusCode.NoContent, "Data not avalible.");
}
}
catch (Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
}
}
[HttpDelete]
[Route("Delete/{EID:int}")]
public HttpResponseMessage Delete([FromUri]int EID)
{
try
{
using (Database1Entities obj = new Database1Entities())
{
var cData = obj.EMPs.Find(EID);
if (cData != null)
{
obj.EMPs.Remove(cData);
obj.SaveChanges();
obj.EMPHMAPINGs.RemoveRange(obj.EMPHMAPINGs.Where(m=>m.EID==EID));
obj.SaveChanges();
return Request.CreateResponse(HttpStatusCode.OK, "Data Deleted.");
}
else
return Request.CreateErrorResponse(HttpStatusCode.NoContent, "Data not avalible.");
}
}
catch (Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
}
}
[HttpPost]
[Route("Mdelete")]
public HttpResponseMessage Mdelete([FromBody]List<int> lemps)
{
try
{
using (Database1Entities obj = new Database1Entities())
{
if (lemps != null)
{
obj.EMPs.RemoveRange(obj.EMPs.Where(m => lemps.Contains(m.EID)));
obj.SaveChanges();
obj.EMPHMAPINGs.RemoveRange(obj.EMPHMAPINGs.Where(m =>lemps.Contains(m.EID.Value)));
obj.SaveChanges();
return Request.CreateResponse(HttpStatusCode.OK, "Data Deleted.");
}
else
return Request.CreateErrorResponse(HttpStatusCode.NoContent, "Data not avalible.");
}
}
catch (Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
}
}
}
}
Angular js :
<!DOCTYPE html>
<html ng-app="app">
<head>
<title></title>
<style>
.body-content {
padding-top: 50px;
}
.checkbox {
padding: 0;
margin: 0;
}
.dropdown-menu {
overflow: auto !important;
}
.form-group div {
display: inline-block;
margin-right: 10px;
}
.TBL {
border: solid 1px #000000;
height: auto;
width: auto;
}
.btn-group > .btn:first-child {
width:359px !important;
}
.dropdown-menu {
width:359px !important;
}
thead {
background-color:#3276b1;
color:#fff;
border-color:285e8e;
}
</style>
<meta charset="utf-8" />
<link rel="stylesheet" href="Content/bootstrap.min.css" />
<link rel="stylesheet" href="Content/DataTables/css/jquery.dataTables.css" />
<link rel="stylesheet" href="Content/DataTables/css/jquery.dataTables_themeroller.css" />
<script type="text/javascript" src="Scripts/jquery-1.10.2.js"></script>
<script type="text/javascript" src="Scripts/DataTables/jquery.dataTables.js"></script>
<script type="text/javascript" src="Scripts/angular.js"></script>
<script type="text/javascript" src="Scripts/lodash.js"></script>
<script type="text/javascript" src="Scripts/angular-datatables.js"></script>
<script type="text/javascript" src="Scripts/angularjs-dropdown-multiselect.js"></script>
</head>
<body>
<div class="container" ng-controller="Ctrl" style="margin-top:10px">
<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" class="form-control" tabindex="1" ng-model="EMP.EID" name="txtEid" required />
</div>
<span class="has-error help-block" ng-show="frmEmp.txtEid.$invalid && frmEmp.txtEid.$touched">
EID should not 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" class="form-control" tabindex="2" ng-model="EMP.NAME" name="txtName" required />
</div>
<span class="has-error help-block" ng-show="frmEmp.txtName.$invalid && frmEmp.txtName.$touched">
Name should not blank.
</span>
</div>
<div class="form-group " ng-class="{'has-error':frmEmp.txtAddrress.$invalid,'has-success':frmEmp.txtAddrress.$valid}">
<label class="control-label col-lg-4">ADDRESS</label>
<div class="col-lg-4">
<textarea class="form-control" tabindex="3" ng-model="EMP.ADDRESS" name="txtAddrress" required></textarea>
</div>
<span class="has-error help-block" ng-show="frmEmp.txtAddrress.$invalid && frmEmp.txtAddrress.$touched">
Address should not blank.
</span>
</div>
<div class="form-group " ng-class="{'has-error':frmEmp.txtPwd.$invalid,'has-success':frmEmp.txtPwd.$valid}">
<label class="control-label col-lg-4">PASSWORD</label>
<div class="col-lg-4">
<input type="password" tabindex="4" class="form-control" ng-model="EMP.PASSWORD" name="txtPwd" required ng-minlength="6" ng-maxlength="8" />
</div>
<span class="has-error help-block">
<span ng-show="frmEmp.txtPwd.$error.required && frmEmp.txtPwd.$touched">
Password should not blank.
</span>
<span ng-show="frmEmp.txtPwd.$error.minlength">
Password min length 6.
</span>
<span ng-show="frmEmp.txtPwd.$error.maxlength">
Password max length 8.
</span>
</span>
</div>
<div class="form-group " ng-class="{'has-error':frmEmp.rb.$invalid,'has-success':frmEmp.rb.$valid}">
<label class="control-label col-lg-4">GENDER</label>
<div class="col-lg-4">
<input type="radio" class="radio-inline" ng-model="EMP.GENDER" tabindex="5" name="rb" required value="Male" />Male
<input type="radio" class="radio-inline" ng-model="EMP.GENDER" tabindex="6" name="rb" required value="Female" />Female
</div>
<span class="has-error help-block" ng-show="frmEmp.rb.$invalid && frmEmp.rb.$touched">
Please select a gender.
</span>
</div>
<div class="form-group " ng-class="{'has-success':true}">
<label class="control-label col-lg-4 " >ARE YOU MARRIED ?</label>
<div class="col-lg-4">
<input type="checkbox" class="checkbox-inline" ng-model="EMP.ISMARRIED" tabindex="6" />
</div>
</div>
<div class="form-group " ng-class="{'has-error':frmEmp.ddl.$invalid,'has-success':frmEmp.ddl.$valid}">
<label class="control-label col-lg-4">COUNTRY</label>
<div class="col-lg-4">
<select class="form-control" ng-model="EMP.CID" ng-options="c.CID as c.CNAME for c in listc" tabindex="7" ng-change="fillddl()" name="ddl" required>
<option value="">Select</option>
</select>
</div>
<span class="has-error help-block" ng-show="frmEmp.ddl.$invalid && frmEmp.ddl.$touched">
Please select a country.
</span>
</div>
<div class="form-group " ng-class="{'has-error':frmEmp.ddls.$invalid,'has-success':frmEmp.ddls.$valid}">
<label class="control-label col-lg-4">STATE</label>
<div class="col-lg-4">
<select class="form-control" ng-model="EMP.SID" ng-options="c.SID as c.SNAME for c in lists" tabindex="8" name="ddls" required>
<option value="">Select</option>
</select>
</div>
<span class="has-error help-block" ng-show="frmEmp.ddls.$invalid && frmEmp.ddls.$touched">
Please select a state.
</span>
</div>
<div class="form-group " ng-class="{'has-success':true}">
<label class="control-label col-lg-4">HOBBY</label>
<div class="col-lg-4">
<div style="width:200px" ng-dropdown-multiselect="" extra-settings="dropdownSetting"
options="Hobbies" selected-model="EMP.HLIST" checkboxes="true">
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-lg-4"></label>
<div class="col-lg-4">
<input type="button" class="btn btn-primary" tabindex="10" value="Save" ng-click="save(frmEmp.$valid)" style="width:80px" />
<input type="button" class="btn btn-primary" tabindex="10" value="Update" ng-click="update(frmEmp.$valid)" style="width:80px" />
<input type="button" class="btn btn-primary" tabindex="10" value="Reset" ng-click="reset()" style="width:80px" />
<input type="button" value="Delete All" class="btn btn-primary" ng-click="deleteall()" />
</div>
</div><br /><br />
<div class="TBL">
<table id="dt" datatable="" dt-options="dtOptions" dt-columns="dtColumns" class="table table-bordered table-hover table-condensed table-responsive table-striped"></table>
</div>
</form>
</div>
<script type="text/javascript">
angular.module("app", ["angularjs-dropdown-multiselect", "datatables"])
.controller("Ctrl", function ($scope, Empservice, $compile, $window, DTOptionsBuilder, DTColumnBuilder) {
Empservice.Getc().then(function (promise) {
$scope.listc = promise.data;
});
$scope.fillddl = function () {
fx($scope.EMP.CID);
}
function fx(s) {
Empservice.Gets(s).then(function (promise) {
$scope.lists = promise.data;
});
}
Empservice.Geth().then(function (promise) {
$scope.Hobbies = promise.data;
});
function CLR() {
$scope.dropdownSetting = {
scrollable: true,
scrollableHeight: '200px',
}
$scope.EMP = {
EID: null,
NAME: null,
ADDRESS: null,
PASSWORD: null,
GENDER: null,
ISMARRIED: true,
CID: null,
SID: null,
HLIST: []
};
} CLR();
function fill() {
$scope.arr = [];
$scope.selected = {};
$scope.selectAll = false;
$scope.toggleAll = toggleAll;
$scope.toggleOne = toggleOne;
var titleHtml = '<input type="checkbox" ng-model="selectAll" ng-click="toggleAll(selectAll, selected)">';
$scope.dtColumns = [
DTColumnBuilder.newColumn(null).withTitle(titleHtml).notSortable()
.renderWith(function (data, type, full, meta) {
$scope.selected[full.EID] = false;
return '<input type="checkbox" ng-model="selected[' + data.EID + ']" ng-click="toggleOne(selected)">';
}).withClass("text-center"),
DTColumnBuilder.newColumn('EID').withTitle('Eid'),
DTColumnBuilder.newColumn("NAME", "Name"),
DTColumnBuilder.newColumn(null).withTitle('ACTION').notSortable()
.renderWith(function (data, type, full, meta) {
return '<button class="glyphicon glyphicon-edit" ng-click="edit(' + data.EID + ')">' +
'</button> ' +
'<button class="glyphicon glyphicon-remove" ng-click="delete(' + data.EID + ')">' +
'</button>';
})
]
$scope.dtOptions = DTOptionsBuilder.newOptions()
.withOption('stateSave', true)
.withOption('responsive', true)
.withOption("bProcessing", true)
.withOption('bFilter', true)
.withOption('ajax', {
url: "http://localhost:6168/api/Empservices/Emps",
type: "Get",
catch: false
})
.withOption('aLengthMenu', [[2, 10, 25, 50, -1], [2, 10, 25, 50, "All"]])
.withPaginationType('full_numbers')
.withDisplayLength(2)
.withOption('headerCallback', function (header) {
if (!$scope.headerCompiled) {
$scope.headerCompiled = true;
$compile(angular.element(header).contents())($scope);
}
})
.withOption('createdRow', function (row, data, dataIndex) {
$compile(angular.element(row).contents())($scope);
});
function toggleAll(selectAll, selectedItems) {
for (var id in selectedItems) {
if (selectedItems.hasOwnProperty(id)) {
selectedItems[id] = selectAll;
}
}
}
function toggleOne(selectedItems) {
for (var id in selectedItems) {
if (selectedItems.hasOwnProperty(id)) {
if (!selectedItems[id]) {
$scope.selectAll = false;
return;
}
}
}
$scope.selectAll = true;
}
} fill();
$scope.save = function (isValid) {
if (isValid) {
Empservice.Save($scope.EMP).then(function (promise) {
alert(promise.data);
$window.location.reload();
});
}
}
$scope.update = function (isValid) {
if (isValid) {
Empservice.Update($scope.EMP).then(function (promise) {
alert(promise.data);
$window.location.reload();
});
}
}
$scope.edit = function (eid) {
Empservice.Get(eid).then(function (promise) {
fx(promise.data.CID);
$scope.EMP = promise.data;
});
}
$scope.delete = function (eid) {
if (confirm('Do you want to delete it ?')) {
Empservice.Delete(eid);
$window.location.reload();
}
}
$scope.deleteall = function () {
angular.forEach($scope.selected, function (i, j) {
if (i == true) {
$scope.arr.push(j);
}
});
if (confirm('Do you want to delete selected items from the list ?')) {
Empservice.Deleteall($scope.arr).then(function (promise) {
alert(promise.data);
$window.location.reload();
});
}
}
$scope.reset = function () {
CLR();
}
}).service("Empservice", function ($http) {
this.Gete = function () {
return $http.get("http://localhost:6168/api/Empservices/Emps");
}
this.Get = function (EID) {
return $http.get("http://localhost:6168/api/Empservices/Emp/" + EID);
}
this.Getc = function () {
return $http.get("http://localhost:6168/api/Empservices/Countries");
}
this.Gets = function (CID) {
return $http.get("http://localhost:6168/api/Empservices/States/" + CID);
}
this.Geth = function () {
return $http.get("http://localhost:6168/api/Empservices/Hobbies");
}
this.Save = function (emp) {
return $http.post("http://localhost:6168/api/Empservices/Save", emp);
}
this.Update = function (emp) {
return $http.put("http://localhost:6168/api/Empservices/Update/" + emp.EID, emp);
}
this.Delete = function (EID) {
$http.delete("http://localhost:6168/api/Empservices/Delete/" + EID);
}
this.Deleteall = function (lemp) {
return $http.post("http://localhost:6168/api/Empservices/Mdelete", lemp);
}
});
</script>
</body>
</html>
No comments:
Post a Comment