I'm having trouble binding the select event of a buttongroup to a method of the viewModel.
Typically, this would look something like this:
<div>
<ul class="location-type-buttons" data-role="buttongroup" data-index="0" data-bind="...">
<li>Option 1</li>
<li>Option 2</li>
<li>Option 3</li>
<li>Option 4</li>
</ul>
</div>
<div style="position: relative;-webkit-box-flex: 1;border: 1px solid black">
<div data-role="view" style="position: absolute;">Option 1 Title</div>
<div data-role="view" style="position: absolute;">Option 2 Title</div>
<div data-role="view" style="position: absolute;">Option 3 Title</div>
<div data-role="view" style="position: absolute;">Option 4 Title</div>
</div>
When I use data-bind="click: doSelect", the views appear correctly but nothing happens (the buttongroup has a select event instead of a click event).
When I use data-bind:"select: doSelect", the titles of the four views appear simultaneously, and the event handler is still not called.
What am I missing here? Thanks!
Typically, this would look something like this:
<div>
<ul class="location-type-buttons" data-role="buttongroup" data-index="0" data-bind="...">
<li>Option 1</li>
<li>Option 2</li>
<li>Option 3</li>
<li>Option 4</li>
</ul>
</div>
<div style="position: relative;-webkit-box-flex: 1;border: 1px solid black">
<div data-role="view" style="position: absolute;">Option 1 Title</div>
<div data-role="view" style="position: absolute;">Option 2 Title</div>
<div data-role="view" style="position: absolute;">Option 3 Title</div>
<div data-role="view" style="position: absolute;">Option 4 Title</div>
</div>
When I use data-bind="click: doSelect", the views appear correctly but nothing happens (the buttongroup has a select event instead of a click event).
When I use data-bind:"select: doSelect", the titles of the four views appear simultaneously, and the event handler is still not called.
What am I missing here? Thanks!