Dynamic Action Sheet

5 posts, 1 answers
  1. David
    David avatar
    60 posts
    Member since:
    Nov 2012

    Posted 28 Dec 2012 Link to this post

    I am trying to get an action sheet to modify itself depending on which screen it is on.  Basically in my scenario I have an button on my navbar that I wish to be a context sensitive menu.  I have a jsbin to show an example of what I am trying here ... http://jsbin.com/ehicof/5/edit.

    If you hit the 'logout' button on the top right initially the action sheet looks fine, when you go to the search tab and then to 'search 1' I change the action sheet contents to have a 'search 1' button, however the action sheet doesn't grow (and thus the 'cancel' button is not visible).  I have tried re-initializing the action sheet to no avail (using kendo.mobile.init), perhaps I am using it wrong.  Am I taking the wrong approach here?  Would I be better off making multiple action sheets and then changing the link on the navbar to the appropriate one?
  2. Answer
    Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 28 Dec 2012 Link to this post

    Hello David,

    Replacing the html of the widget at runtime is not supported. Instead please destroy the widget, change the mark-up and init it again.
    function search1Show(){
        $("#userActions").data("kendoMobileActionSheet").destroy();
        $("#userActions").html('<li class="km-actionsheet-title">Select Action</li> <li><a href="#" data-action="search1">search1</li></a><li><a href="#" data-action="changeProfile">Change Profile</a></li><li><a href="#" data-action="Logout">Logout</a></li>');
        kendo.init($("#userActions"), kendo.mobile.ui);
    }

    Please note that destroy method is available in Q3 release. You have to upgrade to version 2012.3.1114 or later.
    Here is a link to the updated example: http://jsbin.com/ehicof/8/edit

    Regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. David
    David avatar
    60 posts
    Member since:
    Nov 2012

    Posted 28 Dec 2012 Link to this post

    Works great, thanks for your help Alexander.
      -David
  5. David
    David avatar
    60 posts
    Member since:
    Nov 2012

    Posted 28 Dec 2012 Link to this post

    Quick followup, while this technique works, is this the 'appropriate' way to handle this scenario?  Am I better off dynamically building the list for each view or is it generally a better idea to have multiple action sheets?
  6. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 28 Dec 2012 Link to this post

    Hello David,

    The answer of this questions depends on the requirements of your project. Generally speaking I would recommend to create separate action sheets.
    Please test the solutions and choose the one that best suits to your case.

    Regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top
Kendo UI is VS 2017 Ready