Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Проверка на заполненость формы (не такая как все), нужно аля required в xhtml2 
:(
    Опции темы
vintyara
Дата 11.7.2007, 15:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 491
Регистрация: 24.3.2005
Где: Ode$$a

Репутация: нет
Всего: 2



Итак - на форуме множестов вопросов и ответов на них - как сделать проверку заполнености формы. В случае ошибки во всех вариантах используются попап мессаги  - мол вы не ввели емаил, давайти вводите, и будет вам счастье. Мне же такой вариант не нравится. Старо и некрасиво smile 

Затея следующая. Например имеем такой хтмл код -

Код

<form action="" method="post">

<style>
    td.red {
        background-color: red;
    }
</style>

...
    <table>
    
        <tr>
            <td class="red">Name : </td>
            <td><input type="text" /></td>
        </tr>
        
        <tr>
            <td>Фомилийа :</td>
            <td><input type="text" /></td>
        </tr>
    
    </table>
    <input type="submit" />
...


В первой строке в первой колонке видим класс red. Так вот - хотелось бы как-то задавать поля, которые пользователь должен обязательно заполнить (так как будут ещё не обязательное поля для заполнения) и, чтобы после давления юзером сабмита, при проверке и
при обнаружении незаполненого поля (если оно обязательное к заполнению) к нашему td добавлялся этот самый class="red".
Т.е. чтобы юзер визуально увидел красные поля и понял что те инпуты нада заполнить.

Подскажите как сие реализовать. Можно с примерчиками (ибо ЖС только учу).
PM MAIL ICQ   Вверх
Sultanische
Дата 11.7.2007, 16:15 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 25
Регистрация: 8.5.2007

Репутация: 1
Всего: 1



посмотри код до РНРинвизибл боард кажеться там при регистрации такое зделано сразу )))
и не только в РНРинфизбоарде такое.. уже кажеться на многих сайтах сразу и пароль проверяют и тд )

я не шарю ЖС тоже токо начал) но поищи там где говорил)
PM MAIL   Вверх
vintyara
Дата 11.7.2007, 16:20 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 491
Регистрация: 24.3.2005
Где: Ode$$a

Репутация: нет
Всего: 2



Sultanische, гм.. в чёт ты прав. посмотрю.


Цитата(Sultanische @  11.7.2007,  16:15 Найти цитируемый пост)
уже кажеться на многих сайтах сразу и пароль проверяют и тд )


это AJAX  smile это нас тут ниитирисует smile
PM MAIL ICQ   Вверх
Sultanische
Дата 11.7.2007, 16:35 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 25
Регистрация: 8.5.2007

Репутация: 1
Всего: 1



не я не за аджакс))) я о проверках на защищоснность пароля )))) кажеться такое используеться на яндекс паспорте
PM MAIL   Вверх
smartov
Дата 11.7.2007, 18:38 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


свой собственный
****


Профиль
Группа: Экс. модератор
Сообщений: 4225
Регистрация: 2.2.2006
Где: NJ

Репутация: 7
Всего: 259



vintyara, 

В данном случае автора должны интересовать два вопроса
1) Где писать условие валидности поля - это самый главный вопрос. Каким образом определять что валидно для данного input: только цифры, буквы латиныци, e-mail.... Придумай куда впихивать эту информацию и останутся сущие мелочи

2) Связка инпута и определенного td. То есть должен присутствовать какой-то параметр, по которому яваскрипт при проверке мог точно узнать какой именно td подсвечивать красным.

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

Придумать как это делать и есть самое сложное, и если бы было придумано - то тебе уже дали бы ссылку на готовое решение. 
Но вся тяжесть вопроса состоит в том, что решений как это делать было уже сотни, а в итоге использовать их было не очень-то удобно.
PM MAIL   Вверх
check
Дата 11.7.2007, 20:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 610
Регистрация: 3.4.2006

Репутация: нет
Всего: 23



Что-то в таком духе
Код

<style>
    td.red {
        background-color: red;
    }
</style>
<script>
function validateForm() { 
   form = document.forms[0]; 
   if (form.fname.value.length == 0) {
     document.getElementById('name').className = 'red';
     return false;
   }
   else return true;
}
</script>
<form onSubmit='return validateForm()' action="" method="post">
    <table>
    
        <tr>
            <td id="name">Name : </td>
            <td><input name="fname" type="text" /></td>
        </tr>
        
        <tr>
            <td id="fam">Фомилийа :</td>
            <td><input name="lname" type="text" /></td>
        </tr>
    
    </table>
    <input type="submit" />
</form>


Добавлено через 1 минуту и 17 секунд
Это я проверил поле для ввода имени на пустоту. 
PM MAIL   Вверх
smartov
Дата 12.7.2007, 09:10 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


свой собственный
****


Профиль
Группа: Экс. модератор
Сообщений: 4225
Регистрация: 2.2.2006
Где: NJ

Репутация: 7
Всего: 259



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


p.s. кроме того вот это неверно
Код

if (form.fname.value.length == 0) { 

а я введу в поле три пробела,.
PM MAIL   Вверх
check
Дата 12.7.2007, 10:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 610
Регистрация: 3.4.2006

Репутация: нет
Всего: 23



Цитата(smartov @  12.7.2007,  09:10 Найти цитируемый пост)
а я введу в поле три пробела

Согласен, значит пишем функцию trim(), либо выбираем из уже существующих реализаций.
Например так
Код

if ('undefined' == typeof String.prototype.trim) {
  String.prototype.trim = function() {
    return this.replace(/^\s+/, '').replace(/\s+$/, '');
  }
}

function validateForm() { 
   form = document.forms[0]; 
   if (form.fname.value.trim().length == 0) {
     document.getElementById('name').className = 'red';
     return false;
   }
   else return true;
}

Кстати, очень странно что в JS нет стандартного метода trim...



Цитата(smartov @  12.7.2007,  09:10 Найти цитируемый пост)
Но видишь ли мы обсуждали возможность сделать это более красиво, чем просто обычная заточь, которую естественно всем ясно как сделать.
Мне показалось, что у автора вопрос собственно в том как добавить класс CSS к элементу.  Но естественно не откажусь посмотреть на более красивые варианты...
PM MAIL   Вверх
SamDark
Дата 12.7.2007, 14:19 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Добрый кот
***


Профиль
Группа: Участник
Сообщений: 1424
Регистрация: 25.7.2006
Где: Voronezh

Репутация: 2
Всего: 38



Можно так разметить:
Код

<input name="user_name" class="validate-required"/>
<input name="user_e-mail" class="validate-required validate-email"/>



--------------------
rmcreative.ru — Это жжж неспроста...
yiiframework.ru — О фреймворке Yii на русском.
reggi — здесь я регистрирую домены
PM MAIL WWW GTalk Jabber MSN   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.0559 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.