javascript - ASP.NET MVC5 Validación del lado del cliente


Tengo un campo de cantidad en una vista que es obligatorio si se marca una casilla de verificación.

Una vez que Razor representa la vista con los datos del modelo, y un usuario marca una casilla de verificación sin ingresar una cantidad correspondiente. Aparece el mensaje de Validación. Si anulo la selección de esa casilla, el mensaje de validación no desaparece.

He intentado usar jquery para eliminar todas las reglas generadas, pero si el usuario volviera a marcar la casilla de verificación antes de volver a publicar, esas reglas de validación se habrían eliminado.ed (a menos que los guarde... lo cual se está poniendo muy feo).

¿Existe alguna forma aceptable de volver a validar el lado del cliente con los mismos requisitos en el modelo MVC?

Modelo:

[Display(Name = "Include Amount")]
public bool IncludeAmount { get; set; }
[Display(Name = "Amount")]
[RequiredIf("IncludeAmount", TargetValue = true, ErrorMessage = "Amount is required.")]
[MaxDigits(10, 2)]
[RegularExpression(RegularExpressions.Money, ErrorMessage = ErrorMessages.NumericValueInvalidFormat)]
[GreaterThanZero]
public Nullable<decimal> Amount { get; set; }

Ver:

<td class="dataEntryLabel" colspan="2">
    @Html.LabelFor(model => model.IncludeAmount)
</td>
<td class="dataEntryField" colspan="2">
    @Html.CheckBoxFor(model => model.IncludeAmount, new { id = "IncludeAmount" })
    <span class="dollar-sign">@Html.TextBoxFor(model => model.Amount, "{0:F}", new { id = "Amount", disabled = "disabled" })</span>
    @Html.ValidationMessageFor(model => model.Amount)
</td>

JavaScript (lado del cliente):

function fixUnobtrusiveValidations() {
    var form = getForm();
    (<any>$).validator.unobtrusive.parse(form);
}

function onClickCheckBoxIncludeAmount(){
        fixUnobtrusiveValidations();
}

$('IncludeAmount').click(onClickCheckBoxIncludeAmount);


------------Respuesta------------

Pruebe esto para deshabilitar la validación del lado del cliente en eventos onclick Consulte: https://jqueryvalidation.org/validate/#onclick

$("#myform").validate({
    onclick: false,
});

O

$("#yourChkboxID").validate({
    onclick: false,
});


------------Respuestar------------

Esto funcionó:

if (!($('#IncludeAmount').checked)){
   toggleValidatorVisibility($('#Amount'), false);
}

function toggleValidatorVisibility(element: any, value) {
  var td: any = element.closest('td');
  if (value) {
       td.find('span.field-validation-error').show();
  } else {
       td.find('span.field-validation-error').empty();
  }
}

Etiquetas:

Artículos relacionados:

node.js: forma de facto de agregar subdominios (como jp en jp.sweet-website.org) para nodejs

powershell - Project Centennial: cómo editar el XML generado y llamar a MakeAppx.exe