This is a migrated thread and some comments may be shown as answers.

BUG: event passed to click event handler does not tell you which action button has been clicked

5 Answers 118 Views
ActionSheet
This is a migrated thread and some comments may be shown as answers.
Jack
Top achievements
Rank 2
Iron
Jack asked on 01 Nov 2012, 12:36 PM
To reproduce:
  1. Take the sample at http://demos.kendoui.com/mobile/actionsheet/index.html
  2. Modify to call the same event handler
<ul data-role="actionsheet" id="inboxActions" data-open="onOpen" data-popup='{"direction": "left"}'>
    <li class="km-actionsheet-title">Monday Meeting:</li>
    <li><a href="#" data-action="reply">Reply</a></li>
    <li><a href="#" data-action="replyAll">Reply All</a></li>
    <li><a href="#" data-action="archive">Archive</a></li>
</ul>

becomes

<ul data-role="actionsheet" id="inboxActions" data-open="onOpen" data-popup='{"direction": "left"}'>
    <li class="km-actionsheet-title">Monday Meeting:</li>
    <li><a href="#" data-action="singleEventHandler">Reply</a></li>
    <li><a href="#" data-action="singleEventHandler">Reply All</a></li>
    <li><a href="#" data-action="singleEventHandler">Archive</a></li>
</ul>

Then try implementing singleEventHandler as below:

function singleEventHandler(e) {
    if (<some test involving e>) {
        $("#actionResult").html("Replying to message #" + e.context);
    } else if (<some other test involving e>) {
        $("#actionResult").html("Replying to all in message #" + e.context);
    } else if (<some other test involving e>) {
        $("#actionResult").html("Archiving message #" + e.context);
    }
     doMoreStuff();
}

The problem is e only has two properties: target and context

target is not the button which has triggered the event but the button which has opened the action sheet, so there is no way to know which button in the action sheet has been triggered in the event handler.

If not a bug, this is in my opinion a design issue which prevents properly factoring code as the only workaround is to multiply event handlers when it is not always necessary.

5 Answers, 1 is accepted

Sort by
0
Jack
Top achievements
Rank 2
Iron
answered on 01 Nov 2012, 01:00 PM
Please add e.sender to the event where sender is the actionsheet button.
0
John
Top achievements
Rank 1
answered on 04 Dec 2012, 01:51 AM
Is there any workaround to this?

I tried a hack of setting a global variable in the action and then referencing it in an onclick handler.

This works in browsers but does not work when deployed via phone gap to android. 

Look forward to finding a solution,.

Thanks
0
Petyo
Telerik team
answered on 04 Dec 2012, 08:29 AM
Hi,

The behavior described here is by design, as the widget is used mostly to perform different actions (for instance - forwarding, deleting or replying to email). Having the same function as callback for such actions is not a common case.  

If you need to performs similar actions from a list of items, I would like to suggest that you look into our dropdown widget in a mobile form demo - it has similar look.  

All the best,
Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Jack
Top achievements
Rank 2
Iron
answered on 10 Dec 2012, 09:37 AM
Adding the triggering button to the event object in the event handler should not have a significant impact on the design, would make the ActionSheet control much more versatile and makes much more sense than using a data control as a command control. Can you please relay the suggestion to the dev team?
0
Iliana Nikolova
Telerik team
answered on 10 Dec 2012, 04:59 PM
Hello Jacques,

I am afraid that implementation of the described feature is not in our immediate plans, however we will consider it for future releases. We will appreciate it if you submit your query as a feature request at our UserVoice portal, so the community would be able to vote and comment it. The more votes the suggestion collects, the higher priority will have.

Kind regards,
Iliana Nikolova
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
ActionSheet
Asked by
Jack
Top achievements
Rank 2
Iron
Answers by
Jack
Top achievements
Rank 2
Iron
John
Top achievements
Rank 1
Petyo
Telerik team
Iliana Nikolova
Telerik team
Share this question
or