<check-input-group>

The <check-input-group> tag helper is used to create labels and input validation messages for the <check-input> tag helper.

The <check-input-group> tag helper generates error messages if its corresponding model member fails validation.

The <check-input-group> tag helper renders child content as raw HTML, after the generated <label> and before the error output.

Usage notes

Basic usage

To use the <check-input-group> tag helper, all you need to do is add it to the form and supply the asp-for attribute, just like you would with the built-in <input> tag helper. Its children should be <check-input> tag helpers, although you may add other HTML as child content as well.

public class MyModel : PageModel
{
    [BindProperty]
    public List<int> LuckyNumbers { get; set; }
}

@model MyModel

<form>
    <check-input-group asp-for="LuckyNumbers">
        <check-input asp-for="LuckyNumbers" value="3">
            3
        </check-input>
        <check-input asp-for="LuckyNumbers" value="7">
            7
        </check-input>
        <check-input asp-for="LuckyNumbers" value="13">
            13
        </check-input>
    </check-input-group>
</form>

Generated HTML

The HTML generated by the <check-input-group> tag helper looks like this:

<div> <!-- component wrapper -->
    <div> <!-- input block wrapper -->
        <div> <!-- label wrapper, disable in configuration -->
            <label for="LuckyNumbers">
                Lucky numbers
            </label>
        </div>
        <div> <!-- child content wrapper, disable in configuration -->
            <!-- child content -->
        </div>
    </div>

    <ul> <!-- error wrapper, only rendered if errors are present -->
        <li>...</li>
    </ul>
</div>

Notes

The <check-input-group> is meant to be used with model members that can possibly bind to an HTML checkbox. For this reason, it can be used with primitives/strings or lists of primitives/strings.