0
У меня есть форма, я пытаюсь получить, чтобы закрыть, когда пользователь нажимает кнопку отправки, но она просто остается говорит «отправка»форма не закрывается, когда я нажимаю отправить
Вот вся форма
<div class="pos-bottom">
<a class="modalbox" href="#inline"><img src="images/quote.gif" class="imgquote" width="297" height="72" border="0px" />
</a>
<br />
<div id="inline" style="display: none">
<h2>Request a Quote</h2>
<form id="contact" name="contact" action="#" method="post" style="width:600px">
<br />
<table width="50%">
<tr>
<td width="30%">*Your Name:</td>
<td width="20%"> </td>
<td width="50%">
<input type="text" id="Form_Name" name="Form_Name" />
</td>
</tr>
<tr>
<td width="30%">Company Name:</td>
<td width="20%"> </td>
<td width="50%">
<input type="text" id="Form_Company" name="Form_Company" />
</td>
</tr>
<tr>
<td>*Your E-Mail:</td>
<td> </td>
<td>
<input type="text" id="Form_Email" name="Form_Email" />
</td>
</tr>
<tr>
<td width="30%">*Phone Number:</td>
<td width="20%"> </td>
<td width="50%">
<input type="text" id="Form_Number" name="Form_Number" />
</td>
</tr>
<tr>
<td width="30%" h>Comments:</td>
<td width="20%"> </td>
<td width="50%">
<textarea id="Form_Comments" name="Form_Comments" cols="25" rows="3"></textarea>
</td>
</tr>
<tr>
<td colspan="3"> </td>
</tr>
<tr>
<td width="100%" align="center" colspan="3">
<button id="send">Request Quote</button>
</td>
</tr>
<tr>
<td colspan="3"> </td>
</tr>
<tr>
<td width="100%">
<b><?php echo $itemname; ?></b>
<br />
<br /> Manufacturer:
<?php echo $manufactuer;?>
<br /> Model:
<?php echo $model;?>
<br /> Category:
<?php echo $category;?>
<br />
</td>
</tr>
</table>
</form>
</div>
<!-- basic fancybox setup -->
<script type="text/javascript">
$(document)
.ready(function() {
$(".modalbox").fancybox();
$("#contact").submit(function() {
return false;
});
$("#send").on("click", function() {
{
// if both validate we attempt to send the e-mail
// first we hide the submit btn so the user doesnt click twice
$("#send").replaceWith("<em>sending...</em>");
$.ajax({
type: "POST",
url: "AJAX_Quote.php",
data: {
name: $("#Form_Name").val(),
email: $("#Form_Email").val(),
eid: $("#Form_ID").val(),
company: $("#Form_Company").val(),
number: $("#Form_Number").val(),
comments: $("#Form_Comments").val()
},
dataType: 'json',
success: function() {
{
$("#contact")
.fadeOut("fast", function() {
$(this).before("<p><strong>Success! Your feedback has been sent, thanks :)</strong></p>");
setTimeout("$.fancybox.close()", 50);
});
}
}
});
}
});
});
</script>
<br />
<br />
</div>
<!--ends pos-bottom-->
Я повсюду посмотрел, и я не могу заставить его работать. Любая помощь будет принята с благодарностью.
***** EDIT ****
Вот новый код, который я добавлять советы зарубок.
<script type="text/javascript">
$(document)
.ready(function() {
$(".modalbox").fancybox();
$("#contact").submit(function() {
return false;
});
$("#send").on("click", function() {
{
// if both validate we attempt to send the e-mail
// first we hide the submit btn so the user doesnt click twice
$("#send").replaceWith("<em>sending...</em>");
$.ajax({
type: "POST",
url: "AJAX_Quote.php",
data: JSON.stringify({name: $("#Form_Name").val(),email: $("#Form_Email").val(),eid: $("#Form_ID").val(),company: $("#Form_Company").val(),number: $("#Form_Number").val(),comments: $("#Form_Comments").val()}),
dataType: 'json',
success: function() {
{
$("#contact")
.fadeOut("fast", function() {
$(this).before("<p><strong>Success! Your feedback has been sent, thanks :)</strong></p>");
setTimeout(function() { $.fancybox.close(); }, 50)
});
}
}
});
}
});
});
</script>
Как насчет некоторых отступов? –
Если вы посмотрели в свою консоль, успешный вызов AJAX? – Stryner
Возможно, не связано с вашей проблемой, но не передавайте строку 'setTimeout'. Передайте ему функцию типа setTimeout (function() {$ .fancybox.close();}, 50) '. – Nick