selecting radio inside button

Question

I want the button to have radios inside and after selecting a given one, radios in the middle would also be marked. (clicking the button selects radios inside)
Code:

                <div class="col-sm-3">
                <button class="btn btn-light" style="width:100%;"><?php echo $tdate; ?></button>

                <?php

                $json = file_get_contents('http://localhost:8000/api/open/freeterms/CXUgBAeYu2d4oRgIAck0Ch61WzBX6C/2020-10-24');
                $obj = json_decode($json);
                $i=0;
                foreach($obj as $o){
                    if($i==0){

                    }else{
                        if($o->type=="free"){
                            echo '<button type="button" class="btn btn-info" style="width:30%; margin-bottom:10px; margin-right:3%;"><input type="radio" name="date" value="'.$tdate.'"/><input type="radio" name="start" value="'.$o->start.'"/><input type="radio" name="end" value="'.$o->end.'"/>'.$o->start.' - '.$o->end.'</input>';
                        }
                    }

                    $i++;
                }
                ?>

            </div>

Answer 1

Accessibility wise, adding interactive elements inside another (in your case: input:radio inside button ) is considered a really bad practice and is generally too difficult to implement correctly. You should find another UI layout that would make this acceptable accessibility wise.