Pull to refresh

Comments 36

Объясните, пожалуйста, что делает первый цикл (который по переменной keyValuePairs). Одного вызова val() не хватает?
Не хватает.
У элементов с множественным выбором опций (чекбоксы, мультиселекты) нужно группировать значения в массив.
Сейчас посмотрите, должно все работать.
Первый же баг — пишу «hello, homm» получаю «hi%2C+homm».
А толку то: hello,+homm
Поправил. Получилось два плагина — один еще на url(en)decode.
Если я правильно понял (заполняя форму Form1 при нажатии Clone, должна заполниться форма Form2) под FireFox 3.5.7, Window7 не работает:-(
Заливал багфикс, могло не работать.
все еще не работает:
Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.1.7) Gecko/20100106 Ubuntu/9.10 (karmic) Firefox/3.5.7
в чекбоксах и мульт селекте неправильно работает когда ДЕселектишь чек бокс или значение из селекта (при условии если лишь одно выделено/отмечено)
Гм, да. Неотмеченные чекбоксы отсутствуют в строке, форму надо чистить перед десериализацией. У себя я использую
jQuery.Form Plugin, метод clearForm(). Но могу подобный дописать сюда. Надо?
По идее удобненько. Обязательно попробую использовать этот подход для повторного заполнения форм при негативном ответе валидатора, хотя с другой стороны пользователей без JS немного жалко… а с третей, лучше уж это все делать Ajax'ом и не перегружать форму.

Может еще какие-то варианты применения предложите?
Пользователям без JS можно, например, заполнять форму на сервере ;-)

А способ применения… ИМХО, самый очевидный (и для чего оно нужно было мне) — для навигации по результатам ajax-поиска:
— форма сериализуется, результат пишется в window.location.hash
— при загрузке страницы данные из location.hash десериализуются, а форма отправляется на сервер.

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

В случае jQuery Form Plugin выглядит примерно так:
<code>
$(document).ready() {
  $("#searchForm")
    .ajaxForm()
    .deserialize(window.location.hash)
    .submit();
}
</code>
Так в том то и фишка вашего deserialize, что это могло бы ускорить разработку, избавив от необходимости заполнять форму на сервере, а вы говорите аполнять форму на сервере :^)
если сайт стоит на аяксе, то смысл предполагать, что у юзера нет js? все в идее верно, противоречий нет :) Отключили — пусть тра**тся с тем что дали, жестоко, но справедливо. Жду, когда появятся топики вида «что если не загрузился css или юзер убил его через грисмонкей» :)
если я предполагаю что у юзера нет js, можно предположить, что я говорю о сайтах, которые не на аяксе :^)
У поисковых роботов нет яваскрипта.

А что касается неоправданного использования JS/AJAX — меня раздражает не столько проблемы с юзерами без яваскрипта, сколько такие вещи:

— Часто не работает история (назад-вперед) на AJAX сайтах (особенно хотелось бы сказать разработчикам всяких плагинов просмотра картинок вроде lightbox и подобных — они идиоты, я уже не раз обламывался, когда жмешь назад, и уходишь из-за этого с сайта)
— Кнопка F5 часто открывает не ту же страницу
— Не работают букмарки
— Сайт грузится медленнее, ест больше ресурсов процессора, может притормаживать. Учитывая, что я открываю по много вкладок в браузере, это важно.
Для лечения описанных болезней давно уже придумали множество способов, один из которых — изменять location.hash и отслеживать его изменение, тогда и история сохраняется, и букмарки работают, и обновление страницы приводит ее к тому же состоянию.
Я только замечу, что все же на среднестатистическом сайте использование AJAX для подгрузки результатов поиска имхо неоправданно (из минусов — все значительно усложняется, теряются юзеры без явакрипта, увеличивается время загрузки, из плюсов — ???).
В чем там усложнение-то? =)

1. Взять работающий поиск
2. выдрать результат выдачи в отдельный серверный скрипт/шаблон
3. взять пример выше, воткнуть в коллбэк $('#results').replaceWith(response)
4. либо в вызове ajaxForm, либо в submit указать url нового скрипта =)
5. ???
6. PROFIT!!!

Такая штука даже снизит нагрузку (как минимум, страница целиком лишний раз не генерится), а делается за 15 минут. Скриптов 10 строк добавилось.
Нет. Мне интуитивно такие вещи не нравятся. Кроме того:

1) скрипты утяжеляют загрузку страницы
2) Загрузка страницы становится дольше — а) загрузка страницы, скриптов б) загрузка результатов поиска. Например, мерзкие объявления в контакте сделаны именно так, это раздражает. Какой смысл грузиться страницу 2 запросами вместо одного?
3) Чтобы AJAX нормально работал, надо много кода — код работы с историей (а тут наш любимый ИЕ подкладывает свинью, как всегда), код обработки скриптов в AJAX-ответе (иначе они не выполнятся), код индикации загрузки страницы и обработки ошибок, обхода аггрессивного браузерного кеширования ответа, и т.д., я сам это делал, и мне кажется глупым писать заново пол-браузера на яваскрипте.
4) «как минимум, страница целиком лишний раз не генерится» — если у вас не унылосайт, с кучей рекламы, и бесполезных инфоблоков в сайдбаре на 3 экрана — ускорения не будет, а по причинам, в п.2 — будет только медленнее. Назгрузка на сервер тоже не снижается, так как поиск все равно производится

Так что ваше «делается за 15 минут» звучит как-то… по-фрилансерски что ли. Они тоже любят накачать всяких Джумл/вордпрессов, бесплатных шаблонов и плагинов, и ставить это за 15 минут, так что на сайт смотреть страшно.
0. Ну, «15 минут» — больше фигурально сказано. Но в любом случае трудозатраты там относительно небольшие.

1. Утяжеление, еще раз, небольшое. Если вообще ajax используется.

2. Что мешает сервером сразу тоже рендерить результат?

3.
а) История в IE — актуально для IE6(7?). В этом случае пишется библиотечка, или берется готовая. Она грузится один раз для всего сайта и оседает в кешах браузера. А восьмой IE даже onhashchange понимает, и для него огород городить не надо.
б) Обработка ошибок — вы ведь их обрабатываете на сервере уже? Еще раз, задача — получить готовый html с результатами, и его воткнуть на место текущих результатов. Или вы в JSON'е данные принимаете, и потом разметку в js генерируете?
в) обработка скриптов — миллион лет назад уже в jQuery все сделано. Не надо про его размер говорить, он наверняка у всех в кешах есть (если с гугла тащить), а если нет — то требуется один раз для всего сайта загрузить.
г) про агрессивное кеширование не совсем понял — уточните, в чем там проблемы (которые есть при использовании AJAX'а, и нет в обычной реализации)?

4. Поскольку разобрались со вторым пунктом, то ускорение таки будет?
Кроме генерации есть еще время запроса/ответа, есть время рендеринга всей страницы (небольшое, но есть), есть время перемотки к результатам поиска. Да и визуально ajax-переход выглядит быстрее.

В общем, вопрос тут, скорее, в правильной реализации. Тогда это будет быстрее. А кода все равно не так уж много (если, конечно, jQuery самому не изобретать).
Во-первых насчет кеширования. В кеше браузера файлы месяцами не лежат, к слову. представьте такой сценарий: я ищу что-то в гугле и открываю по очереди все страицы в поисках нужной. В обычном браузере, с вашим аяксом меня ждет секунды 3-5 ожидания, а то и больше, глядя в белый экран. Я не привык к таким тормозам. В Опере без яваскрипта  — открывается быстрее. Кеш тут не поможет, так как я на ваш мерзкий (не принимайте всерьез :) ), заполеннный аяксом сайт захожу первый, и узнав про аякс, последний раз в жизни.

Кстати, такие ошибки случаются не только у начинающих вебмастеров: не так давно, Хабр адски тормозил — 3 рекламных яваскрипта с pink.habrahabr.ru отдавались с задержкой в 5 секунд на каждый, а пока они не загрузятся, ничего не отображалось. Как вы думаете, довольны ли были пользователи?

> 2. Что мешает сервером сразу тоже рендерить результат?

Может, то, что hash не передается на сервер?:)) Я вам еще раз говорю, я сам всю эту реализацию руками писал, и ничего глупее, чем пытаться дублировать функционал браузера, ради кажущегося ускорения, нет.

Кстати, у ИЕ свои тараканы — переход на несуществующий якорь не пишется в историю, и для Убогого приходится добавлять в страницу дополнительный ифрейм. Зачем мне на сайте ифреймы??

Может для кривых тяжелых, перегруженных рекламой DLE-порталов и есть от этого видимость ускорения, но я, слава богу, таких сайтов никогда не делал.

> б) Обработка ошибок — вы ведь их обрабатываете на сервере уже?

Ошибок AJAX-запроса, например, интернет пропал и ответ от серевера не пришел. Вы же их обрабатываете?

> про агрессивное кеширование не совсем понял — уточните, в чем там проблемы

Некоторые браузеры (ИЕ и Опера) принудительно кешируют AJAX-ответ, несмотря на отсутсвие позволяющих это делать HTTP-заголовков. Приходится добавлять уродливое &rnd=NNNN к запросу.

> общем, вопрос тут, скорее, в правильной реализации. Тогда это будет быстрее.

А еще стоит подумать, так ли нужен АЯКС (мнение туповатого заказчика — не в счет). Пробелы и мусор лучше в HTML коды вырежьте и с джумлы/друпала (к примеру) перейдите на нормальную CMS, вот это будет ускорение :)

Опять же, проблемы индексации поисковиками остаются.

К тому же для меня есть главный аргумент — у меня в Опере для незнакомых сайтов отключен яваскрипт (грузится быстрее, я сейчас временно сижу в браузере с флешем и яваскриптом — торомза аж непривычные).
Всё правильно, пощупайте вот этот проектик tanyao.ru (-:
если по аналогии с php, то функция обратная serialize носит имя un-serialize, вместо de. Но не суть, вы могли по jquery unserialize что-то готовое уже нагуглить, есть примеры, у вас правда пообширнее функционал, супер. Попробуем на досуге.
В принципе вы правы, цитирую:

Основным значением префикса un является не. В некоторых случаях префикс un означает изменение действия глагола на обратное.

Префикс de имеет несколько отрицательных значений, основными из которых являются а) вниз, ниже; б) высвобождение, отключение или отклонение и в) отделение, отдаление.
Гм… Не знаю, как в php, а в дотнете именно Deserialize:

Ха ха. Классно, тоько что сегодня делал подобную задачу и тоже для ajax-навигации! Буквально 4 часа не дошёл до вашей записи, написал вот так:

formSearchReset — это объект с данными для сброса формы. Потому что значения формы сериализуются только те, которые активны (например, снятый checkbox не будет отправлен на сервер) — поэтому в моём решении нужен этот объект со сброшенными значениями для всех элементов формы. Возможно, можно решить проще или как-то по другому.

params = url2urlData(href);

var paramsDefault = $.extend({}, formSearchReset);

$.extend(paramsDefault, params);

$.each(paramsDefault, function(name, value) {
el = form.find('*[name='+name+']');
if (el.attr('type') == 'checkbox') {
if (!value) {
el[0].checked = false;
} else {
el[0].checked = true;
}
} else if (el.attr('type') == 'radio') {
el.attr('checked', false);
el.filter('[value='+value+']')[0].checked = true;
} else {
el.val(value);
}
});

//-------------------------
function url2urlData(url) {
var urlData = {};

var param, i;

var params = url.split('&');
var len = params.length;

if (params && len > 0) {
for (i=0; i < len; i++) {
param = params[i].split('=');
urlData[param[0]] = decodeURIComponent(param[1]);
}
}

return urlData;
}
Sign up to leave a comment.

Articles

Change theme settings