Actionsheet firing twice on ios(iPhone)

10 posts, 0 answers
  1. Joon
    Joon avatar
    30 posts
    Member since:
    Aug 2012

    Posted 23 Jun 2012 Link to this post

    Hi,
    I have a action button that fire OK. But the issue is it fires the event twice on ios safari browser, once initially and another on a next touch on the screen. This does not happen on my desktop Chrome.

    Any help would be much appreciated. Thanks.

    <a data-role="button" data-rel="actionsheet" href="#my_received_actionsheet" data-align="right" data-icon="action" >Action</a>


            <ul data-role="actionsheet" id="my_received_actionsheet">
                <li class="km-actionsheet-title">You Action Required : </li>
                <li><a href="#" data-action="my_received_action.confirm">Confirm booking</a></li>
                <li><a data-action="my_received_action.decline">Decline booking</a></li>
                <li><a data-action="my_received_action.mark_as_paid">Mark as paid</a></li>
            </ul>


    <script>
            var my_received_action = {
                confirm: function (e) {
                    alert("confirm");
                },
                decline: function (e) {
                    alert("decline");
                },
                mark_as_paid: function (e) {
                    alert("mark_as_paid");
                }
            }
    </script>
  2. Joon
    Joon avatar
    30 posts
    Member since:
    Aug 2012

    Posted 23 Jun 2012 Link to this post

    a
  3. Kendo UI is VS 2017 Ready
  4. Juan Carlos
    Juan Carlos avatar
    8 posts
    Member since:
    Oct 2012

    Posted 12 Nov 2012 Link to this post

    any solution?
  5. Ibrahim
    Ibrahim avatar
    5 posts
    Member since:
    Jun 2012

    Posted 11 Nov 2013 Link to this post

    I have same problem. Any solution for this?
  6. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 12 Nov 2013 Link to this post

    Hello Ibrahim,

    This issue was fixed a while ago, can you reproduce it using the latest version of Kendo UI? If the problem persists after upgrading, please extract a runnable sample and we will be more than happy to take a look. 

    Kind regards,
    Kiril Nikolov
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Ibrahim
    Ibrahim avatar
    5 posts
    Member since:
    Jun 2012

    Posted 12 Nov 2013 Link to this post

    Hi Kiril,
    I test it using examples for basic usage of actionsheet (http://demos.kendoui.com/mobile/actionsheet/index.html#/) and add alert for every action:

        function reply(e) {
            $("#actionResult").html("Replying to message #" + e.context);
            alert("reply");
        }

        function replyAll(e) {
            $("#actionResult").html("Replying to all in message #" + e.context);
            alert("reply all");
        }

        function archive(e) {
                $("#actionResult").html("Archiving message #" + e.context);
                alert("archive");
        }

    It uses latest verson of Kendo UI v2013.2.918, and test it on iPhone (ios 6.0.1) and iPad (ios 5.1.1).

    Thank you
  8. Petyo
    Admin
    Petyo avatar
    2438 posts

    Posted 13 Nov 2013 Link to this post

    Hello Ibrahim,

    Apologies for the confusion. My colleague forgot to mention that the problem is due to the alert function call. If you substitute it with console.log, the events are fired as expected. 

    Regards,
    Petyo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  9. Ibrahim
    Ibrahim avatar
    5 posts
    Member since:
    Jun 2012

    Posted 13 Nov 2013 Link to this post

    Hi Petyo,
    Do you have any recommendation how to add a confirmation window or alert for an action?
    Because the same thing happens when I use window.confirm.

    This is my code for window.confirm:

    function approve(e) {
            var conf = window.confirm("Approve this request?");

            if (conf== true) {
            }
    }

    The confirmation window displayed twice.

    Thank you,
    Ibrahim
  10. Petyo
    Admin
    Petyo avatar
    2438 posts

    Posted 13 Nov 2013 Link to this post

    Hello Ibrahim,

    a simple trick which works around the problem is to wrap the call in a setTimeout:

     

    function approve(e) {
    setTimeout(function() {
            var conf = window.confirm("Approve this request?");
     
            if (conf== true) {
            }
     
    }, 0);
    }

    Regards,
    Petyo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  11. Ibrahim
    Ibrahim avatar
    5 posts
    Member since:
    Jun 2012

    Posted 13 Nov 2013 Link to this post

    Hi Petyo,
    Thanks for the trick. I'll try it.

    Thank you,
    Ibrahim
Back to Top
Kendo UI is VS 2017 Ready