Создал блок видимый на всех страницах сайта с простейшей формой с select, кнопкой submit и javascript. При нажатие кнопки submit информация выбранная в select отправляется посредством ajax методом post скрипту form.php. Ответ должен отображаться в
.
код блока:
<script type="text/javascript" src="/misc/jquery.form.js"></script>
<div id="output">AJAX-ответ от сервера заменит этот текст.</div>
<form id="my_form" action="/form.php" method="post">
<select name="Id">
<option selected value="0">1</option>
<option value="25">2</option>
<option value="50">3</option>
<option value="100">4</option>
</select>
<input type="submit" id="submit2" name="submit" value="Выбрать" />
<div id='load'></div>
</form>
<script type="text/javascript">
$(document).ready(function(){
var options = {
target: "#output",
beforeSubmit: showLoad,
success: noshowLoad,
timeout: 3000
};
$('#my_form').submit(function() {
$(this).ajaxSubmit(options);
return false;
});
});
function showLoad(){
document.all.load.innerHTML = " <img src='/misc/load.gif' width=20 height=20 border=0>";
document.all.output.innerHTML = "<img src='/misc/load1.gif' width=43 height=30 border=0>"
}
function noshowLoad(){
document.all.load.innerHTML = "";
}
</script>
Данный код работает без перезагрузки в браузерах Opera, IE, Chrome кроме Firefox. В нем происходит переход на form.php.
Подскажите пожалуйста как подправить javascript код чтобы данные из формы передавались php скрипту и ответ отображался без перезагрузки
Комментарии
о боже =О бегом изучать основы джабаскрипта
А в чем проблема? Можно по подробнее.
если бы вы прошли по ссылке и немного почитали, вы бы узнали о существовании DOM и jQuery. а так же о том, как правильно получать объект по его ID, как изменять его свойства, как пользоваться ajax, что такое ahah и Form API
Спасибо xxandeadxx.
Направил в нужное русло. Я даже не думал что проблема именно там.
Решение:
заменил на