jQuery Mobile SplitView not working correctly on iPad with Phonegap
Hello, I tried using the example of the jQuery Mobile SplitView in a Phonegap application. http://asyraf9.github.com/jquery-mobile/ When i start the application in window mode it works correctly with no left column. If i switch to landscape it still works, the left column appears. Then i i switch back to window mode the left column won't disappear. Anyone knows a solution?
how to open a popup menu (with a taphold)
Hi In many apps tapholding an item opens a popup menu. I need this functionality too. So far I could not find out how to do this in jquery mobile. This is my state of knowledge: $('.aBunchOfTapholds').bind('taphold', function(e){ var elem = $(this); //get's tapped object // now open a popup menu. How? }); I've seen dialogs. But it seems that they always fill the width of the page. Is it possible to set the width of a dialog?
ScrollTo in scrollview
Hi, For realization of photogallery I fill via javascript a div (data-scroll="y") with inage filled images. On click on a marker in a google map I want to jump to the related image. var seekPanoGallery = function(ndx) { var elem = $('#page_panoramioimage div[data-role="content"] .inner'); var h = $('#page div[data-role="content"]').height()-$('#page div[data-role="header"]').height(); var offset = -ndx*h; elem.css('-webkit-transform','translate3d(0px,'+offset+'px, 0px)') } It works
JQM (jQueryMobile) Dynamically removing elements
This is part 2 of this question (ok maybe part 3) Here is a working example: http://jsfiddle.net/UcrD8/63/ Here is a earlier attempt and as you can see this works when selecting the first option: http://jsfiddle.net/UcrD8/4/ But using JQM it uses this as a label for the options and it is not selectable The functionality to add a new select option is working but if I wanted to remove a selected option, this is not working. StackOverFlow: http://stackoverflow.com/questions/5392402/jqm-jquerymobile-dynamically-removing-elements
Breaks Rails Omniauth
When I implemented jQuery Mobile my OmniAuth twitter authentication broke. I am getting a general error when I try to hit my /auth/twitter controller and it never directs to twitter. If I comment out the jQuery mobile script source tag it works. Has anyone else run into this problem?
How to disable scroll on page?
Hi, First post here - so please behave! ;) I'm developing a web app using jquery mobile and I've added an installation "mode" when starting the app from Safari to force the user to place it among the other apps. Started as an app I use the full screen of the app and it all looks nice but the page is still scrollable. I'd like it to be fixed to get more of a real app feel of it (just like http://iphone.atg.se). Any clues on how to? Thx, VTM
Cannot get simple dialog to work
I cannot get this simple dialog to display as a dialog. When clicking the link, I'm taken to a page, but the page is not in a dialog. Does anyone know how to resolve this? <!DOCTYPE html> <html> <head> <title>Open Dialog Test</title> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" /> <script src="http://code.jquery.com/jquery-1.4.4.min.js"></script> <script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script> </head>
[jquery mobile] listview accordion Plugin to use with list-divider role optional
jquery mobile listview accordion Plugin 1. import these file <script type="text/javascript" src="js/ext/jquery.mobile.listview.accordion.js"></script> <link rel="stylesheet" href="js/ext/jquery.mobile.listview.accordion.css"/> 2.Format the accordion accordingly <ul data-role="listview" id="listView"> <li data-role="list-divider" class="ui-li-accordion-head">Title name</li> <li> <div class="ui-li-accordion"> <li>contents1</li> <li>contents2</li> <li>contents3</li>
Parenthesis in URL leads to javascript errors in Firefox
Hullo If using URLs containing parenthesis in Mozilla Firefox, there is a problem with the location.hash. The handling of URLs with parenthesis for example when hitting the back or forward button leads to Syntax Errors in Firefox JavaScript Engine: uncaught exception: Syntax error, unrecognized expression: data-url='...(...' The Exception is thrown by Sizzle. This error is thrown at serveral positions in jQuery Mobile code, for example: to = $( ":jqmData(url='" + url + "')" ); "jquery.mobile.navigation.js"
Loading javascript on every 'page' load
This seems like a basic thing, but how can I run some javascript on every "page" load? Let's just start with integrating web analytics (I use GetClicky) on every page. I've found several posts where people have created hacks to work around the way jQuery Mobile loads pages, but this seems like a no-brainer that will need to be (easily) supported. Or am I missing something? After that, I'd like to figure out how to make jQuery work with Adsense because that's also a challenge right now without some
Poor fieldset/option performance on devices?
It works fine in chrome/safari on the desktop, but I load it on the iPad and the performance is poor. Embedding it in a phonegap app makes it worse. It usually takes half a second between tap and the selection change in Mobile Safari and 1.0-1.5 seconds inside a phonegap application. Is there anything that can be done to improve tap response time? Sample test: http://jsfiddle.net/siromega/cAn9m/3/ Test platform: iPad (2010)
How do I realize master-details relationship in JQuery mobile?
How do I realize master-details relationship in JQuery mobile? Let's say I have a news page with a list of the news titles and the corresponding links to the detail pages (with all the detail data). In php I pass the ID via a URL parameter from the master page and on the detail page I filter the database table with this URL parameter to select the correct data. How is that done in JQueryMobile? Do I simply call the detail php pages as external links? Or do I have to create a json file with nested
Refresh page like refreshing listviews
Ist there a possibility to refresh a page like a listview e.g. this.custom_list.listview("refresh") i tried this.pageDome.page("refresh") but is causing errors. Is there anybody knowing a possible way to do this. The background of this problem is, i enlarge my listview and after that the buttons disapear. after clicking on the page they apear like they used to. Greetings Johannes
.listview('refresh') and thumbnails
I have a script which uses ajax to add to a list. When I use .listview('refresh') the main styling refreshes but thumbnails don't seem to get styled properly. Is there something I need to add to the code?
Alternative icon set
A few weeks ago I thought I saw a recommendation for another set of royalty free icons to supplement the set used by jQuerymobile. It was a set of about 20 or so. Can you point me to that set?
The content div's attributes
Hi guys, I'm having a page life-cycle problem, I'm trying to create a "shadow" div which will cover the entire content (a UI tweak, sounds stupid but well, that's my job) and naturally I'm doing it on pagebeforeshow, in order for it to get the right positions I use the content div's top and left att. my problem is, there's a header, and on pagebeforeshow the content div's attributes are not correct, they both return 0 where the top attribute should return 54 (and it does, but only on pageshow), what
Make a fixe header and a fixe footer
Hello : When I use JQM, I see that all my pages have the same header and footer... My question is : can I make a structure which has a fixe header, fixe footer and many pages in middle ? I'm French, my english is very bad... So the structure I want make is : My exemple : <div data-role:'header'>...............</div> <div data-role:'page' data-id='page1'> </div> <div data-role:'page' data-id='page2'> </div> <div data-role:'footer'>...............</div> I think it's a very good idea !!! No ?
Screen Flash
Hello, Something odd is happening. After I click an option, not using rel='external', when I click any other link I get a quick screen flash after the transition. I have tried everything I know to eliminate it, narrow it down to no avail. It does not happen 100% of the time but it is just annoying when it does. Can anyone help me eliminate this flash? Thanks
code.jquery.com and caching directives
I noticed when I pulled jquery mobile from code.jquery.com the response came back without any caching directives: ttp://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js HTTP/1.1 200 OK Accept-Ranges: bytes Content-Encoding: gzip Content-Type: application/x-javascript; charset=utf-8 Date: Sat, 09 Apr 2011 05:28:29 GMT Etag: "a1b9fae-f03d-77aa6880+gzip" Last-Modified: Thu, 07 Apr 2011 21:05:22 GMT Server: ECS (ord/57DD) Vary: Accept-Encoding X-Cache: HIT Content-Length: 19240 When I pull
Avoiding Flash of Unstyled Content (FOUC)
I'm trying to progressively enhance a web application I'm developing. Similar to jQuery Mobile, the UI is defined using data attributes (<div data-role="page"/>) that JS then applies classes to. The problem is I'm getting the FOUC on page load and I haven't figured out a way around it yet. jQuery Mobile seems to have sorted out this issue. I've been searching through the jQuery Mobile source code, but so far I haven't found my answer. Currently, my page looks like this... <!doctype html> <html lang="en"
jQuery Mobile and Wicket?
Does anyone have experience with jQuery Mobile and Wicket? I am getting some results with it but everything is not working as I need. If this is just a bad idea, please let me know. One problem is I am losing the mobile styling when I update the model for a component. Another is I am not able to override the link onClick() without having the <div>-based page URL get mangled with wicket stuff.
Native looking web application or empowered web pages?
Hi, my question targets the goal of jquery mobile: JQuery is mostly a simplification for web pages to add rich client functionality. Will applications based on jquery mobile be web pages that use some widgets of jquery mobile? Or is the objective to create really native looking web applications? I.e. browser elements are hidden, multi touch will be supported in the future etc. The background: I am currently looking for an opportunity to develop apps for mobile devices. But I don't want to develop
Different default behaviour on form submits
Hi When a form gets submitted jqm will ajax post the data and change the page url hash. Changing the page url hash is somehow uncomfortable for CRUD apps. Starting updating or creating database entries is more like a self-contained process. I like to hit submit several times, type in values, getting errors, type in better values submitting again and so on until i get a success page at last. Over the hole process i expect the back button pointing to the entry point of the hole update process. I think
Server Side list search / filter
Hi all, Does anyone have a good solution for doing a jquery mobile search filter (ie. a list with data-filter="true") without sending all the list elements to the client? We could potentially have 10,000 list items... Thanks in advance!
How to prevent text cut off?
I could really really use some help on this. http://www.flying-pig-productions.com/jq/jqueryTest/corn11.html Click on any pest to see a list of pesticides. Why does the <li> not expand for the data as a default? What style can I add to that <li> so the text isn't cut off. This is a read-only list. Some folks say lists are only for navigation, but the jquerymobile documentation itself shows read-only lists. Any advice is appreciated. Thanks, -Carol
Image map and page links
Hi, is it possible to use an image map instead of a listview and link to a data-role="page" and get the back button and transitions? Right now I use this area tag: <area shape="rect" alt="" title="" coords="6,9,124,264" ref="index.html#myPage"/> It links to the correct page, but I don't get the back button. I have to include index.html to get the link to work, even though the data-role="page" is in the same file.
How to customize the slider of jquery-mobile?
Dear all, I have a question on how to customize the slider in jquery-mobile. The default configuration puts a text box containing integers in front of the slider, which I wish to remove, or at least customize, so that it can display some other messages depending on the current value of the slider. However, I didn't find out how this can be done. Thank you very much. - Dawei
About the image encode/decode doubts
hi all same as the topic, is there any function or example handling image encoding and decoding in jqm? what i had try: 1. create image object and link the src to url source; 2. get the base64 data from image; 3. and link the src to the base64 data again to any element in need. but it seems not work... any ideas? thanks kenneth
jQuery Mobile not working with Symbian^3 browser in Nokia N8.
I am using a Nokia N8 with Symbian^3 which is supposed to have A grade support for jQuery Mobile. However, when I try to watch the jQuery Mobile demo website in it to test for support, it doesn't work and I see this. Is the Symbian^3 browser supported yet with jQuery Mobile Alpha 4.1? Symbian devices still hold a lot of market share to overlook support. ______________________________________________________ Saurav Srivastava Designer at SlideShare Twitter: gx_saurav Blog: http://gxsaurav.com
Ajax Nav changing charset!?
Hello all! I have an html page with meta charset defined to windows-1252 to avoid accent problems. It works fine when page is loaded with non ajax nav (rel=external). But when i use JQM ajax nav, all accents are f**** up... I tried to put the same charset in the entire website but it changes nothing. Tested in firefox and bb5. Works fine with Chrome. EDIT: Seems to be a $.Ajax encoding problem...
Inserting a <script src> header tag in subsequent JQM pages
Hi all, I've been working with jQuery Mobile for a month now and am really liking it. One thing I have not been able to figure out: how can I add a new javascript resource file (<script src="x.js">) in a web page *after* the initial page loads? I'm running different ad networks, Google Maps API, and my own JS and I don't want the whole shebang to have to load on the first page, especially since I don't need many of them right away. Can anyone help? Thanks! Pete
Making read-only list elements consistent with clickable ones?
I'm often presenting a list in which some elements are clickable options, and some are not. (I want to present the same list each time, but in some cases, a particular option is not available.) That used to work pretty well, the lines would all look about the same, but if an entry had no link, it would not get an icon, and not be clickable. But now the entry styling is applied only to li's that have a link. Other li's are left completely bare - they just get theme styling. Unfortunately, an "active
Status of JQuery Mobile support for Blackberry Version 5
Hi, I am one of the few developers facing a task right now using jquery mobile framework as a development tool for mobile applications. I praise its very revolutionary avenue it has created and hope that a lot can be done Earlier I had inquired about the support of jquerymobile with Blackberry mobile phones using version 5 O.S. While the framework has been tested on version 5 its functioning has been very dismal making it not a good tool at the moment. I was told that support for the version would
Dynamic Nested List
I'm making a nested list except the <ul></ul> of the next "page" needs to be filled by an ajax request. However, when I fill in the <ul> with list items (<li>), they don't appear as list items after the page transition. Any suggestions on having the <ul> filled after the page transition or does anybody have any sample code filling in nested list items with ajax calls to external xml? Thanks, Doc
Disqus comments with Jquery Mobile
Hi all, I am currently quoting a project for a video blog with wordpress jquery mobile,and I have little doubt that the integration of Jquery Mobile with Disqus comments,some of you have done before this integration? I would like to know your ideas and expectations about this development and I find very interesting and I'm really excited, so I can see Disqus using jquery, ajax and php as programming language which I think there should be no problems with integration. I welcome your comments. Greetings
Zooming problem with form input
Hi, I'm having problem on forms input. When focusing an input text, iphone zoom the page in but it doesn't zoom out when finished... And from time to time it zoom the page view on links too ! How could I manipulate zoom factor in scripts, is it possible ? After reading the jquery js (jquery.mobile-1.0a3) I still can't figure out how to do... I've found this script but it doesn't works for me : jQuery("input[type=text],textarea").mouseover(zoomDisable).mousedown(zoomEnable); function zoomDisable(){
How to show dialog?
Hi, I want to show a dialog using a certain method or call and not using an <a href ... /> how can i do this?
Drag to Re-order List?
Anyone have any thoughts on how to implement drag and drop to resort a jQuery Mobile listView? (perhaps similar to how webOS does it: click and hold, then drag to reorder) Is this something jQuery mobile plans to implement?
BlackBerry OS 6 input value duplicates on orientation change
I don't see this issue in the forum and am not able to test on the jquery mobile demo page, as my test phones don't have outside access to the internet. This is only happening on the BlackBerry Torch (OS 6) that I know of. If you enter a value into a text input and leave the keypad active and change the orientation, the value you just entered in the field duplicates. It duplicates the whole value. So, if you change the orientation again, it quadruplicates the value. This does not happen when the
jquery-mobile slider does not support "step" attribute
Are there any plans to support the "step" attribute for the slider control? For example, to record swimming pool water pH, I want a slider that goes from 6.0 to 9.0, with steps of 0.1. The min and max attributes are supported, but the jquery-mobile code is using a percentage scale from 0 to 100, and ignores the "step" attribute. Also, the number in the accompanying text box only uses integers.
Next Page