ASP.NET MVC Hosting Germany – Controlling the Output of Html.EditorFor in ASP.NET MVC

Html.EditorFor helper method is used to bind the data from Model to the View page in respective html form elements. Html.EditorFor helper method is very dynamic in nature and very smart as it changes its output based on what data type is given to it. In this post, we are going to learn how to control the output of Html.EditorFor helper method in ASP.NET MVC.

Sometimes, if we have to create a standard form where we are using Bootstrap or other CSS frameworks to control the look and feel of the form and its elements; we will not be able to do that by just using Html.EditorFor. The reason is that it uses fixed set of css class (like text-box single-line etc.) attribute value and we do not have any other nicer way to override this class attribute values .

hostforlife

In this case, we were trying to use Bootstrap to design a form and its elements so that the texboxes looks nicer however we couldn’t do that as we were not be able to specify bootstrap css class as class attribute to these textboxes in Html.EditorFor method.

Don’t worry, we can solve above issue with Html.EditorFor by specifying different EditorTemplates in ASP.NET MVC. Ideally, different EditorTemplates for different data types of fields.

EditorTemplates can be created under /Shared/EditorTemplates folder and in our case as we want to create standard editor templates for a specific data type, we have to keep their names as the data type name. In our case it is boolean.cshtml and string.cshtml.

EditorTemplates

So right click Shared folder and create a folder called EditorTemplates and add string.cshtml file. Copy-paste below code into this file.

In the above code snippet, we are using Html.TextBoxFor helper method and passing class attribute as Bootstrap’s “form-control”.

After adding this any string type of Model property with EditorFor renders like this.

Notice the class attribute above.

Similarly, add boolean.cshtml into EditorTemplates folder and copy-paste below code into this file.

NOTICE that by default, EditorFor helper method gives a checkbox output to the boolean field. However, in this case we have decided to change its output to radio buttons.

In above code snippet, we are checking if Model property being passed to EditorFor method is not null and then specifying its value to the active variable. The same is being used to set the default selection for the respective Radio button.

Now, when a boolean data type property of the Model is used with Html.EditorFor we get following output.

All this gives below output to the form with bootstrap classes:

BootstrapForm

Similarly, we can create different EditorTemplates for different types of fields and can completely control the output of Html.EditorFor helper method.

Thanks for reading! Hope it will works for you.

HostForLIFE.eu as The best and Recommended ASP.NET MVC Hosting Provider

Get high performance, best uptime and the most reliable for your ASP.NET MVC Hosting from HostForLIFE.eu. HostForLIFE.eu provides a safe, reliable and performance-driven foundation for your website. If you are looking for the right ASP.NET MVC hosting provider, they are the right choice for you. They have proactive monitoring down to seconds with reactive solutions in place to ensure the stability of the services they provide. All hosting servers are monitored 24/7/365. They use enterprise software to monitor their entire network infrastructure. Their best and recommended ASP.NET MVC hosting price starts from Є3.00/month, It includes with Unlimited bandwidth, Unlimited disk space, and complete features. To that end, they have built an industry leading Windows and PHP web hosting platform featuring the best of modern technology and industry practices.

Leave a Reply

Your email address will not be published.