1. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 1
Asalam U Alaikum!
Today I teach you the implementation of following:
Entity frame work
Ajax
Ok let start open your VS 2012
Entity frame work has 3 different approaches that are:
First database approach
First Model approach
Code first approach
We cover Database first approach, it means we have database and we only use entity frame work, we
have one benefit of using entity frame work is that we do not write database code in Model, and this is
major reason we use entity frame work instead of Mvc but still Mvc is strong concept anyways let start
the implementation,
After opening VS 2012 make database with following fields,
Database name: Student
Table name: Info (Id, Name, Address, Age, Semester, Interest)
Here we do some little variation that is now we do not make only controller instead we make controller
for each view/action method for example we have three action method named add , delete , update so
we have three different controllers named Add controller , delete and update and so on etc.
Ok finally I teach you about Ajax that is very important for paper point of you, with the help of Ajax we
update only part of page instead of refreshing whole webpage and off course data validation.
Let introduced myself:
My name is Salman Mushtaq and I am form Lahore if you feel any problem contact me any time my
contact detail is:
Salman Mushtaq
03337465571
Mitf12a00@pucit.edu.pk
Face book: https://www.facebook.com/salman.mushtaq.39
2. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 2
Step 1 : Open Visual Studio 2012
Step 2: Create new project
3. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 3
Step 3:
Step 4:
4. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 4
Step 5: Wait …
Step 6:
5. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 5
You see in last picture the blank page with some option on left and right side will appear, first of all
create database in
Reference => App_Data => Add => New Item => Database (You will it done previously) . . .
After making database
Go to Model then
Add then
New Item then
Then
6. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 6
Then
Remember Data Context class name because it is very important it control the database connection,
7. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 7
Now
When you click on finish following classes will be add in Model
8. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 8
Now make controller, initially we have only one controller but it’s your assignment to add different
controllers for each view/action method.
Our Controller name is Home and the way how create controller you done previously.
We know that if we have some action method and that action method return its own view then we must
create its view, so we have Index action method so we must make view named Index. Cshtml.
Action method Index
public ActionResult Index()
{
StudentEntities cx = new StudentEntities();
var l = cx.Infoes.ToList();
return View(l);
}
View Index
@model List<Mvc5.Models.Info>
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
<table>
@foreach (var x in Model)
{
<tr>
<td>@x.Name</td>
<td><a href="/Home/Detail/@x.Id">Detail</a></td>
<td>|</td>
<td><a href="/Home/Delete/@x.Id">Delete</a></td>
<td>|</td>
<td><a href="/Home/Update/@x.Id">Update</a></td>
</tr>
}
</table>
9. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 9
</div>
</body>
</html>
Output:
Ok now we see that if you experience MVC, this code is how easy we do not interact with database and
SQL Queries this is benefit of Entity frame work.
Now we want that when we click on detail the detail of following person will show so we make another
action method Detail and its view but have link of Go back.
Action method Detail:
public ActionResult Detail(int id)
{
StudentEntities cx = new StudentEntities();
var q = cx.Infoes.Find(id);
return View(q);
}
11. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 11
Ok if I click on Go back the navigation is performed from Detail to index, wow how work
is simple and easy now, further we develop whole application.
Ok let start now we want that if we click on Delete the record will be deleted and page
navigate to Index page with new data.
We make another action method Delete but we do not need View because it directly navigate
to Index.
Action method Delete:
public ActionResult Delete(int id)
{
StudentEntities cx = new StudentEntities();
var q = cx.Infoes.Find(id);
cx.Infoes.Remove(q);
cx.SaveChanges();
var l = cx.Infoes.ToList();
return View("Index",l);
}
Ok now we want that when we click on Update the Page is open and the updating is occur.
12. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 12
Now we need another Action method Update and view that show detail or fields to be
updated and a button.
Action Method Update:
public ActionResult Update(int id)
{
StudentEntities cx = new StudentEntities();
var q = cx.Infoes.Find(id);
return View(q);
}
View Update:
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Update</title>
</head>
<body>
<div>
<form action="/Home/update" method="Post">
<table>
<tr>
<td>Name:</td>
<td><input type="text" name="Name" value="@Model.Name" /></td>
</tr>
<tr>
<td>Age:</td>
<td><input type="text" name="Age" value="@Model.Age" /></td>
</tr>
<tr>
<td>Address:</td>
<td><input type="text" name="Address" value="@Model.Address" /></td>
</tr>
<tr>
<td>Interest</td>
<td><input type="text" name="Name" value="@Model.Interest" /></td>
</tr>
<tr>
<td><input type="submit" value="Update" /></td>
<td><a href="/Home/Index">Go back</a></td>
<td><input type="hidden" name="Id" value="@Model.Id" /></td>
</tr>
</table>
</form>
13. Entity frame work by Salman Mushtaq
Salman Mushtaq Page 13
</div>
</body>
</html>
Method update:
[HttpPost]
public ActionResult update()
{
int Id = int.Parse(Request["ID"]);
string Name = Request["Name"];
int Age = int.Parse(Request["Age"]);
string Address = Request["Address"];
string Interest = Request["Interest"];
StudentEntities cx = new StudentEntities();
var q = cx.Infoes.Find(Id);
q.Name = Name;
q.Age = Age;
q.Address = Address;
q.Interest = Interest;
cx.SaveChanges();
var l = cx.Infoes.ToList();
return View("Index", l);
}
Hope you understand.