简体   繁体   中英

Selecting multiple radio buttons

Alright i have a for loop in php and it generates a group of radio buttons for a person, each radio button within the group has the same name.

for ($i = 0; $i < $count; $i++) {
            echo '<tr>';
            echo '<td>' . $something[$i] . '</td>';
            echo '<td align="center"><input class="one" type="radio" name="' . $i . '" value="1"/></td>';
            echo '<td align="center"><input class="half" type="radio" name="' . $i . '" value="0.5"/></td>';
            echo '<td align="center"><input class="zero" type="radio" name="' . $i . '" value="0" checked="checked"/></td>';
            echo '<td align="center"><input class="inactive" type="radio" name="' . $i . '" value="null"/></td>';
            echo '</tr>';
        }

I want to be able to select/check all the radio buttons with the same class by clicking a link/button. the variable $count will change every few days, so i wont know the how many different radio groups there will be. I am looking for this hopefully to be in javascript

You can't do this. Radio button groups allow a single selection. You will need checkboxes to accomplish this.

Provided the class names are unique to the radio buttons, you could do this:

var radios = document.getElementsByTagName("INPUT");
for (var index = 0; index < radios.length; index++) {
   if (radios(index).type == "radio" && 
       radios(index).className.indexOf("one") > -1) {
      radios(index).checked = true;
   }
}

All this is probably no better than using getElementsById for each, but probably better than getElementsByClassName, which isn't universally supported, I don't think.

okay i got mine figured out here,

            $(document).ready(function() {

            // select all radio buttons in the "one" column (.one class)
            $('#select_all_one').click(function(){
                $("input[class=one]").each(function(){
                    this.checked = true;
                });
            });

            // select all radio buttons in the "half" column (.half class)
            $('#select_all_half').click(function(){
                $("input[class=half]").each(function(){
                    this.checked = true;
                });
            });

            // select all radio buttons in the "zero" column (.zero class)
            $('#select_all_zero').click(function(){
                $("input[class=zero]").each(function(){
                    this.checked = true;
                });
            });

            // select all radio buttons in the "inactive" column (.inactive class)
            $('#select_all_inactive').click(function(){
                $("input[class=inactive]").each(function(){
                    this.checked = true;
                });
            });


          });

and then to select all the radio i use this link <a id="select_all_one" name="select_all" value="all_one"> and change the name of the id and value to half, zero, and inactive for the respected links, everything works perfect

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM