JQuery Mobile and page transitions in Apex - how do they go together?

Hi guys,
I started off on a jQuery Mobile project with APEX - although I am still quite new to both. I have done quite a bit of research, but I haven't found really anything substantial about how they go together.
Rather it appears to me, that both have their own way of dealing, that is to say recieving and sending data. Apex with normal http-requests, just a little AJAX on the side maybe, JQM almost only with AJAX.
So I am running into a lot of trouble, when I use functions like apex.redirect() or .submit(), the $mobile.changePage() mostly doesnt how I want. Page content often stays in the DOM with JQM unwanted, data are sometimes not refreshed properly, or when I close a popup box, an unwanted reload takes place. Events are not bound the usual way, etc. etc.
I certainly thoroughly have studied the JQM documentation, looked through many other tutorials and blogs, but basically I still lack in a lot of basic understanding, especially the communication between JQM and APEX - after all, the APEX Smart Phone UI from 4.2 is still quite new. And all tutorials about data management with JQM deal with JSON objects or XML - methods we can't get into due to time reasons.
I have two questions to the community:
A) Is it really recommendable to use a JQM framework with the "normal" page-show and page-submit events, that APEX delivers? Or if not recommendable, is it practical?
B) Maybe some experienced users here can hint me to some recourses that specifically deal with the issues I mentioned above: e.g. How does JQM handle the urls it gets, when you use the APEX javascript functions? What global JQM settings are recommendable when using APEX, or what object-parameters should you use in the $.mobile.changePage() call?
And one specific problem I just ran into: How does JQM treat Page-0 items? I use them for global application control, but for some strange reasons, they sometimes seem to be resettet.
So these are a lot of questions, but I don't seek detailed answers here, rather some general guidence and advise. Any help is most appreciated.
So long, with best regards,
tobi
Edited by: TobiP on 14.02.2013 13:41

I will up this thread one time - what I normally wont do. But if noone can give any hints here this would be a really bad sign.
I have kept on looking for those topics, but I still haven't found anything that goes into detail regarding APEX and JQM.
Also one last wierd situation I would like to relate, that just occured: I submit a page with apex.submit('CREATE'), the dml-processing takes place, there is an unconditional branch after the processing back to that page, so it should be reloaded and refreshed - but it doesn't. Instead when I open a select list (JQM popup style), then the page gets refreshed, and the popup wont close anymore. I have no explanation for this. I hope, anyone can give me any hints.
Thanks very much,
tobi

Similar Messages

Please add Image and Page Transition Effects/Widgets

Please add Image and Page Transition Effects/Widgets
Thanks
- Roland

Hello,
You can try the following:-
1) Add a composition widget.
2) Add text frames to the triggers to create first level of menu.
3) To the target of trigger in first level, add another composition widget.
4) The triggers of this new composition will be the next level of menu.
5) You need to set the 'Show target' value to 'On rollover'
Hope this helps.
Regards,
Neha

If my iphone require a passcode and i am in accident how can they find my contact

if my iphone require a passcode and i am in accident how can they find my contact

Print it out and keep it in your wallet? Seriously, I would not depend on any electronic device for such vital information. I keep a hard copy in my wallet with my license and other ID.
Or, make your own custom lock screen wallpaper with an emergency contact information - that way they can see it without knowing the lockcode.

HT6114 I have upgraded to OS X Mavericks and my MacBook keeps crashing and my numbers and pages programs will not open as they are being updated continuously.

I have upgraded to OS X Mavericks and my MacBook keeps crashing and my numbers and pages programs will not open as they are being updated continuously

The next time the crash happens, note the date and time the problem occurred, then go to Applications/Utilities/Console and copy the log starting at the time of the crash. Paste the log in a reply. Please do not use a screen shot as they can be hard to read. If there are repeated runs of the same messages, please post only one run. Be selective about what you post and don’t post huge amounts. Make sure there is no personal data visible. Information learned from Linc Davis.

I bought an iPhone from mobile and I can't hear people when they call me unless their on speaker do I have warranty for that

I bought an iPhone from mobile and I can't hear people when they call me unless their on speaker do I have warranty for that

You can check your warranty status by entering the iPhone serial number here:
https://selfsolve.apple.com/agreementWarrantyDynamic.do
Be sure to make an appointment at the Genius Bar before taking your iPhone in
as per deggie above.

Phonegap Build service for jquery mobile themed page not showing on mobile

I am trying to use jQuery mobile inside the Adobe Dreamweaver CC and then use phonegap build service to deploy the application to my phone. The issue here is that the Dreamweaver design panel is showing the jQuery Mobile UI but the application APK which is deployed over the phone does not.
Please find below the screenshot of Dreamweaver CC with design and code panel.
http://stackoverflow.com/questions/17334492/adobe-dreamweaver-cc-phonegap-build-service-is sue
Find below the entire index.html code:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jQuery Mobile Web App</title>
<link href="file:///Macintosh%20HD/Applications/Adobe%20Dreamweaver%20CC/Configuration/Third%20Party%20Source%20Code/jquery-mobile/jquery.mobile.theme-1.0.min.css" rel="stylesheet" type="text/css"/>
<link href="file:///Macintosh%20HD/Applications/Adobe%20Dreamweaver%20CC/Configuration/Third%20Party%20Source%20Code/jquery-mobile/jquery.mobile.structure-1.0.min.css" rel="stylesheet" type="text/css"/>
<link href="jQueryAssets/jquery.ui.core.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.theme.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.accordion.min.css" rel="stylesheet" type="text/css">
<script src="file:///Macintosh%20HD/Applications/Adobe%20Dreamweaver%20CC/Configuration/Third%20Party%20Source%20Code/jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="file:///Macintosh%20HD/Applications/Adobe%20Dreamweaver%20CC/Configuration/Third%20Party%20Source%20Code/jquery-mobile/jquery.mobile-1.0.min.js" type="text/javascript"></script>
<script src="jQueryAssets/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="jQueryAssets/jquery-ui-1.9.2.accordion.custom.min.js" type="text/javascript"></script>
</head>
<body>
<div data-role="page" id="page">
    <div data-role="header">
        <h1>Page One</h1>
    </div>
    <div data-role="content">
        <ul data-role="listview">
            <li><a href="#page2">Accenture</a></li>
            <li><a href="#page3">Digital</a></li>
            <li><a href="#page4">CASF RIA</a></li>
            <li><a href="#page5">Hybrid Applications using PhoneGap</a></li>
        </ul>
    </div>
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>
</div>
<div data-role="page" id="page2">
    <div data-role="header">
        <a href="#page"><label style="color:white; font-weight:bolder">BACK</label></a><h1>ACCENTURE Page</h1>
    </div>
    <div data-role="content">
      <div data-role="fieldcontain">
        <label for="selectmenu" class="select">Select Technology Areas:</label>
        <select name="selectmenu" id="selectmenu">
          <option value="option1">Digital</option>
          <option value="option2">Oracle</option>
          <option value="option3">Mobile</option>
        </select>
      </div>
      <div data-role="fieldcontain">
        <label for="slider">Value:</label>
        <input type="range" name="slider" id="slider" value="0" min="0" max="100" />
      </div>
      <div data-role="fieldcontain">
        <label for="flipswitch">Option:</label>
        <select name="flipswitch" id="flipswitch" data-role="slider">
          <option value="off">Off</option>
          <option value="on">On</option>
        </select>
      </div>
      <div data-role="collapsible-set">
        <div data-role="collapsible">
          <h3>Header</h3>
          <p>Content</p>
        </div>
        <div data-role="collapsible" data-collapsed="true">
          <h3>Header</h3>
          <p>Content</p>
        </div>
        <div data-role="collapsible" data-collapsed="true">
          <h3>Header</h3>
          <p>Content</p>
        </div>
      </div>
    </div>
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>
</div>
<div data-role="page" id="page3">
    <div data-role="header">
        <a href="#page"><label style="color:white; font-weight:bolder">BACK</label></a><h1>DIGITAL Page</h1>
    </div>
    <div data-role="content">
    <div id="Accordion1">
      <h3><a href="#">Section 1</a></h3>
      <div>
        <p>Content 1</p>
      </div>
      <h3><a href="#">Section 2</a></h3>
      <div>
        <p>Content 2</p>
      </div>
      <h3><a href="#">Section 3</a></h3>
      <div>
        <p>Content 3</p>
      </div>
    </div>
Content </div>
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>
</div>
<div data-role="page" id="page4">
    <div data-role="header">
        <a href="#page"><label style="color:white; font-weight:bolder">BACK</label></a><h1>CASF RIA</h1>
    </div>
    <div data-role="content">
      <ol data-role="listview" data-inset="true" data-split-icon="arrow-d">
        <li><a href="#">
          <h3>Page</h3>
          <p>Lorem ipsum</p>
          <span class="ui-li-count">1</span></a><a href="#">Default</a></li>
        <li><a href="#">
          <h3>Page</h3>
          <p>Lorem ipsum</p>
          <span class="ui-li-count">1</span></a><a href="#">Default</a></li>
        <li><a href="#">
          <h3>Page</h3>
          <p>Lorem ipsum</p>
          <span class="ui-li-count">1</span></a><a href="#">Default</a></li>
        <li><a href="#">
          <h3>Page</h3>
          <p>Lorem ipsum</p>
          <span class="ui-li-count">1</span></a><a href="#">Default</a></li>
        <li><a href="#">
          <h3>Page</h3>
          <p>Lorem ipsum</p>
          <span class="ui-li-count">1</span></a><a href="#">Default</a></li>
        <li><a href="#">
          <h3>Page</h3>
          <p>Lorem ipsum</p>
          <span class="ui-li-count">1</span></a><a href="#">Default</a></li>
        <li><a href="#">
          <h3>Page</h3>
          <p>Lorem ipsum</p>
          <span class="ui-li-count">1</span></a><a href="#">Default</a></li>
        <li><a href="#">
          <h3>Page</h3>
          <p>Lorem ipsum</p>
          <span class="ui-li-count">1</span></a><a href="#">Default</a></li>
        <li><a href="#">
          <h3>Page</h3>
          <p>Lorem ipsum</p>
          <span class="ui-li-count">1</span></a><a href="#">Default</a></li>
        <li><a href="#">
          <h3>Page</h3>
          <p>Lorem ipsum</p>
          <span class="ui-li-count">1</span></a><a href="#">Default</a></li>
      </ol>
Content </div>
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>
</div>
<div data-role="page" id="page5">
    <div data-role="header">
        <a href="#page"><label style="color:white; font-weight:bolder">BACK</label></a><h1>HYBRID APPLICATIONS using PhoneGap</h1>
    </div>
    <div data-role="content">
      <div data-role="fieldcontain">
        <label for="email">Email:</label>
        <input type="email" name="email" id="email" value="" />
      </div>
Content </div>
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>
</div>
<script type="text/javascript">
$(function() {
    $( "#Accordion1" ).accordion();
</script>
</body>
</html>
This is how it looks in device:
This is how it looks in the mobile devices:
Could anyone please help?

Try defining a site and then create the mobile themed page within that site and DW will copy all the assets relative to the site path and will not be as its in your current page.
<link href="file:///Macintosh%20HD/Applications/Adobe%20Dreamweaver%20CC/Configuration/Third%20Party%20Source%20Code/jquery-mobile/jquery.mobile.theme-1.0.min.css" rel="stylesheet" type="text/css"/>
<link href="file:///Macintosh%20HD/Applications/Adobe%20Dreamweaver%20CC/Configuration/Third%20Party%20Source%20Code/jquery-mobile/jquery.mobile.structure-1.0.min.css" rel="stylesheet" type="text/css"/>
HTH
--Bhawna

Count down to page transition...how?

On a self playing keynote presentation, I am pausing 4 seconds before each page transition to allow them to take in what is on the page. However, I do not want them to think the slide show is over. How do you put something on the slide to indicate there is another slide coming? I am thinking of a count down timer (4...3...2...1 next slide), but you cannot simply but that in as an element since the last element must play before the 4 second page transition starts.
Any ideas?
Thanks
Bob

At first I thought OP reads like an oxymoron. If I get what you are saying you need to do the transition manually not using the slide to slide transition then you can do 4,3,2,1; move an object from left to right or even use this little guy:
Depends on your chosen transition as to how acurately it can be replicated manually but there are lots of options. If you use Magic Move you could even continue to use a transition and move/dissolve/scale/rotate some objects and have others hold there position on screen.

I need to restrict printing but keep the Content Type and Page Extraction allowed. How do I keep both the content type and page extraction displaying allowed?

When I change the settings to allow for the content type and page extraction and save it, it shows allowed. When I close the pdf, reopen it, review the security properties, it shows the content type as allowed and the page extraction as disallowed. I need both to stay at allowed, how do make this happen?

The moment that you select not to allow any kind of change done to the file then pages extraction is automatically not allowed as well. There's no way around that.

Can I create Ebooks with voice over and page transition with Creative Cloud? Which product?

I have created little kids e-booklets with voice over in Powerpoint that I'd like to sell online. What I am missing is the slide transition effect on mobile and pads.
Powerpoint only allows this function in a presentation/show format, but this doesn't work when I download the booklets on my phone. Does Adobe Creative Cloud offer this feature for my ebooks?
Best regards,
Ingrid Heyerdahl

Hi Tommy,
Yes, you can create a site in Muse and publish it to business catalyst. It will be in trial mode and your client will be able to view the site over the web.
Cheers,
Aishvarya Raj Rastogi

FCP 7 and Motion 5, do you know if they work together?

If one wants to keep editing in FCP 7 but also wants to use Motion 5, do you know if they work together and can send things easily back and forth between the two like FCP 7 and Motion 4?
Also, does Motion 5 over write Motion 4? Thanks

On my system, all the old apps were indeed transferred to the new 'applications/Final Cut Studio' folder (including Color, Sountrack Pro, DVD Studio Pro and so on). It didn't say that so I missed it at first.
You may want to make backup copies on your mac before installing the new apps just to be on the safe side, though.
After installing the new versions, you can still use Motion 4, Compressor 3.5 and FCP 7 out of the backup folder.
Compressor 4 will work with mov files (both self contained and referenced) created from FCP 7. I haven't tried to send a timeline from FCP 7 to Compressor 4 yet but since so little has been changed in Compressor 4 I guess that will also work.
Anyway, you could always go back to Compressor 3.5 if needed.

Bank of scotland pages have lost the scroll bar and Page Down doesn't work either. they say it is a problem with Mozilla! So how do I navigate to the bottom of

The Bank say it is not a problem with their website but with the Browser. There is no way to access the bottom of the page so you can't pay bill online because you can't access the Pay button.

You may have switched on caret browsing.
*http://kb.mozillazine.org/accessibility.browsewithcaret
You can toggle caret browsing on/off by pressing F7 (Mac: fn + F7).
*Tools > Options > Advanced > General > Accessibility: [ ] "Always use the cursor keys to navigate within pages"
You can try these steps in case of issues with web pages:
You can reload web page(s) and bypass the cache to refresh possibly outdated or corrupted files.
*Hold down the Shift key and left-click the Reload button
*Press "Ctrl + F5" or press "Ctrl + Shift + R" (Windows,Linux)
*Press "Command + Shift + R" (Mac)
Clear the cache and cookies only from websites that cause problems.
"Clear the Cache":
*Firefox/Tools > Options > Advanced > Network > Cached Web Content: "Clear Now"
"Remove Cookies" from sites causing problems:
*Firefox/Tools > Options > Privacy > Cookies: "Show Cookies"
Start Firefox in <u>[[Safe Mode|Safe Mode]]</u> to check if one of the extensions (Firefox/Tools > Add-ons > Extensions) or if hardware acceleration is causing the problem (switch to the DEFAULT theme: Firefox/Tools > Add-ons > Appearance).
*Do NOT click the Reset button on the Safe Mode start window.
*https://support.mozilla.org/kb/Safe+Mode
*https://support.mozilla.org/kb/Troubleshooting+extensions+and+themes

ItemListemer and ActionListener...and others...how can they live together?

Hi,
I want to have a couple of DropDown Menus, some Buttons and some Checkboxes in the same class....How can I do that knowing that my class needs to implement ItemListener and ActionListener ?
I've tried something like:
"public class extends Applet implements ItemListener implements ActionListener"
but not surprisingly it doesn't work....
and what if on top of that I want a MouseListener, a WindowListener or God knows what else...?
Thanks in advance for your help...
Tom

You need to read the basics about Swing events.
For starters, you do not implement listeners in your Applet class. Instead, you add new listeners to specific components that you want to listen on. For example, if you need to perform certain actions when a JComboBox's selection changes, you would do something like:
my_combo.addActionListener( new ActionListener() {
    public void actionPerformed(ActionEvent e) {
        System.out.println("selection changed to: " + my_combo.getSelectedItem());
});And for buttons:
my_button.addActionListener( new ActionListener() {
    public void actionPerformed(ActionEvent e) {
        System.out.println("You clicked " + ((JButton) e.getSource()).getText() " button);
}MoustListener and other listeners can be similarily added. See JDK Documentation or Tutorials

ITunes Music and Movie Conversion...how do they do it?

How does iTunes convert their movies and music over to iTunes downloadable files? Do the music companies just hand CDs over for iTunes to convert, likewise with movie studios...do they hand over movies in a specific format and then iTunes converts them to MP4 or do the studios and/or music companies hand over their products already converted to MP4 for iTunes?

See Empty/corrupt iTunes library after upgrade/crash or
Recover your iTunes library from your iPod or iOS device.
tt2

Locked documents both in keynotes and pages. when I look attheir status they are not locked but when I try and save I get an error message saying the doc is locked.

has anyone else had the same issue?

Did you uninstall the Firefox 4.0 beta version ?
If you did then did you remove the personal data or otherwise removed to Firefox profile folder ?
Make sure that you still have a (default) Firefox profile folder.<br />
See http://kb.mozillazine.org/Recovering_a_missing_profile

Purchased an HP Photosmart 5520 all in one printer last year and a Macbook Pro in Jan. They worked together up to June. In Sept. when I tried to print wirelessly, it would not print. The laptop had been updated. Tried to update the printer via HP,couldn't

I have an HP Photosmart 5520 all in one printer and a MacBook Pro. Bought the MacBook Pro in Jan 2013 and the printer in Dec 2012. I was able to print to the wireless printer up until June 2013. In September, when I tried to use them together, I could not print. During the period between June and Sept., my laptop software was updated. I have tried to update the HP software on my laptop, but could not. What can I do to use this printer with my MacBook Pro? Please help!

The MacBook Pro is running at least 10.7.

JQuery Mobile and page transitions in Apex - how do they go together?

Similar Messages

Maybe you are looking for