jquery - 选中复选框时如何使错误消息消失

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();
});