Некорректно работает ajax

[nina_]

Добрый день

Помогите, пожалуйста, разобраться.
Создаю форму для отправки данных пользователя в бд.

<div id="modal_form">
<span id="modal_close">X</span>
<form action="request_order.php" method="post" id="form_order">
<input class="input" type="text" name="name" id="name" size="30" tabindex="1" placeholder="Ваше имя" required>
<input class="input" type="text" name="surname" id="surname" size="30" tabindex="2" placeholder="Ваша фамилия" required>
<input class="input" type="text" name="phone" id="phone" size="30" tabindex="3" placeholder="Ваш телефон" required>
<input class="input" type="text" name="email" id="email" size="30" tabindex="4" placeholder="Ваш email" required>
<textarea name="add_info" id="add_info" class="textarea" rows="3" cols="40" tabindex="5">дополнительная информация (особый уход, привычки, распорядок и т.д.)</textarea>
<input type="submit" class="submit_find" name="submit" value="Отправить">
</form>
</div>


Хочу отправить ее обработчику используя ajax:

<script type="text/javascript">
$(document).ready(function(){
$("#form_order").submit(function() {
var form_data = $(this).serialize();
$.ajax({
type: "POST",
url: "request_order.php",
data: form_data,
success: function() {
alert("Ваше сообщение отправлено!");
}
});
});
});
</script>


И получаю следующее:
если убрать action="request_order.php" в форме,
то данные в базу не добавляются,
однако сообщение alert выскакивает,

если оставить action="request_order.php" в форме,
то сначала добавляются данные,
затем alert,
а затем перенаправления на "request_order.php".

Вопрос: почему без action="request_order.php" в форме,
данные не вставляются в бд,
но я вижу alert? Как это исправить?
Еще заметила что введенные в форму данные(но не отправленные в бд), отражаются в url(после alert),
почему так? ведь я их передаю методом POST?

[dd_smol]

После отправки данных из скрипта нужно прервать выполнения формы зашитые самим браузером ( вернуть false из обработчика submit например ) а со стороны сервера нужно принять и обработать данные которые вы отправляете с помощи аякса ...

[nina_]

Спасибо, прочла документацию, но видимо не до конца поняла.
Т.е. если я хочу, чтобы после того как нажму на submit отправлялись данные из формы, но при этом отменилось стандартное поведение submit (переход по action),
мне нужно, например, добавить id="submit":

<input id="submit" type="submit" class="submit_find" name="submit" value="Отправить">

и изменить js:

<script type="text/javascript">
$(document).ready(function(){
$("#submit").click(function(e){

var form_data = $("#form_order").serialize();
$.ajax({
type: "POST",
url: "request_order.php",
data: form_data,
success: function() {
alert("Ваше сообщение отправлено!");

}
});
e.preventDefault();
});
});
</script>

Но при этом и передача данных "request_order.php" тоже отменяется.
Что-то видимо делаю не так?

[dd_smol]

Браузер сам умеет отправлять формы на сервер. Вы же делаете сбор данных формы и отправку самостоятельно из скрипта ... а браузер эту отправку дублирует и чтоб он это не делал ему надо об этом сообщить есть несколько вариантов сделать это но самый удобный на мой взгляд будит таким.


jQuery(function ( $ ) {
$('#form_order').submit(function ( e ) {
$.post( this.action, $( this ).serialize(), function ( data ) {
alert("Ваше сообщение отправлено!");
} );


return false; // Отмена вшитых действий браузера.
});
});


не совсем понял об отменился переход ... если нужен то можно назначить его через localhost.href