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

Click event handler get applied every time once a new, not loaded external view opens from drawer

2 Answers 78 Views
Drawer (Mobile)
This is a migrated thread and some comments may be shown as answers.
Roger
Top achievements
Rank 1
Roger asked on 04 Nov 2014, 02:48 PM
I have a phonegap application including a drawer instance. I'm using the newest Kendoui and was trying the latest internal build.
Every time I open an external view (a href link, without http, local file in phonegap) in the drawer all event handler get applied again to any allready loaded view. This happens only if I open/load a new external view.
If I open an allready open external view the click event handler don't get applied again. This ends in having as much click event handler applied as I open external views from the drawer.

kendoui 2014.2.1020.commercial

The code I'm using looks like:

<!-- drawer -->
<div id="drawer"
     data-role="drawer"
     data-swipe-to-open="true"
     data-before-show="onBeforeShowDrawer">
  <ul data-role="listview">
    <li class="block dark">
      <div class="left">
        <a href="content/candidate/index.html"
           data-role="button"
           data-badge="10"
           data-icon="candidates">
          Candidates
        </a>
      </div>
      <div class="right">
        <a href="content/job/index.html"
           data-role="button"
           data-badge="10"
           data-icon="community">
          Jobs
        </a>
      </div>
    </li>
  </ul>
</div>
 
<!-- layout -->
<div data-role="layout" data-id="default">
  <header data-role="header">
    <div data-role="navbar">
      <a href="#drawer"
         data-role="button"
         data-icon="settings"
         data-rel="drawer"
         data-align="left"></a>
      <a href="content/settings/index.html"
         data-role="button"
         data-icon="settings"
         data-align="right"></a>
    </div>
  </header>
  <footer data-role="footer">
    <div data-role="tabstrip">
      <a href="#drawer"
         data-role="button"
         data-icon="home"
         data-rel="drawer"
         data-align="left"></a>
      <a href="#index"
         data-role="button"
         data-icon="home">Home</a>
    </div>
  </footer>
</div>
 
<div data-role="layout" data-id="plain"></div>
 
<!-- views -->
<div id="index"
     data-role="view"
     data-title="Home"
     data-layout="default"
     data-init="onInitIndex">
  <div id="logo"></div>
</div>
 
    var app = new kendo.mobile.Application($(document.body), {
        root: "",
        initial: page,
        layout: layout,
        skin: "flat",
        // no transition by default with drawer navigation
        // transition: "slide",
        webAppCapable: true
    });

2 Answers, 1 is accepted

Sort by
0
Roger
Top achievements
Rank 1
answered on 04 Nov 2014, 03:17 PM
I probably has nothing to do with the drawer itself. This also happens if I open any remote view within a link. from the footer/tabstrip e.g.

<a href="content/dossier/index.html"
   data-role="button"
   data-badge="10"
   data-icon="dossiers">
  Dossiers
</a>

it does not happen if I open a link with a data-click handler e.g 

          <a href="" id="onClickAbout"
             data-role="button"
             data-enable="true"
             data-click="onClickAbout"
             data-i18n="registration.link.about">
            About
          </a>
 
 
function onClickAbout(e) {
    e.preventDefault();
    var url =  XSERVER_BASE_URL + "about.html";
    app.app.navigate(url);
}

0
Petyo
Telerik team
answered on 06 Nov 2014, 11:47 AM
Hello Roger,

this is not a known issue. Is there any chance that you instantiate a new mobile application in the scripts of the remote view? 

Regards,
Petyo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Drawer (Mobile)
Asked by
Roger
Top achievements
Rank 1
Answers by
Roger
Top achievements
Rank 1
Petyo
Telerik team
Share this question
or