HTML+CSS+JavaScript

написал новую функцию для формы

function updatePageForm() {     var data = $("#listPage form").serialize();         $("#formresults").text(data);     $.post($(this).attr('href'), data, function(page) {         $('#listPage').html(page);         $('input').change(updatePageForm);     });     return false; }

на странице

<div id="listPage"> <form> <input name="title" type="text" maxlength="255"> </form> </div> <div id="formresults"></div>  <script type="text/javascript"> jQuery(document).ready(function() { $('#listPage input').change(updatePageForm);}); </script>

теперь когда вводишь в форму текст, ведённые данные отображаются в блоке <div id="formresults"></div> видно что данные передаются. Но в месте с этим страница автоматически перезагружается, хотя как я понимаю этого не должно происходить, т.к. в коде прописал return false;

Как сделать чтобы страница не перезагружалась полностью после нажатия Enter?

--------

мне нужно связать тот код что привёл выше, с функционалом поиск с формы, аналогично можно увидеть полностью рабочий вариант тут в админ панеле в разделе например - Новости
_monoray.ru/products/51-open-business-card

можно по страницам переходить а также делать поиск например по заголовку.
У меня же на данный момент, работает только постраничник, а нужно добавить ещё поиск по форме. Делать кнопку submit не хотелось, т.к. размещать её некуда, под таблицей размещать будет не правильно. Удобно когда вёл данные и нажал Enter, как в приведенном примере по ссылке.

Кошмар - загрузка данных через форму, по нажатию enter, контекст вопроса вашего, коим вы назвали тему. Задается вопрос, что вам надо, ибо не понять чего вы объясняете, вы продолжаете в том же духе: Сейчас стоит вопрос сделать поиск по форме... Ну так на здоровье, ищите, тем более плагин готовый используете или нет?

Что конкретно вам надо? Если "enter", то форма отправляется по нажатию кнопки enter если в этой форме есть кнопка типа submit или image.

в первом посте я описал то что сейчас работает, тоесть выводятся данные через таблицу <table>, под таблицей имеется пагинатор(постраничник), можно без перезагрузки переходить по страницам, таблица будет обновятся. Также у таблицы для каждой колонки имеется заголовки, по клику можно сортировать, это тоже работает. Тоесть по клику по ссылкам ссылки отрабатывают.

Сейчас стоит вопрос сделать поиск по форме, поля формы располагаются внутри таблицы. Аналогичную таблицу можно посмотреть тут:
http://www.cniska.net/yii-bootstrap/
под заголовком Striped, bordered and condensed

в примере можно ввести слово, и нажать на кнопку клавиатуры Enter, после чего будет обращение к скрипту на сервер. На время обновления, рядом появится иконка загрузки. Но тут простой пример, и данные не возвращаются.

Вроде правильно объяснился:) если не понтятно постараюсь ещё описать какнибудь

Могут конечно, если вы все таки конкретно выразитесь какая проблема вас интересует. В первом посте у вас много рассуждений, но не понятно в чем именно вопрос, и второй пост не известно о чем. Вы о чем спрашиваете - как отловить нажатие клавиши Enter, или вам не понятно по чем "пробегать" вам нужно?

извиняюсь, есть кто сможет помочь с этим вопросом?
нужно чтобы не только реагировал скрипт на ссылки(постраничник и сортировка таблицы) но и на формы что в них напишешь и по нажатию на кнопки Enter(на клавиатуре, без кнопки самбит) отправлять запрос на сервер, аналогично по ссылкам.

Как я понимаю при подаче запроса по нажатию ентер, нужно пробежаться по всем полям формы, и отдать на сервер, скорее всего правельно будет сформировать ввиде URL, название_поля1:значение_поля1&название_поля2:значение_поля2... как то так

имеется рабочий код который выполняет загрузку страницы без обновления страницы, например переход по постраничнику, или стртировка

function updatePage() { $(".lister").fadeTo("slow", 0.80);              //var str = $(".filter-container").serialize();     $.post($(this).attr('href'), {}, function(page) {         $('#listPage').html(page);         $('.pagination a').on("click", updatePage);         $('#listPage #sorter a').on("click", updatePage);     });     return false; }

и на самой странице такой код

<script type="text/javascript"> jQuery(document).ready(function() { $('#sorter a, .pagination a').click(updatePage);}); </script>

<div id="listPage"> тут выводим данные </div>

теперь все ссылки что внутри класса sorter а также pagination, при переходе по ним, страница не будет загружаться полностью.

Всё работает хорошо, но тут понадобилось дополнить формы, <input> и <select>. Есть таблица вывода данных, в первом ряду будут располагаться формы, в которых можно будет вести запрос, нажать клавишу Enter(на клавиатуре), и таблица должна обновиться, также без полной перезагрузки страницы. Что-то подобное можно увидеть движке HostCMS.


Фильтр форм выглядит примерно так

<td><div class="filter-container"><input name="id" type="text"></div></td> <td><div class="filter-container"><input name="title" type="text"></div></td>

тоесть все формы можно найти по классу filter-container.
думал может значения собрать через serialize но тут у меня сложности не знаю как правильно сделать.