Проверка нескольких радиокнопок - PullRequest
Новая
       1

Проверка нескольких радиокнопок

0 голосов
/ 13 июня 2018

Я создаю веб-форму, содержащую переключатели в виде таблицы, которые могут быть выбраны пользователем.Я сгруппировал строки по идентификатору и хочу, чтобы страница не позволяла пользователям продолжать работу, если у каждой строки нет правильного выбора.У меня возникли проблемы с этим, поскольку посты формы, пока одна группа имеет выбор и не оценивает все группы.Я включил 2 группы для тестирования, но моя веб-форма будет содержать больше.Я очень плохо знаком с C # и JavaScript, но я знаю, что у меня есть проблема, которую используют оба isChecked, но я уверен, что это не единственная проблема.Я использовал это в качестве руководства https://www.codemahal.com/video/radio-buttons-and-form-validation/

Вот мой код 

 <script type="text/javascript">
     function isChecked() {
         var checkedITEx = document.getElementById('IT-Ex').checked;
         var checkedITVG = document.getElementById('IT-VG').checked;
         var checkedITGd = document.getElementById('IT-Gd').checked;
         var checkedITAve = document.getElementById('IT-Ave').checked;
         var checkedITPoor = document.getElementById('IT-Poor').checked;

         if (checkedITEx == false && checkedITVG == false && checkedITGd == false && checkedITAve == false && checkedITPoor == false) {
             alert('You need to select a rating for Independent Thinking');
             return false;
         }
         else {
             return true;
         }
     }
     function isChecked() {
         var checkedResEx = document.getElementById('Res-Ex').checked;
         var checkedResVG = document.getElementById('Res-VG').checked;
         var checkedResGd = document.getElementById('Res-Gd').checked;
         var checkedResAve = document.getElementById('Res-Ave').checked;
         var checkedResPoor = document.getElementById('Res-Poor').checked;

         if (checkedResEx == false && checkedResVG == false && checkedResGd == false && checkedResAve == false && checkedResPoor == false) {
             alert('You need to select a rating for Resiliance');
             return false;
         }
         else {
             return true;
         }
     }
 </script>    
</head>
<body>
    <form id="form1" runat="server" action="Default.aspx" method="get" onsubmit="return isChecked();">
        <table>
            <tr>
            <td class="auto-style1"></td>
            <td class="auto-style2">Excellent</td>
            <td class="auto-style2">Very Good</td>
            <td class="auto-style2">Good</td>
            <td class="auto-style2">Average</td>
            <td class="auto-style2">Poor</td>
            </tr>
            <tr>
            <td class="auto-style1">Independent Thinking</td>
            <td class="auto-style2"><input type="radio" name="IndThink" value ="Independent Thinking - Excellent" id="IT-Ex"/></td>
            <td class="auto-style2"><input type="radio" name="IndThink" value ="Independent Thinking - Very Good" id="IT-VG"/></td>
            <td class="auto-style2"><input type="radio" name="IndThink" value ="Independent Thinking - Good" id="IT-Gd"/></td>
            <td class="auto-style2"><input type="radio" name="IndThink" value ="Independent Thinking - Average" id="IT-Ave"/></td>
            <td class="auto-style2"><input type="radio" name="IndThink" value ="Independent Thinking - Poor" id="IT-Poor"/></td>
            </tr>
            <tr>
            <td class="auto-style1">Resiliance</td>
            <td class="auto-style2"><input type="radio" name="Res" value ="Resiliance - Excellent" id="Res-Ex"/></td>
            <td class="auto-style2"><input type="radio" name="Res" value ="Resiliance - Very Good" id="Res-VG"/></td>
            <td class="auto-style2"><input type="radio" name="Res" value ="Resiliance - Good" id="Res-Gd"/></td>
            <td class="auto-style2"><input type="radio" name="Res" value ="Resiliance - Average" id="Res-Ave"/></td>
            <td class="auto-style2"><input type="radio" name="Res" value ="Resiliance - Poor" id="Res-Poor"/></td>
            </tr>
        </table>  
        <input type="submit" value="Submit"/>
    </form>
</body>
</html>

Ответы [ 2 ]

0 голосов
/ 14 июня 2018

Мне удалось заставить это сотрудничать.Вот код, с которым я в конце концов пошел: 

<script type="text/javascript">
 function isChecked() 
{
     var checkedITEx = document.getElementById('IT-Ex').checked;
     var checkedITVG = document.getElementById('IT-VG').checked;
     var checkedITGd = document.getElementById('IT-Gd').checked;
     var checkedITAve = document.getElementById('IT-Ave').checked;
     var checkedITPoor = document.getElementById('IT-Poor').checked;

     if (checkedITEx == false && checkedITVG == false && checkedITGd == false && checkedITAve == false && checkedITPoor == false)
    {
        alert('You need to select a rating for Independent Thinking');
         return false;
     }
     else 
    {
                var checkedResEx = document.getElementById('Res-Ex').checked;
                var checkedResVG = document.getElementById('Res-VG').checked;
                var checkedResGd = document.getElementById('Res-Gd').checked;
                var checkedResAve = document.getElementById('Res-Ave').checked;
                var checkedResPoor = document.getElementById('Res-Poor').checked;

                if (checkedResEx == false && checkedResVG == false && checkedResGd == false && checkedResAve == false && checkedResPoor == false) 
                {
                                     alert('You need to select a rating for Resiliance');
                                     return false;
                }
                else 
                {
                                     return true;

                }
     }
 }

0 голосов
/ 13 июня 2018 
function isOneChecked() {
     var checkedResEx = document.getElementById('Res-Ex').checked;
     var checkedResVG = document.getElementById('Res-VG').checked;
     var checkedResGd = document.getElementById('Res-Gd').checked;
     var checkedResAve = document.getElementById('Res-Ave').checked;
     var checkedResPoor = document.getElementById('Res-Poor').checked;

     return (checkedResEx || checkedResVG || checkedResGd || checkedResAve || checkedResPoor);
 }

Возвращается значение true, если хотя бы один из флажков установлен.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...