Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Общие вопросы > Submit в зависимости от состояния RadioButton


Автор: Flynn 14.12.2007, 19:30
В форме есть 2 INPUT type="radio" и при нажатии Submit необходимо сделать так чтобы происходило 1 из 2х действий:
1 - Если ни один radio не выделен то submit формы не выполняется, а пользователю выдается алерт, о том что он не выбрал ни один из параметров.
2 - Если выбран один из radio то у пользователя необходимо спросить подтверждение о том правильноли он выбрал radio и соотвественно если пользователь подтверждает то submit формы выполняется, если не подтверждает то соответвенно не выполняется.

Как это сделать? Я в JS почти ноль, а тут встала необходимость такой вот функции для формы. 

Автор: Aliance 14.12.2007, 19:55
Что было сделано, что не получилось? Если ничего не было сделано, то в раздел работа.

Нужно на onsubmit повесить функцию, проверяющие значения выбранных радио кнопок и все

Автор: Mymik 14.12.2007, 20:16
Aliance, не будь таким строгим smile хотя я тебя целиком и полностью поддерживаю в этом плане, нужно конечно сподвигать форумчан начинать хоть что-нибудь писать. Но у меня сегодня настроение такое... так захотелось такую простенькую работенку сделать smile
Код

<html>
<head>
    <script type="text/javascript">
    function checkAnswer(id)
    {
        /* Получаем контэйнер */
        var answ = document.getElementById(id);
        if(!answ)
        {
            alert("Container Not Exist"); 
            return!1;
        }
        
        /* Получаем ссылки на все input'ы */
        answerCollection = answ.getElementsByTagName("input")
        for(var i = 0; i < answerCollection.length; i++)
            /* Проверяем на выбор элемента */
            if(answerCollection[i].type == "radio" && answerCollection[i].checked)
                return confirm("Are You Sure ???");
                
        /* Не один из элементов не выбран, значит материмся и отменяем сабмит */
        alert("Choose An Answer");
        return!1;
    }
    </script>
</head>
<body>
    <form >
        <div id="answers">
            <input type="radio" name="answer" /> first<br/>
            <input type="radio" name="answer" /> second<br/>
            <input type="radio" name="answer" /> third<br/>
        </div>
    <input type="submit" value="Send Answers" onclick="return checkAnswer('answers')" />
    </form>
</body>
</html>

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)