CODEWITHSUNDEEP
javascriptangularjsionic-framework
methuselah
methuselah

Reputation: 13216

Add clickable button to ion-radio

How do you add a clickable button to an ion-radio component?

enter image description here

I want to give the user the capability to select an item and click on the question mark button for more information. But at the moment, it seems that I can't click any of the buttons I add. This is my code so far:

<div ng-if="identities.length > 0">
    <ion-checkbox class="item item-button-right" ng-model="filter.blue" ng-repeat="identity in identities">
        {{ identity. title }}
        <button class="button button-clear button-padding" ng-click="showAddImageTagPopup()" ng-controller="PopupController">
                <i class="icon ion-help-circled"></i>
        </button>                   
    </ion-checkbox>
</div>

Upvotes: 0

Views: 901

Answers (1)

Anas Omar
Anas Omar

Reputation: 504

you have to do it using css, you have to set the button out of the ion-checkbox then wrap both the button and the ion-check in a div like this 

<div ng-if="identities.length > 0">
<div ng-repeat="identity in identities">
<ion-checkbox class="item item-button-right" ng-model="filter.blue"
 >
    {{ identity. title }}

</ion-checkbox>
<button class="button button-clear button-padding" 
ng-click="showAddImageTagPopup()" ng-controller="PopupController">
            <i class="icon ion-help-circled"></i>
    </button>
</div>
</div>

and add these css rules for the button

position: absolute;
top: 5px;
right: 4px;
z-index: 9999999;

Upvotes: 1

Related Questions