bigskysoftware / htmx

</> htmx - high power tools for HTML
https://htmx.org
Other
38.19k stars 1.3k forks source link

Returning value of radio buttons #1152

Closed SimonShapiro closed 1 year ago

SimonShapiro commented 1 year ago

I am using htmx and want my code to be able to retrieve the value of a set item in a radio group. Here is the htmx that I am trying to use:

<div id="js-scale">
            <div>
                <input type=radio name="Js" id="JsStrong"></input>
                <label for="JsStrong">Agree</label>
            </div>
            <div>
                <input type=radio name="Js" id="JsNeutral"></input>
                <label for="JsNetutral">Neutral</label>    
            </div>
            <div>
                <input type=radio name="Js" id="JsPos"></input>
                <label for="JsPos">Disagree</label>    
            </div>
        <div id="control-block">
            <button hx-post={{'/session/'+session+'/tweet/'+tweet+'/Skip'}} hx-trigger="click" hx-swap="innerHTML" hx-target="#session" type="button">Skip</button>
            <button hx-post={{'/session/'+session+'/tweet/'+tweet+'/js_submit'}} hx-trigger="click" hx-swap="innerHTML" hx-target="#session" type="button" hx-include="[name='Js']">Submit</button>
        </div>
</div>

When I press submit, and in the python use requests.get_data(), it returns Js=on, irrespective of which radio button has been selected. If I make the id the same as name then it works like a checkbox, returningthe correct values... But, it is not then a radio group and you can select more than one.

What could be going on here?

David-Guillot commented 1 year ago

Hi @SimonShapiro ,

Have you tried setting value attributes of your inputs? https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio

SimonShapiro commented 1 year ago

That sorted it out. Thanks so much :-)