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
New Developer
Posts: 2
Registered: ‎11-09-2012
My Device: DevAlpha B - C , Z10, Q10, Z30, Passport, Bold 9900, Torch 9800, Playbook
My Carrier: Vodafone DE

jQuery BB10 App - false Touch gesture on Device

Hello from Germany,

i have create a jquery Application with the BB10 Theme. But i have a touch gesture error when i Select "Standard Days. it will Touch Automatically on the "Berechnung" Button and open the "Berechnung" Window.

but i will only select "Standard 7 Days" not more action.

this gesture error i have only on the Devices, but on the Google chrome with Ripple works fine.

here are the Code 

 

<!DOCTYPE HTML>
<!--
* Copyright 2012 Research In Motion Limited.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
-->

<html>
	<head>
		<meta charset="utf-8">
		<title>Auslegung von Temperiergeräten</title>
		<!--<meta name="viewport" content="width=device-width, initial-scale=1">-->
		<link rel="stylesheet" href="lib/BlackBerry-JQM-all.css" />
		<script src="lib/BlackBerry-JQM-all.js"></script>
		<script type="text/javascript" src="lib/app.js"></script>
	
		<script language="javascript">
		function berechne(){
 		var summe = parseFloat(document.getElementById('eins').value) * parseFloat(document.getElementById('kunststoff').value) / parseFloat(document.getElementById('zykluszeit').value) * parseFloat(document.getElementById('fachzahl').value);
 		document.getElementById('summe').value = summe;
		}
		</script>


	</head>
	<body>
		<style type="text/css" media="screen">
			.ui-radio, .ui-radio * { 
				outline: none;
			}
			
			textarea.ui-input-text {
				width: 708px;
			}
			input.ui-input-text {
				width: 708px;
			}
			.ui-field-contain .ui-slider.ui-slider-switch {
				float:right;
			}
			
			.ui-controlgroup.ui-controlgroup-horizontal {
				float: right;
			}
			
		</style>
		<div id="actionBarSample" data-role="page">
			<!-- This is how you set up your tab overflow menu (left side panel) -->
			<div data-role="panel" id="left" data-dark-modal="true" data-position="left" data-display="reveal" data-theme="a" class="bb10-panel">
				<ul data-role="listview" data-theme="a">
					<li id="o1-p" class="inBar ui-btn-active"><a href="#">Auslegung</a></li>
					<li id="o2-p" class="inBar"><a href="#">Technische Daten</a></li>
					<li id="o3-p" class="inBar"><a href="#">Kunststoff Daten</a></li>
					<li id="o4-p" class="notInBar"><a href="#">Hinweise</a></li>
					<li id="o5-p" class="notInBar"><a href="#">Copyright</a></li>
				</ul>
			</div>

			<!-- This is how you set up your action overflow menu (right side panel) -->
			<div data-role="panel" id="right" data-position="right" data-display="overlay" data-theme="a" class="bb10-panel">
				<ul data-role="listview" data-theme="a">
					<li><a href="#">Deutsch</a></li>
					<li><a href="#">Englisch</a></li>
					<li><a href="#">Französich</a></li>
				</ul>
				<div data-role="fixedpanelbutton">
					<ul data-role="listview" data-theme="a">
						<li><a href="#">Sprachauswahl</a></li>
					</ul>
				</div>
			</div>
            
            <!-- Bis hier hin Linke und Rechte Flow Menu -->

			<div data-role="header" data-theme="b">
				<h1>Auslegung von Temperiergeräten</h1>
			</div><!-- /header -->
            
            
			<div data-role="content">
				<!-- Page (Startseiten Inhalt) -->
            
            <div
            <ul data-role="listview" data-dividertheme="c">
			<li data-role="list-divider">Werkzeugdaten bei bekannten Werten:</li>
            </div> 
                
            <div data-role="collapsible-set" data-iconpos="right">
					<div data-role="collapsible" data-collapsed="right" data-icon="gear">
						<h3>Werkzeuggewicht</h3>
						<div data-role="fieldcontain">
						<input type="text" name="text-input" id="basic" placeholder="Gewicht in kg"/>
                        <label for="basic"><h6>kg</h6></label>
						</div><!-- Gewicht in kg hier Eintragen -->
					</div>  
                    
                    <div data-role="collapsible">
						<h3>Werkzeugdimension</h3>
                        <div data-role="fieldcontain">
						<input type="text" name="text-input" id="basic" placeholder="Länge in mm"/>
                        <label for="basic"><h6>mm</h6></label>
						<input type="text" name="text-input" id="basic" placeholder="Höhe in mm"/>
                        <label for="basic"><h6>mm</h6></label>
						<input type="text" name="text-input" id="basic" placeholder="Breite in mm"/>
                        <label for="basic"><h6>mm</h6></label>
                        </div><!-- Gewicht in kg hier Eintragen -->
                    </div>
            </div>
            
            <div
            <ul data-role="listview" data-dividertheme="c">
			<li data-role="list-divider">Materialdaten bei bekannten Werten:</li>
            </div> 
                    
            <div data-role="collapsible-set" data-iconpos="right">
					<div data-role="collapsible" data-collapsed="right" data-icon="gear">
						<h3>Materialdurchsatz</h3>
						<div data-role="fieldcontain">
						<input type="text" name="text-input" id="basic" placeholder="Materialdurchsatz in kg/h"/>
                        <label for="basic"><h6>kg/h</h6></label>
						</div><!-- Gewicht in kg hier Eintragen -->
					</div>  
                    
                    	<div data-role="collapsible">
						<h3>Formteilgewicht</h3>
                        <div data-role="fieldcontain">
						<input type="text" name="text-input" id="basic" placeholder="Formteilgewicht in Gramm"/>
                        <label for="basic"><h6>gr.</h6></label>
						<input type="text" name="text-input" id="basic" placeholder="Fachzahl in Stk"/>
                        <label for="basic"><h6>Stk</h6></label>
						<input type="text" name="text-input" id="basic" placeholder="Zykluszeit in Sek"/>
                        <label for="basic"><h6>Sek</h6></label>
                        </div><!-- Gewicht in kg hier Eintragen -->	
                    </div>
            </div>

			<div data-role="fieldcontain">
			<label for="select-choice-1" class="select">Umlaufmedium:</label>
			<select name="select-choice-1" id="select-choice-1">
			<option value="standard">Standard: 7 day</option>
			<option value="rush">Rush: 3 days</option>
			<option value="express">Express: next day</option>
			<option value="overnight">Overnight</option>
			</select>
			</div>
           
            
            
			</div><!-- /content -->
            
			<div data-role="footer" data-position="fixed">
				<div data-role="actionbar">
					<a id="tover" data-role="tab-overflow" href="#left" class="">
						<!-- Uncomment this to have initial content in the tab overflow button
						<img src="img/generic_81_81_placeholder.png" alt="" />
						<p>0 Options</p>
						-->
					</a>
					<a id="o1" data-role="tab" data-href="actionbar.html" class="active">
						<img src="img/ic_edit.png" alt="" />
						<p>Auslegung</p>
					</a>
					<a id="o2" data-role="tab" href="#page2">
						<img src="img/ic_done.png" alt="" />
						<p>Berechnung</p>
					</a>
					
					
					
					<a id="aover" data-role="action-overflow" href="#right">
					</a>
				</div>

			</div>
	</div><!-- /page 2 -->
		<div data-role="page" id="page2">
			<div data-role="header" data-theme="c">
				<h1>Berechnung</h1>
			</div><!-- /header -->
			<div data-role="content">
			</div><!-- /content -->
            
            <!-- Footer -->
            <div data-role="footer" data-position="fixed">
				<div id="action-bar-area" data-role="actionbar">
					<div data-role="back"></div>
            </div>
            <!-- Footer -->
                    
		</div><!-- /page -->
        </div>
        
        	</div><!-- /page 3 Anleitung-->
		<div data-role="page" id="page3">
			<div data-role="header" data-theme="c">
				<h1>Page 3</h1>
			</div><!-- /header -->
			<div data-role="content">
			<h3>Group Divider</h3>
				<hr class="BB10Group">
            </div><!-- /content -->
            
            <!-- Footer -->
            <div data-role="footer" data-position="fixed">
				<div id="action-bar-area" data-role="actionbar">
					<div data-role="back"></div>
            </div>
            <!-- Footer -->
            
		</div><!-- /page -->
		<script>
			
		</script>
	</body>
</html>

 





regards Marcel