Callbacks of $.ajax
does not work in Firefox 4.0.1 and IE9
I am using this function of jQuery to email contact. Following is the code.
The controller is running normally, indicating that the Javascript is running!
Only $.ajax
events apparently are not being called.
Javascript
$(window).ready(function () {
//Send mail
$("div.contato-pedidooracao form").submit(function () {
var dataString = $(this).serialize();
$.ajax({
type: "POST",
url: "Contato/SendMail",
data: dataString,
dataType: "json",
beforeSend: function () { //Dont Work in IE9 and Firefox!!
$(".sending").show();
$(".status").show();
$(".status > span").show();
$(".submit > input").attr('disabled', true);
},
complete: function () { //Dont Work in IE9 and Firefox!!
$(".sending").hide();
$(".message").show();
$(".status > span").hide();
$(".submit > input").removeAttr('disabled');
},
success: function (data) { //Dont Work in IE9 and Firefox!!
$(".message").empty();
$(".message").append("<p>Mensagem enviada com sucesso!</p>");
},
error: function () { //Dont Work in IE9 and Firefox!!
$(".message").empty();
$(".message").append("<p>Ocorreu um erro ao tentar enviar a mensagem.</p>");
}
});
});
});
Controller
[HttpPost]
public JsonResult SendMail(string name, string phone, string cel, string email, string message)
{
using (var mail = new MailMessage())
{
mail.To.Add("--email--");
mail.From = new MailAddress("\"&qu开发者_开发问答ot; + name + "\" <" + email + ">");
mail.Subject = "Pedido de Oração - " + name;
mail.Body = message;
mail.IsBodyHtml = false;
new SmtpClient().Send(mail);
}
return Json(new { Sucess = true, Message = "Email enviado com sucesso!" });
}
HTML
<div class="content contato-pedidooracao">
@using (Html.BeginForm())
{
<p>Conte-nos seu pedido</p>
<div class="inline">
@Html.Label("name", "Nome:")
@Html.TextBox("name", "")
</div>
<div class="inline">
@Html.Label("phone", "Telefone:")
@Html.TextBox("phone", "", new { @class = "phone" })
@Html.TextBox("cel", "", new { @class = "phone" })
</div>
<div class="inline">
@Html.Label("email", "e-mail:")
@Html.TextBox("email", "", new { @class = "email" })
</div>
<div class="inline">
@Html.Label("message", "Mensagem:")
@Html.TextArea("message", "")
</div>
<div class="status">
<span>Enviando mensagem:</span><img class="sending" src="@Href("~/Images/ajax-loader2.gif")" alt="Enviando..." />
<div class="message"></div>
</div>
<div class="submit">
<input type="submit" value="Enviar" title="Enviar" />
</div>
}
</div>
Try adding a preventDefault to your submit function:
$("div.contato-pedidooracao form").submit(function (e) {
e.preventDefault();
//rest of your code
精彩评论