Как корректно применить AJAX в данном случае?

Question

[nadom]

Приветствую.

Страница представляет собой несколько блоко высотой в 100%.
На каждом блоке есть форма, подтверждая которую (инпут тип = "сабмит"), отоброжается таблица с результами (php код выполняет SQL-запрос и выводит результат).
Из-за того, что кнопка типа "сабмит" страница перезагружается полностью и нас поднимает в самый верх (т.е. с помозью навигации приходится спускать вниз).

Думаю, можно исправить Аяксом, но не могу придумать как его тут подключить бы...

Comments

[Shaks]

g.zeos.in/?q=form%20ajax

Answer 1

[Александр Мельниченко]

$( "form" ).submit(function( event ) {
event.preventDefault(); //запрет сабмита формы(запрет действия браузера по-умолчанию)
var data = {};
$.post('/your_url', data, function(response){ //получаем контент
$(response).appendTo('<селектор для вставки>'); //вставляет контент в нужно место
},)
});

Answer 2

[twobomb]

Если волнует только то что поднимает на верх, то это можно решить например запомнив прокрутку сверху window.pageYOffset
Можно создать новое окно и передать туда этот параметр, а там написать чтобы он автоматически скролил до того же места, а можно записать в куки и на этой же странице после перезагрузки автоматически проскролить.
Но если не нравиться то, что страница перезагружается то придется использовать AJAX.