botón de enviar con XVal MVC desactivar
https://stackoverflow.com/questions/1381900
-
21-09-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianPregunta
Tengo una aplicación MVC usando XVal. Estoy tratando de engancharse a la validación de jQuery para mostrar un gráfico "carga" una vez que el formulario es válido. Parece que no puedo encontrar una manera de mostrar sólo el qraphic cuando jQuery ha validado el formulario.
Sin embargo, también se desactiva el botón cuando se hace clic en el botón y no se valida parar al usuario de volver a enviar el formulario de uno de los errores del lado del cliente se corrigen.
¿Alguien tiene alguna experiencia haciendo esto.
Gracias
R
Aquí está toda la fuente de la página
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>
</title><link href="../Content/wri_mainstyles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/Scripts/jquery-1.3.js"></script>
<script type="text/javascript" src="/Scripts/jquery.validate.js"></script>
<script type="text/javascript" src="/Scripts/xVal.jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// ---- notification pane
$("#notify-container").fadeOut(4000);
// ---- tab bar related code
var sel;
$("#nav a").mouseover(function() {
if ($(this).data("clicked")) { return; }
$(this).children("img").each(function() {
this.src = $(this).attr("src").replace(/_off\.gif$/ig, "_on.gif");
});
}).mouseout(function() {
if ($(this).data("clicked")) { return; }
$(this).children("img").each(function() {
this.src = $(this).attr("src").replace(/_on\.gif$/ig, "_off.gif");
});
//handle clicks
}).click(function() {
if (sel != null) {
$("#nav").find("img").each(function() {
this.src = this.src.replace(/_clk\.gif$/i, "_off.gif");
});
}
$(this).children("img").each(function() {
this.src = $(this).attr("src").replace(/_on.gif$/ig, "_clk.gif");
})
sel = this;
});
//panel pop up code
//hide panel on load.
$("#top-panel").hide();
//toggle when clicked.
$("#sub-panel").click(function() {
$("#top-panel").slideToggle();
var el = $("#shText");
var state = $("#shText").html();
state = (state == 'Close Panel' ? '<span id="shText">Open Panel</span>' : '<span id="shText">Close Panel</span>');
el.replaceWith(state);
});
});
</script>
<script type="text/javascript" language="javascript">
$(function() { // make this code initialize when DOM loads
$('#frmXL').submit(function() {
$('input[type="submit"]', this).replaceWith('<span id="loading"></span>'); //
});
});
</script>
</head>
<body>
<div class="wrapper">
<div id="nav">
<div id="logo"><img src="../../Content/Images/inbox_wrilogo.gif" width="143" height="28" alt="logo" border="0" /></div>
<div id="tab1"><a href="/Support"><img alt="Support" border="0" height="22" name="support" src="/Content/Images/nav_support_off.gif" width="75"></img></a></div>
<div id="tab2"><a href="/Account"><img alt="Account" border="0" height="22" name="account" src="/Content/Images/nav_acct_off.gif" width="75"></img></a></div>
<div id="tab3"><a href="/"><img alt="Inbox" border="0" height="22" name="inbox" src="/Content/Images/nav_inbox_off.gif" width="75"></img></a></div>
</div>
<form action="/Security/Login?ReturnUrl=%2f" id="frmXL" method="post">
<div id="loginwrapper">
<div id="logincontainer">
<div id="logincontrol">
<p>
<label for="username" accesskey="u">Email Address</label>
<input class="frmInput" id="EmailAddress" name="EmailAddress" type="text" value="" />
</p>
<p>
<label for="password" accesskey="p">Password</label>
<input class="frmInput" id="Password" name="Password" type="password" />
</p>
<label for="RememberMe">Remember Me</label>
<div id="rememberwrapper">
<span class="rememberme"><input id="RememberMe" name="RememberMe" type="checkbox" value="true" /><input name="RememberMe" type="hidden" value="false" /></span>
</div>
<p>
<input class="frmbtnsubmit" type="submit" value="Login" />
</p>
</div>
<span class="homelink">
<a class="hmlink" href="/Security?Length=4">Back to Homepage</a>
</span>
</div>
</div>
</form><input name="__RequestVerificationToken" type="hidden" value="DolZ3JoPXziTgPTvWZLqxl/2z16aolj3gjZzHeB2cbs0a+6O17w9bWm3K9XOS/GX" />
<script type="text/javascript">xVal.AttachValidator(null, {"Fields":[{"FieldName":"EmailAddress","FieldRules":[{"RuleName":"RegEx","RuleParameters":{"Pattern":"^(?:[a-zA-Z0-9_\u0027^&/+-])+(?:\\.(?:[a-zA-Z0-9_\u0027^&/+-])+)*@(?:(?:\\[?(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))\\.){3}(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\]?)|(?:[a-zA-Z0-9-]+\\.)+(?:[a-zA-Z]){2,}\\.?)$"},"Message":"Email address is invalid."},{"RuleName":"Required","RuleParameters":{},"Message":"This is a required field."},{"RuleName":"RegEx","RuleParameters":{"Pattern":"^(?:[a-zA-Z0-9_\u0027^&/+-])+(?:\\.(?:[a-zA-Z0-9_\u0027^&/+-])+)*@(?:(?:\\[?(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))\\.){3}(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\]?)|(?:[a-zA-Z0-9-]+\\.)+(?:[a-zA-Z]){2,}\\.?)$"},"Message":"Email address is invalid."},{"RuleName":"Required","RuleParameters":{},"Message":"This is a required field."}]},{"FieldName":"Password","FieldRules":[{"RuleName":"Required","RuleParameters":{},"Message":"This is a required field."},{"RuleName":"Required","RuleParameters":{},"Message":"This is a required field."}]}]})</script>
</div>
<!-- RDD: Do not remove this div. This help keep the footer at the bottom of the page -->
<div class="push"></div>
<!-- end -->
<div id="top-panel">
<span id="appversion" class="footertext">Inbox Swf Version: 0.0.0.1<br />Web Application Version: 0.0.75.12305</span>
</div>
<div id="#footercontent">
<div class="footer">
<div id="footertext">© Copyright 2009 All Rights Reserved</div>
<div id="sub-panel"><a title="View support panel" href="#" id="toggle"><span id="shText">Open Panel</span></a></div>
</div>
</div>
</body>
</html>
Solución
De todos modos, creo que sin preventDefault () presentar su seguramente va a ser despedido.
$(function() { // make this code initialize when DOM loads
$('#frmXL').submit(function(e) {
e.preventDefault();
$('input[type="submit"]', this).replaceWith('<span id="loading"></span>'); //
});
});
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
