Using Html.BeginForm and Semantic UI

Question

When I use Html.BeginForm, the semantic UI will runs off and uses the classic UI.

How do I get this fixed?

@using (Html.BeginForm())
{
<div id="addRestaurant">
    <form class="ui form">
        <div class="required field">
            <label for="resName">Restaurant Name</label>
            <input type="text" name="model.RestaurantName" id="RestaurantName"/>
        </div>
...
</div>
}

Before using Html.BeginForm

After using Html.BeginForm

Answer 1

Apply the class to the mvc form

<div id="addRestaurant">
@using (Html.BeginForm("ActionName","ControllerName", method: FormMethod.Post, htmlAttributes: new { @class="ui form"} )) {

        <div class="required field">
            <label for="resName">Restaurant Name</label>
            <input type="text" name="model.RestaurantName" id="RestaurantName"/>
        </div>
...

}
</div>