CODEWITHSUNDEEP
javascriptdomsvelte-3
Adithya R
Adithya R

Reputation: 35

In Svelte, when using "bind:group" in a radio input , the "checked" property is not getting set

Context: I am new to Svelte and I am using the bind:group to assign true/false to a variable yes, but there is no default selection of any radio button. Using the checked="checked" in the radio input does not seem to work if there is a binding. It works fine when there is no binding.

REPL: https://svelte.dev/repl/28833b3a65d2417ea97c2594a5b3edbb?version=3.31.0 (I have used checked="checked" in the first radio input but it doesnt get checked)

Question: Is there a way to have both binding and the radio input checked by default, that is can there be a default binding and radio input selection?

Upvotes: 3

Views: 5367

Answers (1)

Stephane Vanraes
Stephane Vanraes

Reputation: 16451

Svelte will place in the value of the selected radiobutton in your variable. But you do not have a value defined on your inputs. This value will also be used to compare the currently selected value to the input's value and check/uncheck accordingly

<label>
    <input name="yes" value={true} bind:group={yes} type="radio">
    Yes! Send me regular email spam
</label>
<label>
    <input name="yes" value={false} bind:group={yes} type="radio">
    Yes! Send me regular email spam
</label>

(also don't forget to bind both inputs to the same variable)

Upvotes: 4

Related Questions