# svelte/no-bind-value-on-checkable-inputs
disallow useless
bind:valueon<input type="checkbox">and<input type="radio">
- 💡 Some problems reported by this rule are manually fixable by editor suggestions.
# 📖 Rule Details
This rule reports bind:value on <input type="checkbox"> and <input type="radio"> elements. For most <input> types, bind:value is used to bind the user-editable state. Checkboxes and radios are an exception, as their state is represented by the checked property instead. As a result, using bind:value instead of bind:checked on a checkbox or radio is a common mistake.
<script>
/* eslint svelte/no-bind-value-on-checkable-inputs: "error" */
</script>
<!-- ✓ GOOD -->
<input type="checkbox" bind:checked=Parsing error: Unexpected token
https://svelte.dev/e/js_parse_error{...}>
<input type="checkbox" bind:group={...}>
<!-- ✗ BAD -->
<input type="checkbox" bind:value={...}>
<script>
/* eslint svelte/no-bind-value-on-checkable-inputs: "error" */
</script>
<!-- ✓ GOOD -->
<input type="radio" bind:group=Parsing error: Unexpected token
https://svelte.dev/e/js_parse_error{...}>
<!-- ✗ BAD -->
<input type="radio" bind:value={...}>
# 🔧 Options
Nothing.
# 🔇 When Not To Use It
You may need to set the value attribute of an <input type="checkbox"> or <input type="radio"> element dynamically. However, bind:value should never be necessary, because the value does not change through user interaction.
# 📚 Further Reading
- Svelte - Tutorial > Basic Svelte / Bindings / Checkbox inputs
- Svelte - Tutorial > Basic Svelte / Bindings / Group inputs
# 🚀 Version
This rule was introduced in eslint-plugin-svelte v3.21.0