html - Using Javascript to check for required but unselected radio options on dynamic forms - unsure why the following doesn't work

Question

My application allows individuals to create custom forms, with a variety of fields. They can also specific if a field is required, and this is checked client-side prior to submission.

The following works well for text fields:

for(var i=0; i < form.elements.length; i++){

   if(form.elements[i].value === '' && form.elements[i].hasAttribute('required') {
       // code to run if not selected...
   }
   ...

Equally, if you can do something like the following for checkboxes:

      if(form.elements[i].type=="checkbox") {

          if(form.elements[i].checked!==true && form.elements[i].hasAttribute('required')) {
          // whatever...
          }
          ....

But when I try and apply a similar logic to radio buttons, it doesn't work:

      if(form.elements[i].type=="radio") {

          if(form.elements[i].checked!==true && form.elements[i].hasAttribute('required')) {
          // whatever...
          }
          ...

I've had a look around and can't understand why the above logic fails?

question from:https://stackoverflow.com/questions/65922074/using-javascript-to-check-for-required-but-unselected-radio-options-on-dynamic-f

Answer 1

Waitting for answers