CheckBoxFor & ListBoxFor – Session 32

Checkboxfor & ListBoxFor HTML Helper - Session32

In this session of ASP.NET Core tutorial, we modify the form that we implemented during previous sessions and add two more features to it with CheckBoxFor and ListBoxFor HTML Helper. As their names imply, these two helpers help us to create Check Box and List Box in our Views. Thus, with help of CheckBoxFor, we add this option to the form to make all Text Boxes empty or keep the data after form submission. Also, we enable clients to select more than one Category in the “Create New Cost Record: form with help of ListBoxFor.


First, for adding the above mentioned Check Box, we need to add “MakeFormClear” property with type of Boolean to “CreateCostViewModel” View Model.

Then, we can set default amount for the created property Inside “CostController” Controller and “CreateStronglyTypedView” Action Method.

Finally, we can add the Check Box to “CreateStronglyTypedView” View with help of CheckBoxFor HTML Helper.

Moreover, same as other HTML Helper, we can use Html Attribute for CheckBoxFor.

HttpGet & HttpPost Methods

By default, all the Action Methods embark with HTTPGET method. It means whether we add HttpGet method above our Action Method or leave it without the method, they run with Get method.

But, if we want to run it with Post method, we should add HttpPost method above the respective Action Method.

Generally, in ASP.NET Core (ASP.NET 5.0) MVC application, for the Action Method with Form which should be submitted with post method, we need to create two Action Methods with the exact same name. One of the Action Method should be decorated with or without [HttpGet] and the next one should be decorated with [HttpPost]. In this situation, first time that we call the Action Method, HttpGet Action method is embarked. Then, when we submit the Form, HttpPost Action Method will be executed.

Also, in the Action Method with Post Method, the Form Data is available through Input Parameter of the Action Method that its type can be the same as Model Directive of the Strongly Typed View.


For adding the mentioned List Box, we need to modify “CreateCostViewModel” View Model again and add proper property to store the list of selected categories.

Then, we can add the List Box inside “CreateStronglyTypedView” View with help of ListBoxFor HTML Helper.

As you can see, the List Box is bound to “SelectedCategories” property with lambda expression. Also, List Box same as Drop Down List needs List< SelectListItem> and here we used Model.Categories.

Also, you can check the way that we can use Html Attribute in DropDownList in below piece of code which is related to “CreateStronglyTypedView” View.

If you need more details, watch this session video. Also, for being updated about our coming sessions, follow us on Instagram, Facebook, Telegram or YouTube. Also you can have access to list of all sessions HERE.

You can download this Session Slides form HERE

0.00 avg. rating (0% score) - 0 votes


0 0 votes
Article Rating

Inline Feedbacks
View all comments