# How to prefill a radio button / checkbox with object values

**URL:** <https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926>\
**Category:** Help Requests\
**Created:** [September 12, 2019, 1:58pm UTC](https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926 "2019-09-12T13:58:48Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![AxelVerstappen](https://avatars.discourse-cdn.com/v4/letter/a/aca169/32.png) [@AxelVerstappen](https://discourse.aurelia.io/u/AxelVerstappen)\
**Post date:** [September 12, 2019, 1:58pm UTC](https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926/1 "2019-09-12T13:58:48Z")

</div>

Hello, we’ve had an Aurelia project up and running for a while now but some time ago we noticed that some of our radiobuttons and checkboxes weren’t automatically prefilled anymore. We were using following syntax (also partly found in the documentation):  
app.ts

```auto
export class App {
  products: any[] = [
    { id: 0, name: 'Motherboard' },
    { id: 1, name: 'CPU' },
    { id: 2, name: 'Memory' },
  ];

  selectedProduct: any = { id: 1, name: 'CPU' };

  productMatcher(a, b) {
    return a.id === b.id;
  }
}

```

app.html

```auto
<template>
  <div>
    <label repeat.for="product of products">
      <input type="radio" name="group2"
              model.bind="product"
              matcher.bind="productMatcher"
              checked.bind="selectedProduct">
      ${product.name}
    </label>
  </div>
</template>

```

It is a sort of merger between the examples found on [https://aurelia.io/docs/binding/radios#objects](https://aurelia.io/docs/binding/radios#objects) and [https://aurelia.io/docs/binding/radios#objects-with-matcher](https://aurelia.io/docs/binding/radios#objects-with-matcher), with the only difference being that one uses a repeater and the other one doesn’t.  
The problem is that it used to work before and doesn’t anymore now, did something change and if so, can someone help us out here?

---

<div class="post-metadata">

**Author:** ![khuongduybui](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/khuongduybui/32/44_2.png) [@khuongduybui](https://discourse.aurelia.io/u/khuongduybui)\
**Post date:** [September 13, 2019, 12:42am UTC](https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926/2 "2019-09-13T00:42:34Z")

</div>

I don’t know why it doesn’t work within a repeater. I verified the issue with a pristine app created with latest version of `aurelia-cli` using default TS config.

What I would do instead is just use `selectedProduct: any = products[1];` and forget about matchers. Of course if your real-life scenario is much more complicated than the examples and you MUST use matchers, I don’t know what to do.

EDIT: I forked the CodeSandbox example from [https://aurelia.io/docs/binding/radios#objects-with-matcher](https://aurelia.io/docs/binding/radios#objects-with-matcher) and put the `<label>` inside a repeater; it stopped working too.

---

<div class="post-metadata">

**Author:** ![AxelVerstappen](https://avatars.discourse-cdn.com/v4/letter/a/aca169/32.png) [@AxelVerstappen](https://discourse.aurelia.io/u/AxelVerstappen)\
**Post date:** [September 13, 2019, 8:02am UTC](https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926/3 "2019-09-13T08:02:16Z")

</div>

Thank you for the confirmation. While our scenario was a indeed a little bit more complicated, your suggestion did help out for a temporary fix by just overwriting the existing value by the corresponding index in the repeated array so it’s something! 🙂

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [September 13, 2019, 12:50pm UTC](https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926/4 "2019-09-13T12:50:34Z")

</div>

It seems someone also filed a similar issue in `templating-resources` at [https://github.com/aurelia/templating-resources/issues/388](https://github.com/aurelia/templating-resources/issues/388)

Can you have a look and try with my suggestion in the comment there?

---

<div class="post-metadata">

**Author:** ![khuongduybui](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/khuongduybui/32/44_2.png) [@khuongduybui](https://discourse.aurelia.io/u/khuongduybui)\
**Post date:** [September 13, 2019, 2:55pm UTC](https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926/5 "2019-09-13T14:55:05Z")

</div>

I created a pristine new app from latest version of the CLI and could still reproduce the issue. Does that mean the CLI template needs updated too?

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [September 13, 2019, 10:02pm UTC](https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926/6 "2019-09-13T22:02:37Z")

</div>

What is the version of templating resources?

---

<div class="post-metadata">

**Author:** ![khuongduybui](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/khuongduybui/32/44_2.png) [@khuongduybui](https://discourse.aurelia.io/u/khuongduybui)\
**Post date:** [September 14, 2019, 3:02am UTC](https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926/7 "2019-09-14T03:02:06Z")

</div>

```auto
➜ aurelia --version
Global aurelia-cli v1.1.1

➜ aurelia new aurelia-app --unattended --select typescript,jest,vscode,yarn

➜ jq -r '.version' node_modules/aurelia-templating-resources/package.json
1.12.0

```

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [September 17, 2019, 12:31pm UTC](https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926/8 "2019-09-17T12:31:05Z")

</div>

## I’ve updated the github issue with correct answer at [https://github.com/aurelia/templating-resources/issues/388#issuecomment-532198123](https://github.com/aurelia/templating-resources/issues/388#issuecomment-532198123).

@AxelVerstappen Can you try the following in your app entry (probably `main.ts`):

```auto
import {Repeat} from 'aurelia-templating-resources';

Repeat.useInnerMatcher = false;

```

The reason is without static field `useInnerMatcher`, it would have been a breaking changes. So we made it an opt-in fix.

---

<div class="post-metadata">

**Author:** ![AxelVerstappen](https://avatars.discourse-cdn.com/v4/letter/a/aca169/32.png) [@AxelVerstappen](https://discourse.aurelia.io/u/AxelVerstappen)\
**Post date:** [September 17, 2019, 1:19pm UTC](https://discourse.aurelia.io/t/how-to-prefill-a-radio-button-checkbox-with-object-values/2926/9 "2019-09-17T13:19:20Z")

</div>

@bigopon this together with updating `aurelia-templating-resources` to latest version seems to work for us! Thank you very much!