title: Svelte input bind JSON array
body: <p>I followed <a href="https://svelte.dev/tutorial/group-inputs" rel="nofollow noreferrer">this</a> svelte tutorial and I wonder if I could do this group binding to a JSON array instead of simple array, for example I would like to do a planets selector:</p>
  
  <pre><code>    &lt;script&gt;
          let planets = [{
                  name: 'Jupiter',
                  enable: false
              },
              {
                  name: 'Saturn',
                  enable: false
              },
              {
                  name: 'Uran',
                  enable: false
              },
              {
                  name: 'Neptun',
                  enable: false
              },
              {
                  name: 'Pluto',
                  enable: true
              },
          ];
  
          $: planets, console.log(planets)
      &lt;/script&gt;
  
      {#each planets as planet}
          &lt;label&gt;
              &lt;input type=checkbox bind:group={planets} name={planet.name} value={planet}&gt;
              {planet.name}
          &lt;/label&gt;
      {/each}
  </code></pre>
  
  <p><a href="https://svelte.dev/repl/0e7757e403c8400da7371a157d7a37e2?version=3.20.1" rel="nofollow noreferrer">This</a> is a REPL. I wonder if there is a way how to properly bind JSON array (enable array field with inputs value) in svelte each loop. Now it pops out with each item as you click as you can see in REPL's console.log and I would like just to uncheck it.</p>
  
  <p>With bind:checked property displays proper way </p>
  
  <pre><code>&lt;input type=checkbox bind:checked={planet.enable} value={planet}&gt;
  </code></pre>
  
  <p>But this does not change array.enable value on click. Can I achieve responsibility of planets array here?</p>