HTML5 - установите флажок для нескольких обязательных

Question

Я написал здесь немного кода: http://jsfiddle.net/anhtran/kXsj9/8/

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

Спасибо за любую помощь:)

Answer 1

Идеальный ответ - использовать HTML5 и атрибут required как часть элемента select, например:

<form method="post" action="processForm.php">
    <label for="myLanguages">What languages can you program in?</label>
    <br>
    <select id="myLanguages" multiple required>
        <option value="C#">C#
        <option value="Java">Java
        <option value="PHP">PHP
        <option value="Perl">Perl
        <option value="Haskell">Haskell
    </select>
    <br>
    <input type="submit" value="Submit">
</form>

Да, я знаю, что они не являются флажками, но конечная функциональность - это именно то, что вам нужно. К сожалению, ни IE 9, ни Safari 5 в настоящее время не поддерживают атрибут required. Chrome 13 и FF 5, однако, делают. (Проверено на Win 7)

Answer 2

Я думаю, что этот атрибут html5 должен только определять, какие поля являются обязательными. Вы не можете вставить логику, чтобы сказать: «хотя бы один требуется».

Вам нужно будет добавить собственный javascript для того, чтобы это работало (и / или проходило проверку на стороне сервера).

надеюсь, это поможет ...

Answer 3

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

Вы бы избавились от атрибутов required и использовали бы CSS, подобный этому:

input[type=submit] {
    display:none;
}

input[type=checkbox]:checked ~ input[type=submit] {
    display:block;
}

Однако этот конкретный CSS не работает в моей версии Google Chrome. Я задал вопрос об этом здесь . Похоже, что он отлично работает на моем FF 3.6.

Answer 4

Вы не можете сделать это без JavaScript. Что вы можете сделать, это выбрать вариант по умолчанию и установить его как выбранный. Но он не может заверить вас, что флажок установлен при отправке формы.