How can i call phonegap functions in html
Im building a basic html application for mobile using jquery mobile and phonegap build. i have a button for closing the application in mobile. i got the code for closing the application. my code is function close_app(){ navigator.app.exitApp(); } I build my application with phonegap build . and tested it in my android phone but the code is not working for me. Can you tell me is it possible to use phonegap functions in build phonegap. if possible how can i do that?
Worklight 5.0.0.3 Realm Authentication problem
Hi, i have encountered a problem with jQuery Mobile (both 2.0 and 1.1) and the new authentication model of IBM WOrklight v5.0.0.3. I'm using a Worklight Realm to do authentication but if i include JQM, on startup is shown a SimpleDialogBox saying that my realm has too many implementors. Removing the inclusion of JQM it work normally. I contacted also IBM support and i'm waiting for someone that give me a workaround. Many hanks.
Computed font size is bigger than defined in CSS on the Asus Nexus 7
I have a problem with Asus Nexus 7. I posted a question on stackoverflow Computed font size is bigger than defined in CSS on the Asus Nexus 7 but no solution found. Can anyone help me?
How do i reposition a popup after i change its content?
Hi, I'm using JQM 1.2.0. I have a popup with a listview and a reload button. The popup is centered in the window. When the reload button in the popup is clicked, the listview content is being replaced and the new content might be wider/narrower or taller/shorter. For this reason i need the framework to recalculate the width/height and position of the popup in the screen. How do i do it? I don't see a method that the popup widget exposes for this. Thanks!
How can I get the page loading widget when using a dropdown navigation list?
I have the following code for a dropdown navigation menu to choose which page to go to next. This works great, but I don't get the page loading widgets with this method. Can I tweak this code to get that effect? Or is there a better way to do this? I have been searching around for hours and can't seem to find a solution for what I am trying to do! Thanks for any help or suggestions! Here is my code: <html> <head> <title>Links</title> <meta name="viewport" content="width=device-width, initial-scale=1">
all pages in one html ?
Hi All, I am trying to do a phonegap app. what is best practices for jqm ? keep all pages (data-role=page) in 1 html file and javascripts in one js file and traverse pages with $.mobile.changePage or keep all pages in separate html files and do a window.location.href ? in android window.location.href actualy opens a new activity which looks ugly. also window.location.href stops all transitions for me (though transition is not a must for me in this application !) I would appreciate the pundits telling
Fixed Toolbar & long listview
hey , I have poroblems with the fixed toolbar. first: if i use opera mobile mini or build in browser on android, the fixed toolbar is not realy fixed and the workaround not very works fine. second: this is the main problem! by scrolling on android with long listviews the fixed toolbar generates grafic misstaks on the listview. you can watch it under: www.menulib.com/buyer/start/index only on android, ios works very well
How to wait for a popup to close?
In jQuery Mobile 1.2.0 i'm using the new popup widget. $('#my_popup').popup('close'); $('#my_popup').popup('open'); I obviously want to wait until the the popup closes completely before i open it again. The close method does not provide a callback function option.
jquer slider on mobile
hey, i build jquery mobile page and i have very big problem.. When I use slider he is not respondiong i try with diferent values but nothing. . anaybody now where is the problem?? Thanks
How to reduce size of mobile web page in MVC 4
Currently i am using MVC 4 framework to create mobile web app, When i checked my default login page on W3C checker "http://validator.w3.org/mobile/check" its showing size of jQuery mobile css files as more than 147kb .These are the minified versions of those files.My total page size is thus above 160 kb.Is there a way to reduce my total page size furthur?
Frame for Prototype on Desktop
Hi. This is probably a strange question, but I was wondering if there was a way to put a frame of a phone around the jquerymobile for view on a desktop but when the screen is small enough taking the phone frame away using media queries? I am just making a conceptual prototype for a class and we need to be able to view and critique it within the phone frame on a projector from a desktop so everyone can critique at once, but also see it working on a phone and use the awesome functionality of jquerymobile
Odd popup close behaviour.
So immediately on my startpage i fire off a popup like this: $( '#startpage' ).live( 'pageshow',function() { $("#mypopup").popup("open"); }); Looks nice overlaying the startpage. But when i close it, it doesn´t go back to the page it is overlaying. It goes back one more page exiting my web root. Why is this happening? I´m using the following html code: <body> <div data-role="page" id="startpage"> <div data-role="popup" id="mypopup" data-theme="b" data-overlay-theme="a" data-shadow="false"
$.mobile.ChangePage in 'startpage' pageshow changes startpage?
On my apps startpage (Phonegap/Jquery) i use the following code: $( '#startpage' ).live( 'pageshow',function(event,ui) { if (impoShown === false) { $.mobile.changePage('imp/impo.html',{transition: 'none'}); } }); So when the app starts the impo.html is loaded if impoShown = false. The poblem is that when this page is loaded...i can´t back out of it using android back button. The app closes. Like the startpage (the apps startpage) was never loaded and impo.html is now
JQuery Mobile & Ajax load()
Hi! In my App i load a flip toggle switch via $( "#obj" ).load("index.php?blabla"): into my app. That works fine, but the loaded flip toggle switch looks like a normal <select>-Object. All ajax inserted elements does not look like jquerymobile, How can i change this? Thx
Chrome pc bold alignment
Hi, I wanted to raise the following issue with you. The following code looks fine on most browsers, but the alignment of the text is strange on the latest version of Chrome on a PC. ("Phone" is aligned under "Mr Smith", not under "Name".) It is fine on Chrome on a Mac, and on IE on a PC. <!DOCTYPE HTML> <html> <head> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
Dialog to show when a page first loads?
Is there a way to get a Dialog to show when a page first loads? I would like to ask the user a question when he/she first loads the page. I know how to use a button to show a dialog. i guess i could have the button that is hidden and then use jquery to click it onload but is there a better way? Thanks for your help
Use of ui-link-inherit class
What is the purpose and use of the ui-link-inherit class? I realize it's for internal use of buttons and lists, but it would help understanding what's going on in more detail.
loadPage not working
what i'm trying to do is just load a content from another file to a div, just like $.ajax using normal jquery. in my main page: <div data-role="page"> <button id="load" style="border: solid blue;">Click here to load</button> <div data-role="content" id="target"> <!-- ajax load here --> </div> </div> this is the html from another file: <div id="secondPage" style="border:solid red;"> <p>test</p> </div> and finally, the js: $("body").on("click", "#load", function () { $.mobile.loadPage("mobile/favorites",
How to pass content of <a> tag on form submit.
Hi Guys, I have many <a> tag like buttons with content date inside the form, when I do post how I will get the data who stored on the <a> tag? Example: <form id="formOs" action="jsOS.php" method="post" rel="external"> <a style="height:60px; line-height: 40px;" href="#" id="diaSelecionado" data-role="button" data-inline="false"> 19/11/2012 </a> </form>
data role="page" div height
Hello, i have application done with jquery mobile and i want to change page height from default. So far i have tried this (page divs id is mobilepage): <script type=\"text/javascript\"> $(document).ready(function(){ $('#mobilepage').height(100); //or this $('#mobilepage').css('height','350'); alert($('#mobilepage').height());//displays 728 })</script>";
button icons for jquery mobile would not be showing
Hei Does anyone know why the button icons for jquery mobile would not be showing in swatches panel? Any help much appreciated. dw cs6 v12 b5842 osx 10.8.2
Long list presentation
I did read all the posts titled long-list... and my question remains open: I have about 700 items in a list (displayed as checkboxes) from which the user can select multiple items. These selected check-boxes are automatically serialized in an ajax call to the server from a JQM single page. Instead of showing this long list, what are my other options from a design perspective or from a tactical angle? This is important for the mobile and of course the desktop version too.
Drag and drop in tablets
Hi! I am working on an existing drag and drop animation which uses the mouse to move. The animation is being done in Adobe Edge. The animation works fine in the browser (using the mouse for the drag and drop). I want to make the animation to work on tablets, therefore, I will need to use the events: touchstart, touchmove and touchend. I managed to make to symbols drag around on the stage. However, all the symbols gets dragged together as a bunch. Also, the reset button does not seem to work in
Drag and Drop in tablets
Hi! I am working on an existing drag and drop animation which uses the mouse to move. The animation is being done in Adobe Edge. The animation works fine in the browser (using the mouse for the drag and drop). I want to make the animation to work on tablets, therefore, I will need to use the events: touchstart, touchmove and touchend. I managed to make to symbols drag around on the stage. However, all the symbols gets dragged together as a bunch. Also, the reset button does not seem to work in
scroll up/down will fire swipeleft/right event?
Hi every, I met a problem, in my app I bind swipe event on my page and the page is a scrollable one, when I swipeleft/right it works find, but sometimes when I try to scrollup/down my page the swipe events fired as well(I'm sure I just scroll down/top and I only tested it in iPhone iOS5), I don't know why, any ideas?
Search Bar for separate UL
Hello, So let me explain the setup i'm shooting for, that way you understand the method to my madness. I have a page that allows the user to select different list items (options for Recent stores, Local stores, and All stores). When the user clicks on one of those list items, the page dynamically adds content to a different ul that is revealed on the page. And in that dynamically added ul, via the data-filter="true" the user can search that particular ul (whatever the user clicked, either recent,
JQM 1.2 Popup Positioning Problem on iPad in Home Screen ShortCut Mode
Popups introduced in jqm1.2 have positioning problems on iPad in Home Screen mode. Opening the same page in normal Safari has popups working fine. Looks like positioning calculations need to take into account for a different environment in this mode. Any ideas for workarounds? Note: You have to add the page concerned to your Home Screen and launch from the shortcut to see the issue
Home Page Size shrinks to sub-page size in a Single page app
I have a single page jqm app that uses Knockout to show one of 7 or so different pages within it. I wrap each data-role="page" with a knockout if: <!-- ko if: showEditPage() === true --> <!-- /ko --> Each page shows correctly until I switch to one that is shorter than the screen size. i.e. I navigate from Home Page to Short Page and back to Home. Then the Home page size matches the Short Page so the bottom of the page is cut off. I tried removing the ko commenting and just use jquery Hide/Show,
Popup-Close button not round
I have a popup-closebutton which is called with the class ui-btn-left but it hasn't got the stylish round form. What is wrong? Any idea? The html-code: <div data-role="popup" id="popupaktuell" data-transition="pop" data-overlay-theme="a" data-theme="d" data-corners="true"> <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-left"></a> Any help apreciated!
How to only send Ajax requests
Hey, I am working on a little mobile site for my own home-built home automation system. Essentially I'd like to have a bunch of listviews that, when tapped, send an Ajax request to a server and does not load in any data or create a new page. This is so I can send TV remote control commands, turns lights on and off, set AC, etc. Snippet of code of the listview: <li data-theme="c"> <a href="#page1" data-transition="slide" id="lightsOff">
Few little problems
I added to my page jQuery Mobile framework and I have a few problems.. The background color was changed to gray color. It adds to the text in my page a gray shadow. If i hover over a text in my page the mouse cursor is not changin the the text cursor for some reason..How can fix that?
button link jquery mobile not working
hi all Im new whit jquery mobile I have a php site whit mysql db now do I want use jquery mobile So I have make a index.php whit a menu its works nice, but my url is olso index.php and click I on welkom button than is the url index.php?id=1 and if I click on contact whit the url index.php?id=2 and so more. Now the problem is that if I wanna go to welkom than nothings happening. Sorry about my engels
Recursive dialog window and mystery error message
I'm training myself on jQueryMobile and using dialog windows for form submission The form itself is being submitting via AJAX and when there is a problem with the logon attempt the response kicks in an alert with the error message. While the submission technically works I'm running into three problems. The first is that when a user successfully logs on jQueryMobile itself flashes an error dialog momentarily and then proceeds as normal. The second being that when an error alert is kicked in, the alert
Very simple password function. HELP!
Hi everyone. I'm developing a staff phone directory app for my work with JQM. I'm using a nested listview that displays names and then when a name is clicked, the phone, mobile, and email address of an idividual is shown. The listview is 199 entries long and each entry has 3 sub links. This makes the listview very slow to load. I have tried looking into the lazyload widget but I feel it's beyond my skill level to implement it. Instead, what I would like to do is initially load a login screen
Getting "Resource failed to load" while redirecting from one page to another ??
index.html : <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Popup</title> <link rel="stylesheet" href="../css/jquery.mobile-1.2.0-alpha.1.css" /> <link rel="stylesheet" href="../css/jqm-docs.css"/> </head> <script> function tosubmit() { var JSONObject = { "response": { "auth": "N" } } ; var mytext = JSONObject.response.auth; // Storing the value above into localStorage
.on() not working in 'Page transition events'
I'm using JSDT and it shows that .live() is deprecated. so using .on() like $('#wow').on('pagebeforeshow',function(event){ alert("haha"); }); it didn't work (.live works well) but when using .on like $(this).on('pagebeforeshow',function(event){ alert("haha"); }); it works. so i'm using .live() now, but using .on some day. Thanks for taking a look and helping me out - any pointers appreciated. development environments are jquery.mobile-1.2.0, jquery-1.8.2 and chrome.
HTML5 datepicker not working on iOS/Android by using jQuery Mobile
Hi We are trying to implement HTML5 datepicker in our web application but its not working. We are also using backbone and jQuery Mobile in our project. What could be the issue? Is there any alternative to HTML5 datepicker.? Thanks.
Automatically populating a text field using AJAX
Hello, I'm coming up to speed with JQM but am a newbie with AJAX. What I'd like to do is dynamically populate a form's text field with data coming from a digital scale, refreshing every few seconds. When the form gets submitted, the currently displayed weight gets inserted into the database via standard form processing. The scales are on order and I've requested technical info, so I'll need to figure out some of the details when I have the hardware and specs. We will be using PHP on the server
JQuery Mobile Error Loading Page via Wicket BookmarkablePageLink
I am new to JQuery Mobile. I have an Apache Wicket-based application that I'd like to try JQuery Mobile on so it looks more pleasing on mobile devices. Unfortunately, I am getting "Error Loading Page" errors for all the page links, which I never had problems with before switching to JQuery Mobile. The root cause appears to be the URLs contained in the HTTP requests. I used JQuery Mobile 1.2.0, JQuery 1.8.0, Wicket 1.5.5, locally tested using jetty server 6.1.26 and FireFox 16.0. Here is the
full page width stretch for radio button
Hi Guys, I want to make the horizontal radio button to full width of the screen and I am referring http://jquerymobile.com/demos/1.1.1/docs/forms/radiobuttons/ and my code is below: <div> <fieldset data-role="controlgroup" data-type="horizontal"> <input type="radio" name="radio-choice-1" id="spent_money_1" value="choice-1" checked="checked" /> <label for="spent_money_1">Spent Some $</label> <input type="radio" name="radio-choice-1" id="made_money_1" value="choice-2"/> <label for="made_money_1">Made
Next Page