How can i prevent tabstrip footer blinking when load a remote view?

5 posts, 0 answers
  1. Orlando
    Orlando avatar
    9 posts
    Member since:
    Mar 2013

    Posted 20 Feb 2014 Link to this post

    hi,

    Please advise....How can i prevent tabstrip footer blinking when i load a remote view? any trick?

    This is my remote view:
    <div data-role="view" id="order_list_mobile" data-layout="mobile-tabstrip" data-title="<?php echo $this->language->get('text_sale');?>"  data-reload="true" data-show="afterShow">
        <header data-role="header">
            <div data-role="navbar">
                <a data-role="backbutton" data-align="left">Back</a>
                <span data-role="view-title"><?php echo $this->language->get('text_sale');?></span>
            </div>
        </header>
        <ul data-role="listview" data-style="inset" data-type="group" class="inboxList">
            <li>
                <?php echo $this->language->get('text_sale');?>
                <ul>
                    <?php if ($orders) { ?>
                            <?php $id = 0;?>
                            <?php foreach ($orders as $order) { ?>
                                <li>
                                    <h3 class="time"><?php echo $order['customer']; ?></h3>
                                    <h3><?php echo $order['date_added']; ?></h3>
                                    <h3><?php echo $order['total']; ?></h3>
                                    <p><?php echo $order['date_added']; ?></p>
                                     
                                    <?php foreach ($order['action'] as $action) { ?>
                                        <a data-role="button" href="<?php echo $action['href'];?>">
                                            <?php echo $action['text']; ?>                       
                                        </a>
                                    <?php } ?>
                                     
                                </li>
                            <?php } ?>
                         
                    <?php } ?>
                </ul>
            </li>
        </ul>
    </div>
     
    <script>
        function afterShow(e) {
            var tabstrip = e.view.footer.find(".km-tabstrip").data("kendoMobileTabStrip");
                tabstrip.switchTo(2);
        }
    </script>


    And this is my footer that  initialized just one time:
    <div data-role="layout" data-id="mobile-tabstrip">
        <header data-role="header">
            <div data-role="navbar">
                <a data-align="left" data-role="backbutton" class="nav-button"><?php echo $this->language->get('button_back');?></a>
                <span data-role="view-title"></span>
                <a data-align="right" data-role="button" class="nav-button" href="#index" data-icon="refresh"></a>
            </div>
        </header>
        <div data-role="footer">
            <div data-role="tabstrip" id="myTabStrip">
                <a href="#tabstrip-home" data-icon="recents"><?php echo $this->language->get('tab_general');?></a>
                <a href="#index.php?route=catalog/product&token=<?php echo $this->session->data['token'];?>" data-icon="cart"><?php echo $this->language->get('text_catalog');?></a>
                <a href="#index.php?route=sale/order&token=<?php echo $this->session->data['token'];?>" data-icon="bookmarks"><?php echo $this->language->get('text_sale');?></a>           
                <a href="#tabstrip-settings" data-icon="settings"><?php echo $this->language->get('text_setting');?></a>
            </div>
        </div>
    </div>



    Please see the video with my problem:

    http://www.youtube.com/watch?v=OI8pkYXC6rk

  2. Orlando
    Orlando avatar
    9 posts
    Member since:
    Mar 2013

    Posted 20 Feb 2014 in reply to Orlando Link to this post

  3. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2595 posts

    Posted 24 Feb 2014 Link to this post

    Hi Orlando,

    Thank you very much for bringing this to our attention.

    I have managed to reproduce the issue that you are describing. But in order to provide you with a fix, we will need some more time to investigate in more details. As soon as we have more information, we will get back to you.

    Thank you very much for your patience and understanding.

    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  4. Orlando
    Orlando avatar
    9 posts
    Member since:
    Mar 2013

    Posted 26 Feb 2014 in reply to Kiril Nikolov Link to this post

    Hi again:

    I can confirm that is a Chrome Browser problem. Tested on device and works fine!
  5. Petyo
    Admin
    Petyo avatar
    2442 posts

    Posted 26 Feb 2014 Link to this post

    Hi Orlando,

    thank you very much for sharing your finding. Indeed, such behavior may be browser specific. In case you face some other problems of such kind, do not hesitate to re-open this thread. 

    Regards,
    Petyo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top