Display Custom Errors in Html.ValidationMessageFor via jQuery
<p>My ASP.NET MVC 5 application's razor view uses two checkboxes:</p>

<pre><code>&lt;div class="form-group"&gt;
            @Html.LabelFor(model =&gt; model.BoolField1, htmlAttributes: new { @class = "control-label col-md-2" })
            &lt;div class="col-md-10"&gt;
                &lt;div class="checkbox"&gt;
                    @Html.EditorFor(model =&gt; model.BoolField1, new { htmlAttributes = new { @class = "form-control", @id = "bool1" } })
                    @Html.ValidationMessageFor(model =&gt; model.BoolField1, "", new { @class = "text-danger" })
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;

        &lt;div class="form-group"&gt;
            @Html.LabelFor(model =&gt; model.BoolField2, htmlAttributes: new { @class = "control-label col-md-2" })
            &lt;div class="col-md-10"&gt;
                &lt;div class="checkbox"&gt;
                    @Html.EditorFor(model =&gt; model.BoolField2, new { htmlAttributes = new { @class = "form-control", @id = "bool2" } })
                    @Html.ValidationMessageFor(model =&gt; model.BoolField2, "", new { @class = "text-danger" })
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
</code></pre>

<p>I'm trying implement the rule that BoolField2 cannot be true unless BoolField1 is also true. My jquery code:</p>

<pre><code>function applyRule() {
        var bool1Status = document.getElementById('bool1').checked;
        var bool2Status = document.getElementById('bool2').checked;

        if (bool2Status == true &amp;&amp; bool1Status == false) {
        // This is the sole error.
        // Generate a suitable error message and display (how?)

        }
    }
</code></pre>

<p>The custom error generated at this code must be displayed into Html.ValidationMessageFor. How can I achieve this?</p>