Create And Consume A User Control In MVC

Introduction

In this article we will learn how we can create and consume a user control in MVC. I hope you will like it.

Background

Today I got a requirement of working with CellSetGrid. Since it is supported with our normal Asp.Net web pages alone, I was in a need to convert the same to a user view control and consume it in MVC because my application is in MVC4. I have done the same. So I thought of sharing you that with you all.

Using the code

To do so, You need to follow the following steps.

Add reference to your control DLL

Create And Consume A User Control In MVC

Create And Consume A User Control In MVC

Add new Web User Control

Create And Consume A User Control In MVC

Create And Consume A User Control In MVC

Register your DLL reference

[html]
<%@ Register assembly="CellSetGrid2" namespace="OLAPControls" tagprefix="cc1" %>
[/html]

Place your control

[html]
<div>
<cc1:CellSetGrid2 id="csg2" runat="server" connectionstring="Data Source="Your DataSource"; Initial Catalog =Your DB Name"
cube="Your Cube Name" height="800px" width="1500px" />
</div>
[/html]

Change default namespace

Go to ADODMGrid.ascx.cs from the solution explorer.

Create And Consume A User Control In MVC

Change Namespace System.Web.UI.UserControl to System.Web.Mvc.ViewUserControl

Create Controller

Create And Consume A User Control In MVC

Create a View

Create And Consume A User Control In MVC

Please make sure that you have selected a partial view

Create And Consume A User Control In MVC

Add the User Control to your View

[html]
@Html.Partial("ADODMGrid")
@* Here ADODMGrid is our user control name. No need to give its extension (ascx)*@
[/html]

So here we are add our new web user control to our view.

Add tagPrefix to your Web.Config

Last but the least, you need to add tagPrefix to your web.config file as follows.

[html]
<controls>
<add tagPrefix="cc1" namespace="OLAPControls" assembly="CellSetGrid2, Culture=neutral, PublicKeyToken=null" />
</controls>
[/html]

You need to add teh above code under system.web –> Pages

Now if your your view, you can see your control there 🙂

Conclusion

That is all. I hope you liked this article. Please share me your feedback.

Kindest Regards
Sibeesh Venu

Leave a Reply

Your email address will not be published. Required fields are marked *

Serverless 360