敲除单选按钮＆＃34;已检查＆＃34;绑定不适用于jQuery Unobtrusive Validation

Question

我有两个单选按钮组，它们都是通过相同的KnockoutJS连接，并且已经检查过＃34;绑定（如checked: HasPets, checkedValue: true）。第一个显示一个不显眼的验证消息，直到用户选择了答案为止。

问题是，当我检查不的问题上的单选按钮进行不显眼的验证时，field-validation-error不会消失。这是一个例子：

我能做些什么来使这个验证消息消失吗？

此外，这是用于重现问题的代码的最小示例：

@model test_mvc_app.Models.TestModel

@using (Html.BeginForm("Pets", "Home", FormMethod.Post, new { id = "petsForm" }))
{
    @Html.LabelFor(m => m.HasPets)
    <div>
        @Html.RadioButtonFor(m => m.HasPets, true, new { @id = "HasPetsTrue", @data_bind = "checked: HasPets, checkedValue: true" })
        <label for="HasPetsTrue">Yes</label>
        @Html.RadioButtonFor(m => m.HasPets, false, new { @id = "HasPetsFalse", @data_bind = "checked: HasPets, checkedValue: false" })
        <label for="HasPetsFalse">No</label>
    </div>
    @Html.ValidationMessageFor(m => m.HasPets)

    <hr/>

    <label>Just to clarify, you're a pet owner, right?</label>
    <div>
        <input data-bind="checked: HasPets, checkedValue: true" type="radio" value="true" >
        <label>Yes</label>
        <input data-bind="checked: HasPets, checkedValue: false" type="radio" value="false" >
        <label>No</label>
    </div>
}

<script>
    $(document).ready(function () {

        var vm = function () {
            var self = this;
            self.HasPets = ko.observable(null);
        }

        var viewModel = new vm();
        ko.applyBindings(viewModel);

        // This makes the validation message appear by default.
        $("#petsForm").valid();
    });
</script>

编辑：这是呈现的 HTML：

<div>
    <input data-bind="checked: HasPets, checkedValue: true" data-val="true" data-val-required="Please answer this question." id="HasPetsTrue" name="HasPets" type="radio" value="true" aria-required="true" class="input-validation-error" aria-describedby="HasPets-error">
    <label for="HasPetsTrue">Yes</label>
    <input data-bind="checked: HasPets, checkedValue: false" id="HasPetsFalse" name="HasPets" type="radio" value="false" class="input-validation-error">
    <label for="HasPetsFalse">No</label>
</div>

<span class="field-validation-error" data-valmsg-for="HasPets" data-valmsg-replace="true"><span id="HasPets-error" class="">Please answer this question.</span></span>