Showing posts with label Bootstrap. Show all posts

Tuesday, 19 June 2018

How to Make Your Website Respond to Different Mobile Devices

In the television show The Wire, one of the major problems the Barksdale organization faced was identifying and punishing thieves.

Early in season one, the character Stringer Bell approached one of his lieutenants (D’Angelo Barksdale), telling him that they had a snitch tipping off their stick-up crew.

Bell’s solution for identifying the thief was to withhold payment to the crew. The crew member that didn’t come asking for his money would be identified as the thief.

In trying to determine the unknown identity of their thief, Stringer and D’Angelo applied two elements:

A test
A set of conditions

Once those conditions were met — and the identity of the thief known — the punishment could be delivered.

When designing responsively our first goal is to identify the device our page is loading into. When we know the device, we can then impose our will onto the page and tell it what to do.

To achieve this, we apply tests and conditions which are called media queries.

WHAT IS A MEDIA QUERY?

A media query consists — essentially — of a media type and an expression to check for certain conditions of a particular media feature.

The most commonly used media feature is width.

By restricting CSS rules to the particular width of the device displaying a web page, we can tailor the page’s representation to devices (i.e. smartphones, tablets, netbooks, and desktops) with varying screen resolution.

In the example below, in order for the rule to be applied, the browser must meet two conditions:

The media type must be “screen”
The minimum width of that screen has to be at least 1024px

Any browser that meets both of the conditions will have the css style font-size: 100% applied to the body class, like so:

@media screen and (min-width: 1024px) {

body {

font-size: 100%;

}

APPLYING MORE SPECIFIC CONDITIONS TO THE TARGET DEVICE

Depending on the identity of your target device, you can vary the conditions and results.

Sometimes — like in the example above — you’re dealing with a large number of possible identities, and your conditions can hit them all.

Or, you can get a little more selective in your tests.

In season three of the Wire a soldier named Cutty had a pretty good idea of who’d been stealing from him, but needs to perform a couple tests to make sure.

In his case, the conditions were more selective: he watched the dealer and his girlfriend as they continually appeared in public sporting new clothes and new jewelry.

In this case, Cutty was chaining together the conditions that needed to be met.

We can do the same with media queries.

For example, you can target a particular mobile device and set different styles to render within in it depending on whether the device is being held in landscape or portrait mode.

You can chain those different conditions together like so:

@media screen and (min-device-width: 480px) and (orientation: landscape) {

body {

font-size: 100%;

}

TARGETING SPECIFIC DEVICES

Sometimes you know the exact identity of your target device and you want certain things to happen when your website loads within it.

Which brings us back to The Wire: Omar Little was a legendary stick-up man who robbed local drug dealers. Whenever he popped onto the radar, the scene usually ended up in a hail of gunfire.

Omar is very well known target.

Using a media query, we can target a specific mobile device, like an iPhone 4.

We know that it has a specific pixel ratio and uses a specific browser. With those specs in mind, we can set specific conditions to match that particular phone like so:

@media

only screen and (-webkit-min-device-pixel-ratio : 1.5),

only screen and (min-device-pixel-ratio : 1.5) {

body {

font-size: 90%;

}

Here are sample snippets of CSS that you can use to target specific mobile devices:

/* Smartphones (portrait and landscape) ----------- */

@media only screen

and (min-device-width : 320px)

and (max-device-width : 480px) {

/* Styles */

}

/* Smartphones (landscape) ----------- */

@media only screen

and (min-width : 321px) {

/* Styles */

}

/* Smartphones (portrait) ----------- */

@media only screen

and (max-width : 320px) {

/* Styles */

}

/* iPads (portrait and landscape) ----------- */

@media only screen

and (min-device-width : 768px)

and (max-device-width : 1024px) {

/* Styles */

}

/* iPads (landscape) ----------- */

@media only screen

and (min-device-width : 768px)

and (max-device-width : 1024px)

and (orientation : landscape) {

/* Styles */

}

/* iPads (portrait) ----------- */

@media only screen

and (min-device-width : 768px)

and (max-device-width : 1024px)

and (orientation : portrait) {

/* Styles */

}

/* Desktops and laptops ----------- */

@media only screen

and (min-width : 1224px) {

/* Styles */

}

/* Large screens ----------- */

@media only screen

and (min-width : 1824px) {

/* Styles */

}

/* iPhone 4 ----------- */

@media

only screen and (-webkit-min-device-pixel-ratio : 1.5),

only screen and (min-device-pixel-ratio : 1.5) {

/* Styles */

}

Thursday, 14 June 2018

How To Create Application Configuration With Two SignalR Hubs

1).first You Need to Create Owin Startup Class At Root Of the Project

Note: before doing code first you need to change sql database where notification table exist write this code in sql

ALTER DATABASE [DBNAME] SET ENABLE_BROKER WITH ROLLBACK IMMEDIATE

using Microsoft.Owin;
using Owin;


[assembly: OwinStartupAttribute(typeof(PowerHMS.Startup))]
namespace PowerHMS
{
public partial class Startup
{
public void Configuration(IAppBuilder app)
{
app.MapSignalR();


}
}
}

2).Set up Code Withing Global.aspx class

using System;
using System.Web;
using System.Web.Mvc;
using System.Web.Optimization;
using System.Web.Routing;

namespace MyProject
{
public class MvcApplication : System.Web.HttpApplication
{
//string con = ConfigurationManager.ConnectionStrings["sqlConString"].ConnectionString;

protected void Application_Start()
{
BundleConfig.RegisterBundles(BundleTable.Bundles);
AreaRegistration.RegisterAllAreas();
FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
RouteConfig.RegisterRoutes(RouteTable.Routes);
//SqlDependency.Start(con);
////new Code
NotificationComponent nc = new NotificationComponent();
var currentTime = DateTime.Now;
nc.RegisterNotification(currentTime);
}
protected void Session_Start(object sender, EventArgs e)
{ 
var currentTime = DateTime.Now;
HttpContext.Current.Session["LastUpdated"] = currentTime;
}
protected void Application_End()
{
//here we will stop Sql Dependency
//  SqlDependency.Stop(con);
}

}
}

3).Create A connection Class For SignalR

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

using System.Threading.Tasks;

using Microsoft.AspNet.SignalR;

namespace MyProject
{
public class NotificationHub : Hub
{
public readonly static ConnectionMapping<string> _connections = new ConnectionMapping<string>();


public override Task OnConnected()
{
string name = Context.User.Identity.Name;

_connections.Add(name, Context.ConnectionId);

return base.OnConnected();
}

public override Task OnDisconnected(bool stopCalled)
{
string name = Context.User.Identity.Name;

_connections.Remove(name, Context.ConnectionId);

return base.OnDisconnected(stopCalled);
}

public override Task OnReconnected()
{
string name = Context.User.Identity.Name;

if (!_connections.GetConnections(name).Contains(Context.ConnectionId))
{
_connections.Add(name, Context.ConnectionId);
}

return base.OnReconnected();
}
}

}

4).Create A Notification Component Class

using System;
using System.Collections.Generic;
using System.Configuration;
using System.Linq;
using System.Web;
using System.Data.SqlClient;
using Microsoft.AspNet.SignalR;


namespace MyProject
{

public class NotificationComponent
{
//Here we will add a function for register notification (will add sql dependency)
public void RegisterNotification(DateTime currentTime)
{
string conStr = ConfigurationManager.ConnectionStrings["sqlConString"].ConnectionString;
string sqlCommand = @"select [NotiMessage],[SenderID],[Recivers],[NofiTable],[NotiColumn],[NotiValue],[AddedOn],[ReadOn],[IsDeleted] from [dbo].[Notification] ";
//you can notice here I have added table name like this [dbo].[Contacts] with [dbo], its mendatory when you use Sql Dependency
using (SqlConnection con = new SqlConnection(conStr))
{
SqlCommand cmd = new SqlCommand(sqlCommand, con);
//cmd.Parameters.AddWithValue("@AddedOn", currentTime);
if (con.State != System.Data.ConnectionState.Open)
{
con.Open();
}
cmd.Notification = null;
SqlDependency sqlDep = new SqlDependency(cmd);
sqlDep.OnChange += sqlDep_OnChange;
//we must have to execute the command here
using (SqlDataReader reader = cmd.ExecuteReader())
{
// nothing need to add here now
}
}
}

void sqlDep_OnChange(object sender, SqlNotificationEventArgs e)
{
if (e.Type == SqlNotificationType.Change)
{
SqlDependency dependency = sender as SqlDependency;
dependency.OnChange -= sqlDep_OnChange;

var notificationHub = GlobalHost.ConnectionManager.GetHubContext<NotificationHub>();

foreach (var user in NotificationHub._connections.GetEnumerator())
{

foreach (var ids in NotificationHub._connections.GetConnections(user))
{
notificationHub.Clients.Client(ids).notify("added");
}

}

RegisterNotification(DateTime.Now);

}
}

GetNotificationsUser
}
}

5). Create Hubs

a).Schedulehub.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNet.SignalR;
using System.Threading.Tasks;

namespace MyProject
{
public class scheduleHub : Hub
{
public void Modify(string action, Object data)
{
Clients.Others.AddToSchedul(action, data);
}
public void Send(string GroupName,string message)
{
Clients.Others.addNewMessageToPage(HttpContext.Current.User.Identity.Name, message);
}
}
}

B).Notificationhub.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

using System.Threading.Tasks;

using Microsoft.AspNet.SignalR;

namespace MyProject
{
public class NotificationHub : Hub
{
public readonly static ConnectionMapping<string> _connections = new ConnectionMapping<string>();


public override Task OnConnected()
{
string name = Context.User.Identity.Name;

_connections.Add(name, Context.ConnectionId);

return base.OnConnected();
}

public override Task OnDisconnected(bool stopCalled)
{
string name = Context.User.Identity.Name;

_connections.Remove(name, Context.ConnectionId);

return base.OnDisconnected(stopCalled);
}

public override Task OnReconnected()
{
string name = Context.User.Identity.Name;

if (!_connections.GetConnections(name).Contains(Context.ConnectionId))
{
_connections.Add(name, Context.ConnectionId);
}

return base.OnReconnected();
}
}

}

6). Finally Create Code for Hub in javascript to communicate Dom

$(function () {

//Create SignalR Hub Server Connection
var connection = $.hubConnection("/signalr",
{
seDefaultPath: false
});

//Creating Proxy Hub For "ScheduleHub"  Hub
var scheduleHubProxy = connection.createHubProxy('scheduleHub');
//Creating Proxy Hub For "NotificationHub"  Hub
var notificationHub = connection.createHubProxy('notificationHub');

notificationHub.on('notify', function (message) {
if (message && message.toLowerCase() == "added") {
}
});
scheduleHubProxy.on('AddToSchedul', function (action, data) {
if (data != null) {
$("#Schedule1").ejSchedule('instance').notifyChanges(action, data);
var schedule = $("#Schedule1").data("ejSchedule");
}
});
connection.start().done(function () {
window.actionComplete = function (args) {
if (args.methodType == "public")
args.appointment = null;
if (args.methodType != "public" && (args.type == "appointmentCreated" || args.type == "appointmentEdited" || args.type == "appointmentDeleted" || args.type == "drag" || args.type == "navigation")) {
scheduleHubProxy.invoke('modify', args.type, args.appointment);
}
};
});
});

Monday, 11 June 2018

How to Use Bootstrap modal With Asp.net MVC and Angular Js

Before Add Entity Mode First You Need to Know How To Add New Project In Asp.net MVC for this Read My Privious Blog

1). How To Create proejct In Asp.net MVC using visual studio

2). How To Add Nuget Package or angular js Using Nuget in visual Studio

3). How to Add Asp.net MVC with Angular Js

4).How to add Data Entity Model in mvc

If you Already Know All the above Define concepts and code the Please skip and Read this blog Continue, Now Next Main objective is in this blog is how to add Data entity model in project ,with in new or in existing Project . To do Please Follow This Steps

C# Code

using System;
using System.Collections.Generic;
using System.Data.Entity;
using System.Data.Entity.Validation;
using System.IO;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.Mvc;
using AngularFirstWithMVC.DataEntity;
using AngularFirstWithMVC.Filter;
using AngularFirstWithMVC.Models;

namespace AngularFirstWithMVC.Controllers
{
[Authorize]
public class EmployeeController : Controller
{
// GET: Employee
public ActionResult Index()
{
return View();
}

public JsonResult GetEmployees()
{
using (FirstAngularJsWithMVCEntities db = new FirstAngularJsWithMVCEntities())
{
var Employee = db.Employees.Select(E => new EmployeeModel { id = E.id, UserId = E.UserId, phoneno = E.phoneno, Age = E.Age, Fname = E.Fname, address = E.address, }).ToList();

return Json(Employee, JsonRequestBehavior.AllowGet);
}
}

public ActionResult Create()
{

return View(new EmployeeModel());

}
[HttpPost]

public ActionResult Create(Employee employee)
{
if (!ModelState.IsValid)
return View(employee);
using (FirstAngularJsWithMVCEntities db = new FirstAngularJsWithMVCEntities())
{
var E = db.Employees.Add(employee);
if (db.SaveChanges() > 0)
{
return Json(new EmployeeModel { id = E.id, UserId = E.UserId, phoneno = E.phoneno, Age = E.Age, Fname = E.Fname, address = E.address, }, JsonRequestBehavior.AllowGet);
}
else
{
return Json(new { success = false, responseText = "The attached file is not supported." }, JsonRequestBehavior.AllowGet);
}
}

}

public ActionResult Export()
{
return View();

}

[HttpPost]
[ValidateInput(false)]
public FileResult Export(FormCollection frm)
{
string body = string.Empty;

using (StreamReader reader = new StreamReader(Server.MapPath("~/Views/Shared/invoice.cshtml")))
{
body = reader.ReadToEnd();
}

return File(Encoding.ASCII.GetBytes(body), "application/vnd.ms-excel", "Grid.xls");
}

public ActionResult Edit(int? id)
{

if (!id.HasValue)
return RedirectToAction("index");

using (FirstAngularJsWithMVCEntities db = new FirstAngularJsWithMVCEntities())
{
var E = db.Employees.Find(id);
return Json(new EmployeeModel { id = E.id, UserId = E.UserId, phoneno = E.phoneno, Age = E.Age, Fname = E.Fname, address = E.address, }, JsonRequestBehavior.AllowGet);
}

}

[HttpPost]

public ActionResult Edit(Employee employee)
{
if (!ModelState.IsValid)
return View(employee);
using (FirstAngularJsWithMVCEntities db = new FirstAngularJsWithMVCEntities())
{
var Emp = db.Employees.Find(employee.id);
if (Emp != null)
{

db.Entry(Emp).CurrentValues.SetValues(employee);
if (db.SaveChanges() > 0)
{
var E = db.Employees.Find(employee.id);
return Json(new EmployeeModel { id = E.id, UserId = E.UserId, phoneno = E.phoneno, Age = E.Age, Fname = E.Fname, address = E.address, }, JsonRequestBehavior.AllowGet);
}
else
{
return PartialView(employee);
}

}
else
return View(employee);
}

}
public ActionResult Details(int? id)
{
if (!id.HasValue)
return RedirectToAction("index");

using (FirstAngularJsWithMVCEntities db = new FirstAngularJsWithMVCEntities())
{
var E = db.Employees.Find(id);
return Json(new EmployeeModel { id = E.id, UserId = E.UserId, phoneno = E.phoneno, Age = E.Age, Fname = E.Fname, address = E.address, }, JsonRequestBehavior.AllowGet);
}

}

public ActionResult Delete(int? id)
{
if (!id.HasValue)
return RedirectToAction("index");

using (FirstAngularJsWithMVCEntities db = new FirstAngularJsWithMVCEntities())
{
var E = db.Employees.Find(id);
return Json(new EmployeeModel { id = E.id, UserId = E.UserId, phoneno = E.phoneno, Age = E.Age, Fname = E.Fname, address = E.address, }, JsonRequestBehavior.AllowGet);
}

}
[HttpPost]
public ActionResult Delete(int? id, Employee employee)
{
if (!ModelState.IsValid)
return View(employee);
using (FirstAngularJsWithMVCEntities db = new FirstAngularJsWithMVCEntities())
{
var Emp = db.Employees.Find(employee.id);
if (Emp != null)
{
db.Employees.Remove(Emp);
if (db.SaveChanges() > 0)
{
return Json(new EmployeeModel { id = employee.id, UserId = employee.UserId, phoneno = employee.phoneno, Age = employee.Age, Fname = employee.Fname, address = employee.address, }, JsonRequestBehavior.AllowGet);
}
else
{
return View(employee);
}
}
else
return View(employee);
}

}
}
}

__________________________________________________________________________
//AngularJs Employee controller
__________________________________________________________________________
/// <reference path="../angular.js" />
/// <reference path="../angular-route.min.js" />

// Define a Angular app module Property

var myEmp = angular.module('EmployeeApp', ["ui.bootstrap", "ngRoute"]);

// Angular Controller For Employee,and Property of Angular App Module Object (becouse of its a child of it)
myEmp.controller('EmployeeController', ['$scope', '$http', '$uibModal', '$location', '$timeout', 'Employeeservice', function ($scope, $http, $uibModal, $location, $timeout, Employeeservice) {
//Initialize Scope Employee list Object
$scope.Employee = [];
$scope.oldEmployee = {};
GetEmployee();
//Get Request Of All Employees
function GetEmployee() {
var Onsucess = function (data) {
$scope.Employee = data.data;
};
var OnError = function (error) {
$scope.status = 'Unable to load customer data: ' + error.message;
};
Employeeservice.GetEmployee().then(Onsucess, OnError);
}

//Get Request Of Create
$scope.open = function () {
$scope.employee = { id : 0, UserId: "", phoneno:"", Age :"", Fname : "", address : "" };
var modalInstance = $uibModal.open({
ariaLabelledBy: 'modal-title',
ariaDescribedBy: 'modal-body',
templateUrl: '/Views/Employee/Create.html',
scope: $scope,
}).result.then(function () { }, function (res) { });

}

//Get Request Of Edit
$scope.editEmployee = function (id) {

var Onsucess = function (data) {
$scope.employee = data.data;
$scope.oldEmployee = data.data;
console.log($scope.oldEmployee);
var modalInstance = $uibModal.open({
ariaLabelledBy: 'modal-title',
ariaDescribedBy: 'modal-body',
templateUrl: '/Views/Employee/Edit.html',
scope: $scope,
}).result.then(function () {

}, function (res) {

});
};
var OnError = function (error) {
$scope.status = 'Unable to load customer data: ' + error.message;
};
Employeeservice.GetEmp(id).then(Onsucess, OnError);
}
//Get Request Of Details
$scope.detailsEmployee = function (id) {
var Onsucess = function (data) {
$scope.employee = data.data;
var modalInstance = $uibModal.open({
ariaLabelledBy: 'modal-title',
ariaDescribedBy: 'modal-body',
templateUrl: '/Views/Employee/Details.html',
scope: $scope,
}).result.then(function () {

}, function (res) {

});
};
var OnError = function (error) {
$scope.status = 'Unable to load customer data: ' + error.message;
};
Employeeservice.GetEmp(id).then(Onsucess, OnError);
}

//Get Request Of Delete
$scope.deleteEmployee = function (id) {
var Onsucess = function (data) {
$scope.employee = data.data;
var modalInstance = $uibModal.open({
ariaLabelledBy: 'modal-title',
ariaDescribedBy: 'modal-body',
templateUrl: '/Views/Employee/Delete.html',
scope: $scope,
}).result.then(function () {

}, function (res) { });
};
var OnError = function (error) {
$scope.status = 'Unable to load customer data: ' + error.message;
};
Employeeservice.GetEmp(id).then(Onsucess, OnError);
};

//Post Request of Employee On Click Submit Button for Create new employee
$scope.submitEmployeeForm = function () {
var onSuccess = function (data, status, headers, config) {
$timeout(function () {
$('.close').trigger('click');
}, 100);
$scope.Employee.push(data.data);
console.log($scope.Employee);
};
var onError = function (data, status, headers, config) {
alert('Error occured.' + status);
}
Employeeservice.PostEmployee($scope.employee).then(onSuccess, onError);

};

//Post Request of Employee On Click Submit Button for Create new employee
$scope.UpdateEmployeeForm = function () {
var onSuccess = function (data, status, headers, config) {
$timeout(function () {
$('.close').trigger('click');
}, 100);
var index = $scope.Employee.indexOf($scope.oldEmployee);
$scope.Employee.splice(index, 1);
$scope.Employee.push(data.data);
};
var onError = function (data, status, headers, config) {
alert('Error occured.' + status);
}

Employeeservice.PutEmployee($scope.employee, $scope.antiForgeryToken).then(onSuccess, onError);
};

//Post Request of Employee On Click Submit Button for Remove employee
$scope.RemoveEmployeeForm = function () {
var onSuccess = function (data, status, headers, config) {
$timeout(function () {
$('.close').trigger('click');
}, 100);
var index = $scope.Employee.indexOf(data.data);
$scope.Employee.splice(index, 1);
};
var onError = function (data, status, headers, config) {
alert('Error occured.' + status);
}
Employeeservice.DeleteEmployee($scope.employee, $scope.antiForgeryToken).then(onSuccess, onError);

};

}]);

//Angular Factory service
myEmp.factory("Employeeservice", ["$http", function ($http) {
//initialize Employee service Object array
var Employeeservice = {};

//method of Employee service Object For Get Employee List
Employeeservice.GetEmp = function (id) {
return $http({
method: 'GET',
url: '/Employee/Edit/' + id
});
}
Employeeservice.GetEmployee = function () {
return $http({
method: 'GET',
url: '/Employee/GetEmployees'
});
}

//Below All Request Are Post Type Request Used For Perform ,create ,update ,delete Employee

//method of Employee service Object Post Request For New Employee Register
Employeeservice.PostEmployee = function (employee) {
return $http({
method: 'POST',
url: '/Employee/Create',
data: employee
});
}

//method of Employee service Object Put Request For Update Employee Register
Employeeservice.PutEmployee = function (employee) {
console.log(employee);
return $http({
method: 'POST',
url: '/Employee/Edit',
data: employee,

});
}
//method of Employee service Object delete Request For delete Employee Register
Employeeservice.DeleteEmployee = function (employee) {
return $http({
method: 'POST',
url: '/Employee/Delete',
data: employee,
});
}

return Employeeservice;
}]);

_________________________________________________________________________________

HTML Views

________________________________________________________________________________

//index.cshtml

@section Header

{

}

ViewBag.Title = "Employee List";

Layout = "~/Views/Shared/_Layout.cshtml";

}

<h2>Index</h2>

<ng-view>

</ng-view>

<span ng-click="open()" class="btn btn-primary">+ Create</span>

</div>

<option value="+Fname">Fname (asc)</option>

<option value="-Fname">Fname (dec)</option>

<option value="+address">Address (asc)</option>

<option value="-address">Address (dec)</option>

<option value="+phoneno">Phoneno (asc)</option>

<option value="-phoneno">Phoneno (dec)</option>

<option value="+UserId">UserId (asc)</option>

<option value="-UserId">UserId (dec)</option>

</select>

</div>

</div>

<tr>

<th>

@Html.DisplayName("Fname")

</th>

<th>

@Html.DisplayName("Age")

</th>

<th>

@Html.DisplayName("address")

</th>

<th>

@Html.DisplayName("phoneno")

</th>

<th>

@Html.DisplayName("UserId")

</th>

</tr>

<td>

</td>

<td>

</td>

<td>

</td>

<td>

</td>

<td>

</td>

<td>

<span ng-click="editEmployee(item.id)" class="btn btn-primary">Edit</span>|

<span ng-click="detailsEmployee(item.id)" class="btn btn-primary">Details</span>|

<span ng-click="deleteEmployee(item.id)" class="btn btn-primary">Delete</span>

</td>

</tr>

</table>

</div>

@section scripts{

@Scripts.Render("~/bundles/jqueryval")

@Scripts.Render("~/bundles/AngularController")

}

______________________________________________________________________________

// create.html

<h3 class="modal-title" id="modal-title">Create Employee</h3>

</button>

</div>

<label class="control-label col-md-2">Fname</label>

</div>

</div>

<label class="control-label col-md-2">address</label>

</div>

<label class="control-label col-md-2">phoneno</label>

</div>

<label class="control-label col-md-2">UserId</label>

</div>

<button class="btn btn-warning" type="button"

ng-click="$dismiss()">

Cancel

</button>

</div>

</form>

</div>

_________________________________________________________________________

//edit.html

<h3 class="modal-title" id="modal-title">Edit Employee</h3>

</button>

</div>

<label class="control-label col-md-2">Fname</label>

</div>

</div>

<label class="control-label col-md-2">address</label>

</div>

<label class="control-label col-md-2">phoneno</label>

</div>

<label class="control-label col-md-2">UserId</label>

</div>

<button class="btn btn-warning" type="button"

ng-click="$dismiss()">

Cancel

</button>

</div>

</form>

</div>

________________________________________________________________________________

//delete.html

<h3 class="modal-title" id="modal-title">Delete Employee</h3>

</button>

</div>

<label class="control-label col-md-2">Fname</label>

</div>

<label class="control-label col-md-2">address</label>

</div>

<span class="btn btn-danger">Do You Want To Delete Employee</span>

</div>

<button class="btn btn-warning" type="button"

ng-click="$dismiss()">

Cancel

</button>

</div>

</form>

</div>

_________________________________________________________________________

// Detials.html

<form >

<h3 class="modal-title" id="modal-title">Edit Employee</h3>

</button>

</div>

</div>

</div>

</div>

</div>

</div>

<button class="btn btn-warning" type="button"

ng-click="$dismiss()">

Cancel

</button>

</div>

</form>

</div>

</div>

Jokes & Entertaintment

add

Tuesday, 19 June 2018

How to Make Your Website Respond to Different Mobile Devices

How to Make Your Website Respond to Different Mobile Devices

Thursday, 14 June 2018

How To Create Application Configuration With Two SignalR Hubs

How To Create Application Configuration With Two SignalR Hubs

Monday, 11 June 2018

How to Use Bootstrap modal With Asp.net MVC and Angular Js

How to Use Bootstrap modal With Asp.net MVC and Angular Js

Jokes List