Снова про формы: значения по умолчанию

[@Terion]

просто и смпатично

[@Stutzer]

Очень хорошо

[@ApocalipssiS]

Очень плохо… садитесь… два…

[@remal]

Для type=«password» еще было бы не плохо тип поля менять.

[@Silenius]

это же отлично! реализуйте! :)

[@Silenius]

Уважаемые минусующие, я имею в виду, что у меня такой задачи не стояло — это достаточно просто реализовать самостоятельно, если есть необходимость

[@tenshi]

хватаем текст мышкой, перетаскиваем в такое поле и получаем фейл

[@WilliamKidd]

Проблема, конечно, несколько надуманная, но не даёт мне покоя очень давно. Кто-нибудь знает решение?

[@tenshi]

ниже в комментах…

[@WilliamKidd]

С лейблами подложенными под инпуты? Это-то понятно, меня интересует, как сделать именно с value.

[@tenshi]

не надо делать с value.

[@WilliamKidd]

Вопрос был не в том, как нужно делать.

[@tenshi]

а в том как вырвать гланды всё же через жопу?

[@WilliamKidd]

В том, как отследить перенос выделенного текста мышкой и отреагировать до его вставки в инпут. А по поводу ваших фантазий обратитесь к доктору.

[@tenshi]

https://developer.mozilla.org/en/dragdrop/drag_and_drop

[@WilliamKidd]

Другое дело!)

[@tenshi]

жду свежие костыли ;-)

[@tenshi]

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

[@j1nn]

валидируйте проверкой не на пустое поле, а на равное значенич по умолчанию

[@tenshi]

и в итоге пользователь не сможет ввести значение равное лэйблу?

[@j1nn]

а зачем пользователю вводить имя «имя» или пароль «пароль»?

[@tenshi]

— ты не получил видео или сообщение?
— сообщение

[@j1nn]

так проверяйте целиком, а не частично.

[@tenshi]

ты о чём?

[@tenshi]

а в поля с паролем браузер не сможет подставить значение так как оно не пусто

[@tenshi]

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

[@qnikst]

формально никто не мешает подставить значения с таймаутом в полсекунды (от загрузки документа). В этом случае браузер может автоматически заполнить поля.
и будет что-то вроде:

$(document).load(function(){setTimeout($(".defValue").filter("[value='']").val($(this).attr("title")),500)});
и <input class="defValue" ... title="my default value" />

код не проверил, т.к. это экспромт и лишь идея, да и наверняка это можно реализовать лучше.

[@tenshi]

автоподстановка в браузере может срабатывать при определённых значениях полей (для каждого логина свой пароль)

[@tenshi]

жду следующий костыль х)

[@utk]

WebKit стандартно поддерживает атрибут «placeholder» в полях input. Оперу — не уверен, но вроде тоже.

В общем, я бы цеплялся на этот атрибут, а не на title + не использовал javascript в тех браузерах, где он не нужен.

Ну и да, все новое — хорошо забытое старое: habrahabr.ru/blogs/jquery/74760/

[@WaZZuP]

мне кажется проще разместить label слоем ниже прозрачного поля ввода и потом просто оперировать его видимостью.
Примерно такая реализация: drupal.ru/node/36081

[@Hungry_Hunter]

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

[@FuN_ViT]

по поводу «хранилища» — что мешает к инпуту добавить атрибут default_value=«бла-бла-бла»?

и значение по умолчанию лучше не заносить в value — ибо при сабмите геморой будет. как тут уже писали — отдельным слоем его выводить. плюс этот слой спозиционировать как-будто это сам инпут

[@radogast]

default_value — невалидный атрибут.

[@ozoned]

Мой вариант: немного модифицированый jquery.placeholder для нормальной работы с :password.
dl.dropbox.com/u/1506064/jquery.placeholder.js.txt

Пример:

<input type='text' name='login' id='login' placeholder='логин' />
<input type='password' name='password' id='password' placeholder='пароль' />

<script type='text/javascript'>
$(function() {
  $('input[placeholder]').placeholder();
});
</script>

[@squint]

Так как обработкой focus-а занимается код который выполнится только после полной загрузки страницы, то если человек «ткнет» в контрол во время загрузки — текст останется там.
Поэтому совсем правильно было бы присваивать value для инпута в том же скрипте, который навешивает обработчиков для событий.

[@Kukunin]

Для Mootools есть OverText

[@bolk]

«Вэб». FFFUUUUUUU-

[@TuTbaker]

Для «хранения» информации можно использовать метод jQuery .data() и привязать к нужному полю необходимую информацию и соответственно выводить в любой момент… Но это всё-таки JS.
Более изящный вариант — наложить поверх инпутов и прочего элемент label с необходимым нам текстом и прикрутить парочку событий для корректной работы(скрывать когда нужно, передавать фокус при клике инпутам...). Данный рецепт есть в книжке Джонаттана Чаффера и Карла Шведберга «Изучаем jQuery 1.3», думаю не стоит изобретать велосипед :)

[@egorinsk]

Уважаемые индусы^W разработчики. При реализации плейсхолдеров надо учитывать следующие аспекты: 1) очистка полей перед сабмитом формы 2) хранить флаг, показывающий, что находится в поле — текст плейсхоледра или введенное пользователем значение, чтобы их различать 3) учитывать возможности автозаполнения форм браузерами.

И да, тянуть 100 Кб jQuery ради такой мелочи как-то неблагодарно.

[@Sho]

Даже если бы нужно было всё сделать в вашем стиле, я бы сделал так:

Не понимаю, зачем усложнять простые вещи, самим создавать проблему, а потом решать её.
Ну, это чисто моё мнение.

[@tenshi]

мне больше интересно почему у этого банального и кривого решения столько плюсов

[@Silenius]

да вы злой просто!

[@tenshi]

нет, это я ещё добрый }:-]

[@Silenius]

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

Такое ощущение, что публика ждет готового комбайна с огромным количеством кода, который выполнит каждую их прихоть. А тут сразу кидаются на то, что юзабилити/дизайн не тот, чего-то не хватает, «а вы не подумали». Ну так вы и думайте, у вас же есть голова! Я не решаю чужих проблем, которые находятся у вас в головах.

Если вы понимаете суть вещей, то пишите по существу. Плюсы ставят люди, которым нравится идея, а не то, что я спас им жизнь. И им необязательно ее использовать.

[@tenshi]

публика ждёт _решения_. решение — это ответы на все встающие в таких ситуациях вопросы. это не обязательно прямо код, но уж точно не замалчивание проблем.

[@Silenius]

Вы мне предлагаете написать дисклеймер с текстом «приведенный пример не решает вопрос сбора данных на серверной стороне»? Я об этом замалчиваю? Нет, это вы просто на этом акцентируете внимание. Это не входит в рамки поднятой темы, точно также, как и вопросы «сложностей». По мере возможности я отвечаю, там где у меня есть экспертиза.

[@tenshi]

я предлагаю тебе отдать эту форму тестировщикам, пофиксить все баги и только потом писать статьи

[@Stalker_RED]

решение — это решение задачи, а не «ответ на все вопросы»
в этом топике автор представил нам свою идею* с примером реализации, а не готовое «сделай мне заебись».

нормальные разработчики могут либо воспринять идею, либо отвергнуть, а «публика» со своими «возникающими вопросами» может выйти на улицу, подышать свежим воздухом,…

извините.

____________________
* — пускай она и боян

[@tenshi]

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

[@Silenius]

Я поздравляю вас, вы не такой как все и знаете больше, чем кто-либо, о всем, что здесь говорится. И я также стараюсь не для вас — не для людей, которые всё знают. Выше вас спрашивали о том, как решить задачу, а вы предложили изменить условия задачи. Вас же не просили менять условия задачи, верно?

Предлагаю закрыть полемику с моей полной капитуляцией. Это бессмысленный диалог. Я не фанатик

[@tenshi]

какой толк новичкам от бестолковых статей?

[@ognevsky]

С месяц назад пытался решить эту проблему, наткнулся на плагин, уже готовый, для jQuery.
Так что если бы вы хотели именно решить проблему, а не тратить время и изобретать велосипеды, вы бы за 2 минуты нашли уже готовое

[@Silenius]

Я решал эту задачу месяца три назад. Вполне возможно, что я плохо искал! С другой стороны, не все следует искать в гугле — разучишься решать задачи самостоятельно. Об этом пост недавно проскакивал.

[@RedHead]

Неужели никто не знает:

  /* fix for safari & chrome */
    $("input[type='text'], textarea").mouseup(function(e){
      e.preventDefault();
    });

    $("input[type='text'], textarea")
    .focus(function(e) {
      if($(this).val() == $(this).attr("defaultValue")) $(this).val('');
    })
    .blur(function(e) {
      if($(this).val() == "") $(this).val($(this).attr("defaultValue"));
    });

[@G_Z]

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

Значения в роли заголовков полей хороши для небольших форм, где они позволяют сэкономить место, не сильно ухудшив юзабилити.
Однако даже на форме, приведённой в пример, такое решение уже не уместно и будет только мешать.
Ещё больше будет мешать всплывающий title.

Подумайте, что будет при отключенном Javascript.
Подумайте, как поведут себя устройства не имеющие over-события в привычном понимании, те же touchscreen-устройства.

> Я показал подход к решению задачи.

Лично я не вижу задачи и её решения.
Вижу попытку усложнения жизни себе и пользователям там, где этого можно не делать.

[@Silenius]

> Лично я не вижу задачи и её решения.

Значит этот пост написан не для вас. Спасибо за комментарий, я приму к сведению.

[@noRerih]

Подсказки — это не значения по умолчанию;)
Например вбил в поиск jQuery hints: remysharp.com/2007/01/25/jquery-tutorial-text-box-hints/

[@ArtyV]

$() — это конструктор, не нужно его запускать по несколько раз на строчку

[@nickon]

Вот ещё одно решение — forum.artof.ru/showthread.php?p=1581

[@Stepler]

согласен!

[@iswitch]

Еще один вариант — www.csskarma.com/lab/plugin_slidinglabels/

[@orloffkirill]

Шедевр!

[@Silenius]

интересный вариант!

[@orloffkirill]

Товарищ Автор!

mucur.name/system/jquery_example/

[@Silenius]

Основополагающая работа, спасибо

[@jazbit]

Решение красивое (хранить значение в title), НО — тултипы это плохо. Потому, что на тачскринах нет тултипов. И реально задалбывает работать на iPad/iPhone/Android-устройствах в приложениях, где много инфы уведено как раз в тултипы.

[@resurection]

Вышеупомянутый jquery.example делает то же самое плюс:

+ добавляет класс example на который можно повесить color: gray; — теким образом, то что по дефолту вписано, будет иметь другой цвет.

+ вытирает из формы свои значения в момент субмита. Иначе Вам в форму обратной связи будет постоянно ссыпаться: «сообщение» от «имя фамилия» ответить на «электронную почту».