Show or Hide buttons from property value - aurelia

I have a list of items in a table and want to enable or disable some buttons based off a boolean property called "enabled". Code for the buttons are as follows
<button class="btn btn-sm btn-primary" show.bind="item.enabled" click.delegate="toggleEnabled()">Disable</button>
<button class="btn btn-sm btn-warning" show.bind="!item.enabled" click.delegate="toggleEnabled()">Enable</button>
No matter what the value for item.enabled, only the disable button shows. Wondering what I am missing?

click.delegate="item.toggleEnabled()" add the item. before toggleEnabled and you'll be good to go!
Here is an example with working code: https://github.com/AshleyGrant/skeleton-navigation/tree/so-answer-20150416-02/src

Make sure that item.enabled is being returned as a boolean and not a string.

Related

GetElementById, but I can't find the ID in vb.net

I was trying to use getelementbyid on vb.net, but I can't find the ID, can you help me? The button code is this below:
<button class="btn btn-default btn-block" type="button" onclick="start()"
What code do I use to press the desired button?

Web Accessibility Error

When using https://wave.webaim.org/ to check a page for accessibility It detects (3) red errors. seems this is all coming from colorbox jquery.colorbox.min.js
3x empty button
<button type="button" id="cboxPrevious">
<button type="button" id="cboxNext">
<button id="cboxSlideshow">
How can this be repaired? I know that the button type should be Some Content
Not
I had the same problem as you.. All I did was to disable a plugin called Yith compare..

in Vuejs, is it possible to bind a model to a button?

Just starting to work with Vuejs - is it possible to bind a model to a button like so:
<button class="btn btn-outline-secondary" v-model="pricing" #click="showCountyModal = true">edit</button>
It doesn't appear to. Would the idiomatic pattern be to use:
<button class="btn btn-outline-secondary" #click="willShowCountyModal(pricing)">edit</button>
which does seem to work?
v-model in vuejs is used for two-way binding of data from model to template and template to model used for input field to bind data with model, you cannot add v-model to button, its not correct. So second approach is correct:
<button class="btn btn-outline-secondary" #click="willShowCountyModal(pricing)">edit</button>

Bootsrap href to button not working mobile but working for desktop

Here is my code:
<a href="dashboard.php">
<button type="button" class="btn btn-primary" style="background-color:#5f5f5f;">
View Summary
</button>
</a>
Any help is appreciated.
This is the easy way to do that:
View Summary
Please look at this http://www.w3schools.com/bootstrap/bootstrap_buttons.asp
And consider adding additional class for background color in CSS.
You may check this Fiddle
It's just wrapping button in anchor tags..
<div class="btn-group">
<a href=href="dashboard.php"><button class="btn btn-primary dropdown-toggle">
View Summary
</button></a>
</div>

How to add kyeup:13 on popup modal in vuejs?

I want enter key should work on popup window.
I tried this
<button class="btn btn-primary" type="button" v-on:click="renameFolder(folder.Id)" v-on:keyup.13="renameFolder(folder.Id)">Rename</button>
Enter key does not work