如何在选中复选框时使错误信息消失

Question

编辑：

<div class="editor-item">
<label for="Location">Location</label><input class="input-validation-error ui-autocomplete-input" data-jqui-acomp-delay="400" data-jqui-acomp-hiddenvalue="LocationId" data-jqui-acomp-minlength="3" data-jqui-acomp-source="/Loc/Search" data-jqui-type="autocomplete" id="Location" name="Location" type="text" value="123 wrong address" autocomplete="off">
<span role="status" aria-live="polite" class="ui-helper-hidden-accessible"></span><span class="field-validation-error" data-valmsg-for="Location" data-valmsg-replace="true">Location not found</span></div>

当用户提交按钮时，我正在检查位置是否存在，如果不存在，则添加ModelState.AddmodelError

ModelState.AddModelError((LocationViewModel m) => m.Location, "Location not found");

我的问题是:当用户单击复选框Create Location时，如何使错误消失？

 <span id="CreateNLocation"   >
    @Html.LabelFor(model => model.CreateLocation, "Create Location")
    @Html.CheckBoxFor(model => model.CreateLocation)
 </span>

在运行时呈现：

<span id="CreateNLocation" style="">
   <label for="CreateLocation">Create Location</label>
   <input data-val="true" data-val-required="The Create new Location field is required." id="CreateLocation" name="CreateLocation" type="checkbox" value="true">

​

​

Answer 1

根据你对你问题的评论

$('#CreateLocation').change(function(){
  if($(this).prop("checked")) {
    $("span[data-valmsg-for='Location']").hide();
  } else {
    $("span[data-valmsg-for='Location']").show();
  }
});

小提琴

Answer 2

下面是一个JS Fiddle示例，如果您想要根据复选框是否选中了来显示/隐藏它。

$('#CreateLocation').click(function() {
   var $checkbox = $('#CreateLocation');
   var $errMsg   = $(this).parents('#parent-example')
                        .find('.field-validation-error');
   $checkbox.prop('checked') ? $errMsg.hide() : $errMsg.show();
});

http://jsfiddle.net/ga7kpn3r/1/

Answer 3

$('#CreateLocation').click(function() {
    $('.field-validation-error).remove();
});

如果我正确地理解了你的问题，你只想让错误在选中复选框时消失？如果是这样的话，这应该对你有用。

编辑:误解了问题，我需要错误消息的标记(div，span，不管它是什么)。不管元素是什么，用正确的元素替换.remove()选择器。

$('#CreateLocation').click(function() {
    $(this).parent(wrapper).find('.field-validation-error').remove();
});