Using WCF Services In ASP.NET MVC 5: Part Seventeen

Nitin Pandit
8y
21.1k
0
3

Article

Before reading this article, I highly recommend reading the previous parts of the series on ASP.NET:

Introduction

The main aim to write this article is that there are lot of articles and samples related to MVC using WCF, but there are not many articles and examples related to MVC and also there is no proper article that shows samples which explain how to display data from SQL Server database to MVC page using WCF. I planned to explain the following using a simple program:

In this article we will see in detail the following:

Create first WCF
Create Entity Framework
Create MVC to display the data from database result to bind in MVC page using WCF

PROJECT 1: WCF PROJECT

Step1: Go to Visual Studio 2013 and select "File" and "New Project.

New

Select "WCF Service Application" in list, then give a name to your project, here I have given it “WcfServiceLibrary1”.

Click on to Ok button to create a new project.

new

So here your project is created, I need to create a database, so just right click on to “App_Data”, select “Add” and then click on to “New Item”.

New Item

I’m going to create a SQL Database, select “Data” in left side of the page and select “SQL Server Database”, give a name to our database and then finally click on to “Add” button.

Add

Open your database by double clicking on your customer database in the App Data folder. Under customer database right click on Table to add a new table.

Add

I have created a table of customers with the following fields as shown in screenshot:

Click on to Update to create a table of customer.

create

Right click on table to add some data.

add

Add some data into your table as shown below.

table

Step2: Go to your project that is WCFLibrary1, right click on to this and select “Add”, then add a New Item.

Add

I need to add an “ADO.Net Entity Data Model”, so select it from menu and click on to “Add” button to add a model, give a name to your model, and finally click on to “Add” button.

Add

Now choose "EF Designer from database”, then click on to next button. We have already created our database.

database

Now choose your database from the dropdown and click on to “Next” button.

After that your database will retrieve, mark all the items in the table and hit on finish button.

finish

Here you can see that now we have created our Model1.edmx.

create

Step3: Now, go to the ISevice1.cs file and implement the method declared in the IService1.cs interface.

Delete the already present method in the IService1.cs file and make some changes over here.

method

And write the following code in the “List<customer>getcustomer()” method.

method

Service1.SVC: “Service1.svc.cs” implements the IService1 Interface, overrides and defines all the methods of the Operation Contract.

Delete the already present method in the Service1.svc.cs file and also make some changes over there.

method

And writing the following code, this code retrieves all the data of customer table.

code

Now run this service, there would be many URLs of different type of files like directory, packages, config, so here click on to “Service1.svc” file.

Then copy the following Url: http://localhost:54232/Service1.svc?singleWsdl

Project 2: MVC PROJECT

Step1: Go to your Solution “WcfServiceLibrary1” right click on to it to add a new project.

WcfServiceLibrary1

In the below figure select “Installed”, Visual C#, then click "ASP.NET Web Application", and here I have given the name of project “wcfusingmvc”, and then click on “OK” button.

wcfusingmvc

You can see the default MVC will be selected, select MVC and then click “OK” button.

Step2: Go to your Solution “wcfusingmvc”, I need to add some references in our solution, so right click on to project and select "Add Service Reference”

wcfusingmvc

Step3: A new window for service reference will open, paste the URL that you copied from the WcfServiceLibrary1 project into the Address Textbox, then click on to "Go", by which a namespace will be added. ServiceReference1 will be added into your project.

Then click OK button.

Now you can see, Service References1 is added in to references.

Step3: Right click on to your MVC Solution “wcfuisngmvc” and add a controller.

wcfuisngmvc

Now, select MVC5 Controller-Empty and then click on to Add button.

Add

Give a name to your controller, here I have given it “custController”, click on to add button to add it.

add

Step4: Right Click on to ServiceReference1 and select “Configure Service Reference”.

Configure

Now you can see a window is open, and in this window a checkbox is there which is markable.

window

Unmark the checkbox and then click on to OK button.

Step5: Now click on to custcontroller.cs controller, there will be Index ActionResult.

Index

You should write the following code in Index method.

method

Step6: Now create a view for Index, right click on to near Index and add a view.

add

View Name would be “Index” and select template as a “List”, And after that select your model class Model Class ”customer(wcfusingmvc.ServiceReference1)” from the dropdown menu.

And then click on Add button to add a view.

add

Now you can see an Index.cshtml view file.
code

Now all is ready for the use, save your project and run it by pressing F5 key.

Step7: Run the application. In the browser we can see our output that we able to access our database table in to browser with the help of WCF in MVC.

browser

That's all about how to use WCF in MVC.

I hope you enjoyed this article. Stay tuned with me for more articles on all other Microsoft technologies.

Thanks.

Connect (“Nitin Pandit”);