# Radio button click event works but not radio button select

**URL:** <https://discourse.aurelia.io/t/radio-button-click-event-works-but-not-radio-button-select/1479>\
**Category:** Help Requests\
**Created:** [August 1, 2018, 6:15am UTC](https://discourse.aurelia.io/t/radio-button-click-event-works-but-not-radio-button-select/1479 "2018-08-01T06:15:47Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![lakmi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/lakmi/32/810_2.png) [@lakmi](https://discourse.aurelia.io/u/lakmi)\
**Post date:** [August 1, 2018, 6:15am UTC](https://discourse.aurelia.io/t/radio-button-click-event-works-but-not-radio-button-select/1479/1 "2018-08-01T06:15:47Z")

</div>

I have issue in radio button,I want to call event when radio button click that part works fine but radio button not select.without event call it select.

```
<ul class="list-group">
        <li class="list-group-item list-group-item-action" repeat.for="product of products" style="padding-left: 50px;">
            <input class="form-check-input" type="radio" name="rad_product" value.bind="product" checked.bind="selectedProduct" click.delegate="clickedProduct(product)"> ${product.ProductName}
        </li>        
    </ul>
```

---

<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:** [August 1, 2018, 7:23am UTC](https://discourse.aurelia.io/t/radio-button-click-event-works-but-not-radio-button-select/1479/2 "2018-08-01T07:23:24Z")

</div>

Probably you are not returning `true` in your `click.delegate="clickedProduct(product)"` by default,  
`.preventDefault()` is call on the event if result of function evaluation is not `true`

---

<div class="post-metadata">

**Author:** ![lakmi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/lakmi/32/810_2.png) [@lakmi](https://discourse.aurelia.io/u/lakmi)\
**Post date:** [August 1, 2018, 7:30am UTC](https://discourse.aurelia.io/t/radio-button-click-event-works-but-not-radio-button-select/1479/3 "2018-08-01T07:30:16Z")

</div>

Thank you for your support.  
this the way I code

> ```
> clickedProduct(selecteditem) {
> this.GetItems(selecteditem);
> debugger;
> this.selectedProduct=selecteditem;    
> }
> 
> ```

---

<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:** [August 1, 2018, 9:07am UTC](https://discourse.aurelia.io/t/radio-button-click-event-works-but-not-radio-button-select/1479/4 "2018-08-01T09:07:15Z")

</div>

Can you try

```auto
  clickedProduct(selecteditem) {
    this.GetItems(selecteditem);
    this.selectedProduct = selecteditem;
    return true;
  }

```

---

<div class="post-metadata">

**Author:** ![lakmi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/lakmi/32/810_2.png) [@lakmi](https://discourse.aurelia.io/u/lakmi)\
**Post date:** [August 1, 2018, 9:09am UTC](https://discourse.aurelia.io/t/radio-button-click-event-works-but-not-radio-button-select/1479/5 "2018-08-01T09:09:11Z")

</div>

I did the same thing but not working so then I comment this line " this.selectedProduct = selecteditem;" then work

---

<div class="post-metadata">

**Author:** ![davismj](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/davismj/32/267_2.png) [@davismj](https://discourse.aurelia.io/u/davismj)\
**Post date:** [August 1, 2018, 9:49am UTC](https://discourse.aurelia.io/t/radio-button-click-event-works-but-not-radio-button-select/1479/6 "2018-08-01T09:49:23Z")

</div>

This (using checked.bind and a click handler that changes the checked property) is an anti-pattern. You are binding to the value and checked properties of the radio, which updates values automatically.

`<input model.bind="product" checked.bind="selectedProduct" />`

Clicking sets `selectedProduct` to `product`. I don’t know what your `this.GetItems` function is doing, but you probably want to iterate over those items instead of products and use the default checked behavior.