CODEWITHSUNDEEP
htmldjangoforms
DHRUV KAUSHAL
DHRUV KAUSHAL

Reputation: 127

Unable to select radio choices of form

I have an HTML with 2 forms. I want to be able to select one from the first two and one from the next three radio buttons. How to I achieve this? Given below is the html snippet:

<form method="POST" action="/profiles/adminKaLogin/">
        <div class="custom-control custom-radio custom-control-inline">
            <input type="radio" class="custom-control-input" id="defaultInline1" name="inlineDefaultRadiosExample" value="1">
            <label class="custom-control-label" for="defaultInline1">Vendor 1</label>
        </div>

        <!-- Default inline 2-->
        <div class="custom-control custom-radio custom-control-inline">
            <input type="radio" class="custom-control-input" id="defaultInline2" name="inlineDefaultRadiosExample" value="2">
            <label class="custom-control-label" for="defaultInline2">Vendor 2</label>
        </div>

    <h3> Select time period</h3>

        <div class="custom-control custom-radio custom-control-inline">
            <input type="radio" class="custom-control-input" id="defaultInline1" name="inlineDefaultRadiosExample1" value="1m">
            <label class="custom-control-label" for="defaultInline1">1 Month</label>
        </div>  
        <!-- Default inline 2-->
        <div class="custom-control custom-radio custom-control-inline">
            <input type="radio" class="custom-control-input" id="defaultInline2" name="inlineDefaultRadiosExample1" value="2m">
            <label class="custom-control-label" for="defaultInline2">2 Months</label>
        </div>
        <div class="custom-control custom-radio custom-control-inline">
            <input type="radio" class="custom-control-input" id="defaultInline2" name="inlineDefaultRadiosExample1" value="6m">
            <label class="custom-control-label" for="defaultInline2">6 Months</label>
        </div>
        <button type="submit" class="btn btn-primary" name="form1">Submit</button>
    </form>

Note that these buttons have to be in groups of 2 and 3, because I have different uses for them in the backend. Thanks.

Upvotes: 1

Views: 131

Answers (1)

rmindzstar
rmindzstar

Reputation: 348

it seems you gave the same ids of the 1st and 2nd labels and input to the 3/4 and 5th labels and inputs ids

Try to give unique matching for every "id" and "for"

Hope I could help

With that it's working on my environment with bootstrap.

Upvotes: 1

Related Questions