Radio Button Losing Value when loses focus

Hi

I have a Form which has two radio groups, if I select the option in the first radio group, then click on the second radio group, the first group loses focus.
image

image

Here is the code

<div class="form-group mb-3" id="input1_group" is="dmx-radio-group" dmx-bind:value="varRadio.value">

                         <legend class="col-sm-2 col-form-label">Select Recipients</legend>

                                <div class="form-check">

                                    <input class="form-check-input position-static" type="radio" value="1" id="input1_1" name="input1">

                                    <label class="form-check-label" for="input2_1">All</label>

                                </div>

                                <div class="form-check">

                                    <input class="form-check-input" type="radio" value="2" id="input1_2" name="input1">

                                    <label class="form-check-label" for="input2_2">Specific</label>

                                </div>

                                <div class="form-check">

                                    <input class="form-check-input" type="radio" value="3" id="input1_3" name="input1">

                                    <label class="form-check-label" for="input1_3">Custom</label>

                                </div>

                            </div>

                        </div>

                        <div class="col">

                            <div class="form-group mb-3" id="input2_group" is="dmx-radio-group">

                                <legend class="col-sm-2 col-form-label"></legend>

                                <div class="form-check">

                                    <input class="form-check-input" type="radio" value="1" id="input2_1" name="input1">

                                    <label class="form-check-label" for="input2_1">Selected</label>

                                </div>

                                <div class="form-check">

                                    <input class="form-check-input" type="radio" value="2" id="input2_2" name="input1">

                                    <label class="form-check-label" for="input2_2">Waiting List</label>

                                </div>

                            </div>

What am I doing wrong?

All your radio inputs have the same name: input1, so they are “one group” and that’s why the selected option can be only one.

Of course thay are, Doh!! :woozy_face:

Thanks Teodor