2012-01-11 2 views
0

Я просто завершаю наши проверки формы, и мы запускаем css на элементах ввода и т. Д., Если они не проверяются.проверка css для выборочных полей

Но не знаете, как бороться с этим для элементов, отличных от ввода.

Например, выбирает и радио и флажки.

Обычно наши JS для этого:

Для поля электронной почты.

if(email == "") $('#email').css({"background":"#efefef","border":"1px solid #F12B63"}); 

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

+0

AFAIK, анкеры и флаги с флагом и рамками. – Johan

+0

yer Я думаю, что для этого нам нужно будет послать сообщение, тем более, что выбирает то, что делает мне голову в – 422

+1

. Вы можете попробовать мой ответ, хотя, я думаю, что его ближайший вы получите до границы непосредственно на флажках/радио – Johan

ответ

1

Try с контуром атрибут вместо: http://jsfiddle.net/Kqcx7/1/

+0

попробовал это, но не работает для нас. Я вроде думаю отключить кнопку отправки, если флажки отмечены галочкой – 422

1

Свойства границы не будет работать для всех элементов формы. Вы должны добавить оболочку span/div вокруг полей выбора. Альтернативный подход заключается в использовании свойства контура.

+0

спасибо, сыграли с этим безрезультатно – 422

1

Вариант 1: Вы можете изменить цвет ярлыка вместо изменения границы ввода.

Вариант 2: Используйте javascript, css и изображения, чтобы изменить внешний вид флажков и переключателей. Есть много учебников.

пусть говорят, что Вы имеете такую ​​форму:

<form method="post" action="/path/to/action" id="exampleForm"> 
    <div id="fullNameBlock"> 
    <label>Full Name:</label><input type="text" value="" name="fullname" > 
    </div> 
    <div id="emailBlock"> 
    <label>Email:</label><input type="text" value="" name="email" > 
    </div> 
    <input type="submit" value="Send" > 
</form> 

и пусть говорят, что вы проверить на представить:

if(!validate()) { 

} 

и ваш адрес электронной почты неправильно. Один из вариантов, чтобы сделать что-то вроде этого:

$("#emailBlock").find("label").css({color: "red"}); 

Также вы можете добавить скрытое сообщение ниже ввода:

<div id="emailBlock"> 
    <label>Email:</label><input type="text" value="" name="email" > <br> 
    <span style="display:none;">Your email is invalid</span> 
</div> 

и показать сообщение, когда возникает ошибка:

$ ("#emailBlock") находит ("промежуток") показывает()..;

Вы можете проверить эти направляющие для пользовательских флажков и переключателей:

http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/ http://www.maratz.com/blog/archives/2006/06/11/fancy-checkboxes-and-radio- кнопки/ http://www.dailycoding.com/Posts/customized_html_controls_creating_custom_checkbox.aspx http://blogs.digitss.com/javascript/jquery-javascript/jquery-fancy-custom-radio-and-checkbox/

+0

спасибо @Taro не уверен, как вызвать метку css change – 422

+0

Я добавил пример и некоторые ссылки, надеюсь, эта помощь –

0

Использование Jquery вы можете просто изменить границы выбора (раскрывающегося списка) ввод.

$('#selectId').parent().css('border-color','red');