# HTML Helpers

#### 1. Standard HTML Helpers

1. **Html.TextBox** - Renders a text box.

   ```csharp
   @Html.TextBox("name")
   ```
2. **Html.TextBoxFor** - Renders a text box for a model property.

   ```csharp
   @Html.TextBoxFor(model => model.PropertyName)
   ```
3. **Html.Label** - Renders a label.

   ```csharp
   @Html.Label("name", "Label Text")
   ```
4. **Html.LabelFor** - Renders a label for a model property.

   ```csharp
   @Html.LabelFor(model => model.PropertyName)
   ```
5. **Html.DropDownList** - Renders a drop-down list.

   ```csharp
   @Html.DropDownList("name", new SelectList(ViewBag.Options))
   ```
6. **Html.DropDownListFor** - Renders a drop-down list for a model property.

   ```csharp
   @Html.DropDownListFor(model => model.PropertyName, new SelectList(Model.Options))
   ```
7. **Html.CheckBox** - Renders a checkbox.

   ```csharp
   @Html.CheckBox("name")
   ```
8. **Html.CheckBoxFor** - Renders a checkbox for a model property.

   ```csharp
   @Html.CheckBoxFor(model => model.PropertyName)
   ```
9. **Html.RadioButton** - Renders a radio button.

   ```csharp
   @Html.RadioButton("name", "value")
   ```
10. **Html.RadioButtonFor** - Renders a radio button for a model property.

    ```csharp
    @Html.RadioButtonFor(model => model.PropertyName, "value")
    ```
11. **Html.ValidationMessage** - Renders a validation message for a specific input field.

    ```csharp
    @Html.ValidationMessage("name")
    ```
12. **Html.ValidationMessageFor** - Renders a validation message for a model property.

    ```csharp
    @Html.ValidationMessageFor(model => model.PropertyName)
    ```

#### 2. Templated HTML Helpers

ASP.NET MVC also provides templated helpers which use the data annotations on the model to generate the appropriate HTML elements.

1. **Html.EditorFor** - Renders an appropriate HTML element based on the data type of the model property.

   ```csharp
   @Html.EditorFor(model => model.PropertyName)
   ```
2. **Html.DisplayFor** - Renders a read-only display of the model property.

   ```csharp
   @Html.DisplayFor(model => model.PropertyName)
   ```

#### 3. Custom HTML Helpers

You can also create custom HTML helpers by defining extension methods on the `HtmlHelper` class.

For example, to create a custom HTML helper that renders a Bootstrap-styled button:

```csharp
public static class CustomHtmlHelpers
{
    public static IHtmlString BootstrapButton(this HtmlHelper htmlHelper, string text, string type = "primary")
    {
        string buttonHtml = $"<button class='btn btn-{type}'>{text}</button>";
        return new HtmlString(buttonHtml);
    }
}
```

In your view, you would use the custom helper like this:

```csharp
@Html.BootstrapButton("Click Me")
```

#### 4. Using HTML Helpers in Razor Views

In a Razor view (`.cshtml`), you can use these helpers within the `@` syntax to generate the necessary HTML elements based on the properties of your model or view data.

Here is an example of using some of these helpers in a form:

```csharp
@model MyNamespace.MyModel

@using (Html.BeginForm())
{
    <div>
        @Html.LabelFor(m => m.Name)
        @Html.TextBoxFor(m => m.Name)
        @Html.ValidationMessageFor(m => m.Name)
    </div>

    <div>
        @Html.LabelFor(m => m.Email)
        @Html.TextBoxFor(m => m.Email)
        @Html.ValidationMessageFor(m => m.Email)
    </div>

    <div>
        <button type="submit">Submit</button>
    </div>
}
```

In this example, the form is created with fields for `Name` and `Email` properties of the model, and validation messages are displayed if there are any validation errors.

#### Benefits of Using Custom HTML Helpers

1. **Reusability:** Custom helpers allow you to reuse HTML components across multiple views, promoting DRY (Don't Repeat Yourself) principles.
2. **Maintainability:** By encapsulating HTML markup in helper methods, you can easily update the markup in one place rather than searching through multiple views.
3. **Readability:** Helpers can make your Razor views cleaner and more readable by abstracting complex HTML structures into simple method calls.
4. **Separation of Concerns:** Custom helpers help separate the concerns of rendering HTML from the business logic, making your code more modular and easier to manage.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://huy312100.gitbook.io/software-development/.net-technology/.net-mvc/html-helpers.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.