A validação não intrusiva do jQuery ignora a classe "cancelar" no botão de envio se usada no formulário Ajax
Estou tentando implementar a validação opcional do lado do cliente usando
ASP.NET MVC 4,validação discreta de jQuery,ajax discretoIsso funciona bemAs seguintes imagens mostram o que quero dizer com validação opcional do lado do cliente: Espera-se que o único campo do meu formulário contenha e-mail, portanto, há um validador de e-mail anexado a ele.
Agora clicamos em salvar. Porque o nosso texto"name @ doamin" não é um email válido, o resumo de validação é exibido. Juntamente com o resumo de validação, estamos mostrando"Salve assim mesmo" botão.
Este segundo botão é um botão de envio normal apenas tendoclass="cancel"
. Isso instruijQuery.validate.js
script para pular a validação ao enviar usando este botão.
Aqui está o trecho de código da visualização:
@using (Html.BeginForm())
{
<div>
<input data-val="true" data-val-email="Uups!" name="emailfield" />
<span class="field-validation-valid" data-valmsg-for="emailfield" data-valmsg-replace="false">*</span>
</div>
<input type="submit" value="Save" />
@Html.ValidationSummary(false, "Still errors:")
<div class="validation-summary-valid" data-valmsg-summary="true">
<input type="submit" value="Save anyway" class="cancel" />
</div>
}
Tudo isso funciona bem.
O problemaO segundo botão de envio -"Salve assim mesmo" pára de funcionar como esperado se eu mudar para o formulário Ajax. Apenas se comporta como o normal e evita enviar até que a validação seja bem-sucedida.
Aqui está o trecho de código da visualização "ajaxified":
@using (Ajax.BeginForm("Edit", new { id = "0" },
new AjaxOptions
{
HttpMethod = "POST",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "ajaxSection",
}))
{
<div>
<input data-val="true" data-val-email="Uups!" name="emailfield" />
<span class="field-validation-valid" data-valmsg-for="emailfield" data-valmsg-replace="false">*</span>
</div>
<input type="submit" value="Save" />
@Html.ValidationSummary(false, "Still errors:")
<div class="validation-summary-valid" data-valmsg-summary="true">
<input type="submit" value="Save anyway" class="cancel" name="saveAnyway" />
</div>
}
Eu depureijQuery.validation.js
para descobrir qual é a diferença, mas falhou.
Qualquer idéia para consertar ou solucionar o problema e permitir que o formulário do ajax se comporte como esperado seja bem-vinda.
Termo aditivoTer umvalidação do lado do cliente é uma necessidade absoluta. A validação do lado do servidor não é uma opção. Além do tráfego mais alto (este exemplo é uma simplificação - o formulário real contém muito mais campos) e latência, há uma coisa que a validação do lado do servidor não faria: validadores do lado do cliente destacam campos errados no foco perdido. Isso significa que você tem um feedback assim que você vai para o próximo campo.