-DYD6FULSW$3,_$SSHU\LR'HY&HQWHU
(https://appery.io/)
Dev Center (https://devcenter.appery.io)
Blog (https://blog.appery.io)
Home (https://devcenter.appery.io)
Getting Started (https://devcenter.appery.io/getting-started/)
Tutorials (https://devcenter.appery.io/tutorials/)
Documentation (https://devcenter.appery.io/documentation/)
Videos (https://www.youtube.com/user/apperyio)
Roadmap (https://devcenter.appery.io/roadmap/)
Get Help (https://devcenter.appery.io/getting-help/)
FAQ (https://devcenter.appery.io/faq/)
Services (https://appery.io/services)
About Us (https://appery.io/about-us/)
Get Help
PRICING & SIGN UP (HTTPS://APPERY.IO/PRICING)
GO TO PLATFORM (HTTPS://APPERY.IO/APP)
Platform (https://appery.io/appbuilder/)
Customers (https://appery.io/partners/)
Partners (https://appery.io/partners/)
Search here
Apperyio(id)
Apperyio.navigateTo(page, {})
Apperyio.getImagePath(name)
Examples
Show/hide an element
Check if the element is visible
Launching the native dialer and SMS app
Home (https://devcenter.appery.io) Documentation (https://devcenter.appery.io/documentation/) jQuery Mobile
(https://devcenter.appery.io/documentation/jqm/) JavaScript API
Appery.io comes with a small JavaScript library to make it easier to select elements in the DOM. It only provides a few functions, so you still need be familiar
with thejQuery API (http://api.jquery.com/).
Its extremelyimportant that you know how to select elements in the DOM using just the API.
Apperyio(id)
is a shortcut to get a reference to a component on a screen by using its designated name.
Example:
On a button click, say youd like to read the value entered into the input field:
1. Add a event to the button.
2. Add a
action to the event.
3. Add this JavaScript as the custom JavaScript (assuming the component name is input):
1 var input = Apperyio('input');
2 alert (input.val());
4. The app will look like:
The example above is a quick and easy way to get access to any component in the screen. Its equivalent to using jQuery directly:
KWWSVGHYFHQWHUDSSHU\LRGRFXPHQWDWLRQMTPMDYDVFULSWDSL
-DYD6FULSW$3,_$SSHU\LR'HY&HQWHU
The example above is a quick and easy way to get access to any component in the screen. Its equivalent to using jQuery directly:
1 var input = $('input[dsid="input"]');
2 alert (input.val());
Once you get a reference to an element, you can use thejQuery API (http://docs.jquery.com/Main_Page)to manipulate the element. Its plain JavaScript and
jQuery nothing else!
Once you get a reference to a component, which part of the API is available depends on the component.
For example, if you got a reference to an component, then you could use this to read or set its value:
1 Apperyio('input').val();
2 Apperyio('input').val('hello');
If you get a reference to a component, then the API is different, and to read the value, you would use:
1 Apperyio('output').text();
Its important to familiarize yourself with the and API.
Apperyio.navigateTo(page, {})
This allows you to navigate to another page using JavaScript.
For example, if you have a page named , to navigate to this page, you would use:
1 Apperyio.navigateTo('menuPage', {});
The second argument may be blank, but you can use it to specify a transition affect. For example:
1 Apperyio.navigateTo('menuPage', {transition : 'slideup'});
All available transitions (http://jquerymobile.com/demos/1.2.0/docs/pages/page-transitions.html) are listed on the jQuery Mobile site.
You can also specify whether the transition should be done in reverse:
1 Apperyio.navigateTo('menuPage',
2 {transition: 'slideup',
3 reverse: false});
Apperyio.getImagePath(name)
returns the URL of an image.
For example, say you uploaded an image and placed it on the page. You then set the component name on the page to page_logo. To get the image
URL, you would invoke the following:
1 Apperyio.getImagePath('page_logo');
It will return something like:
https://appery.io/app/views/3053226e-c948-4933-be2b-08d04e8e6b76/image/page_logo
Examples
Show/hide an element
If component1 is the component name, then to hide/show an element:
1 Apperyio('component1').hide();
2 Apperyio('component1').show();
Both hide() (http://api.jquery.com/hide/) and show() (http://api.jquery.com/show/) are standard functions.
If component1is a component ID:
1 $('#component1').hide();
2 $('#component1').show();
Check if the element is visible
Every component has property in the panel:
(https://devcenter.appery.io/wp-content/uploads/2012/08/visible_tick.jpg)
When the property is unchecked there is a CSS rule for this element:
display:none
Here is how element visibility can be checked via JavaScript:
1
2
3
4
5
6
7
8
if (Apperyio('mobilebutton_10').css('display') == 'none')
{
console.log('Hidden');
}
else
{
console.log('Visible');
}
Launching the native dialer and SMS app
Its possible to open the dialer window with a pre-populated phone number. This method works for both native apps and mobile web.
Use the following code:
Android
window.open('tel:+37529XXXXXXX', '_system');
KWWSVGHYFHQWHUDSSHU\LRGRFXPHQWDWLRQMTPMDYDVFULSWDSL
-DYD6FULSW$3,_$SSHU\LR'HY&HQWHU
iOS
window.open('tel:+37529XXXXXXX', '_system')
It is also possible to open an SMS typing window with pre-populated message text and a phone number:
iOS
1 window.open(sms:+375292xxxxxx?body=Hello from Appery.io!, _system);
Start Developing
With Our Free Trial
(https://appery.io/account/signup)
Platform (https://appery.io/appbuilder/) Customers (https://appery.io/partners/) Partners (https://appery.io/partners/) Services (https://appery.io/services)
About Us (https://appery.io/about-us/)
2015 Appery, LLC. All rights reserved.
Privacy Statement (https://appery.io/privacy-statement/) & Terms of Use (https://appery.io/terms-of-use/)
(https://blog.appery.io/)
(https://facebook.com/apperyio)
(https://twitter.com/apperyio)
(https://youtube.com/apperyio)
(https://plus.google.com/u/0/104276681162289155352/)
(https://plancast.com/apperyio)
(mailto:support@appery.io)
[appery-feedback]
KWWSVGHYFHQWHUDSSHU\LRGRFXPHQWDWLRQMTPMDYDVFULSWDSL