jeudi 28 mai 2015

Disabling click triggering on a checkbox inside a div with a click event in Ember

I have divs created with a #each loop. Each div have a click action and contains a checkbox. I want to prevent the checkbox from triggering the click event of its parent div. I am using Ember.js handlebars.

<script type="text/x-handlebars" data-template-name="conversations">   
    {{#each conv in model itemController='singleconv'}}
            <div class="conversation-content-wrapper" {{action "clickConv" conv preventDefault=false}}>
                    <div class="history-message-assigned in-progress-closed" style="display:none;"><p><i class="icon-x"></i>Conversation closed</p></div>
                    <div class="history-message-assigned in-progress-assignation" style="display:none;"><p><i class="icon-assign"></i>Conversation assigned</p></div>
                    <div class="history-message-assigned in-progress-reopen" style="display:none;"><p><i class="icon-re-opened"></i>Conversation re-opened</p></div>          
                <div class="conversation-history">          
                    <div class="conversation-time-history">{{{conv.timeAgoElement}}}</div>
                    <div class="conversation-details">
                        <span class="unread-numbers"></span>
                        {{input type='checkbox' checked=conv.isChecked bubbles="false"}}
                             <span class="conversation-name">{{conv.customer.name}}</span>
                             <span class="phone-number">{{conv.customer.cellPhoneNumber}}</span>
                            <p class="conversation-text">{{conv.lastMessage}}</p>
                    </div>
                </div>                       
            </div>
    {{/each}}     
</script>

What is the most efficient way to do so? I did look onto the bubbles="false" attribute, but either I don't put it at the right place or it isn't made for this case.




Aucun commentaire:

Enregistrer un commentaire