Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
Highlighted
Developer
Posts: 25
Registered: ‎12-09-2012
My Device: Z10
My Carrier: Congstar Germany

BB JQM - applicationMenu with 2 pages?

[ Edited ]

Hey,

 

I dont get the ApplicationMenue not working with more than 1 page!

See here:

 

The swipedown works fine on

<div id="applicationMenu" data-role="page">

 

but nothing works on swipedown on the second page:

 

<div id="2screen" data-role="page">

 

 

Here is my code:

 

 


<!DOCTYPE HTML>

<html>
<head>
<meta charset="utf-8">
<title>Application Menu</title>
<!--<meta name="viewport" content="width=device-width, initial-scale=1">-->
<link rel="stylesheet" href="BlackBerry-JQM-all.css" />
<script src="BlackBerry-JQM-all.js"></script>
<script type="text/javascript" src="app.js"></script>
</head>
<body>
<div id="applicationMenu" data-role="page">
<!-- This is how you set up your application menu (top panel) -->
<div data-role="panel" id="top" data-dark-modal="true" data-position="top" data-display="push" data-theme="a" class="">
<div data-role="applicationmenu">

<a data-role="action" href="#">
<img src="img/Core_applicationmenu_icon_help.png" alt="" />
<p>Help</p>
</a>
<!-- data-role=SettingsActionItem places the settings action on the right side when it is the only item in the menu -->
<a data-role="SettingsActionItem" href="#">
<img src="img/Core_applicationmenu_icon_settings.png" alt="" />
<p>Settings</p>
</a>

<!-- Maximum of 5 actions. Any extra actions will not appear on the menu -->
<a data-role="action" href="#">
<img src="img/generic_81_81_placeholder.png" alt="" />
<p>This option should not show up</p>
</a>
</div>
</div>

<div data-role="header" data-theme="c">
<h1>Application Menu</h1>
</div><!-- /header -->
<div data-role="content">
<!-- Put your page content here -->
<a id="menuBtn" data-role="button" href="#top">Open application menu </a>
<h2 id="simulInst" style="text-align: center">Open application menu by firing "blackberry.event.swipedown"<h2>
</div><!-- /content -->

<div data-role="footer" data-position="fixed">
<div id="action-bar-area" data-role="actionbar">
<div data-role="back"></div>
<a id="o3" data-role="tab" href="#2screen" >
<img src="images/search.png" alt="" />
<p>Suche</p>
</a>
</div>
</div>
</div>
<!-- /page -->

 


<div id="2screen" data-role="page">
<!-- This is how you set up your application menu (top panel) -->
<div data-role="panel" id="top" data-dark-modal="true" data-position="top" data-display="push" data-theme="a" class="">
<div data-role="applicationmenu">

<a data-role="action" href="#">
<img src="img/generic_81_81_placeholder.png" alt="" />
<p>Option3</p>
</a>
<!-- data-role=SettingsActionItem places the settings action on the right side when it is the only item in the menu -->
<a data-role="SettingsActionItem" href="#">
<img src="img/Core_applicationmenu_icon_settings.png" alt="" />
<p>Settings</p>
</a>

<!-- Maximum of 5 actions. Any extra actions will not appear on the menu -->
<a data-role="action" href="#">
<img src="img/generic_81_81_placeholder.png" alt="" />
<p>This option should not show up</p>
</a>
</div>
</div>

<div data-role="header" data-theme="c">
<h1>Application Menu</h1>
</div><!-- /header -->
<div data-role="content">
<!-- Put your page content here -->

</div><!-- /content -->

<div data-role="footer" data-position="fixed">
<div id="action-bar-area" data-role="actionbar">
<div data-role="back"></div>
<a id="o3" data-role="tab" href="#searchscreen" >
<img src="images/search.png" alt="" />
<p>Suche</p>
</a>
</div>
</div>
</div><!-- /page -->


</body>
</html>