Change global options doesn't work, loadingMessage
Hey, I'm doing this: $( document ).bind( "mobileinit", function () { $( function () { $.extend( $.mobile, { loadingMessage: "cargando", backBtnText: "Atras" } ); // $.mobile.loadingMessage = "cargando"; // $.mobile.backBtnText = "Atras"; } ); Doesn't work, still the "loading" text appears, why? is this a bug? I'm using jquery mobile alpha2. Thanks.
Problem with select element on site
Hi, I am testing a form with this mark up: <div data-role="fieldcontain"> <label for="select-choice-1" class="select">Choose shipping method:</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> When I select one of the options, the entire site
Should I use jQuery Mobile for new development?
Hello. I'm now looking for a solution for mobile web application development and jQuery mobile seems like a perfect fit. However, the issue of MobileSafari address bar dropping down between transitions is a major one. And considering the fact that it is present for quite a long time and no official fixes are suggested, I need your opinions: would that be a right decision to start an application development with jQuery Mobile right now? I'm okay with the fact that it is alpha, but not okay if the
how can i prevent jquerymobile from putting the ... too early on a list item
http://screencast.com/t/6hfPFurn If you look at this pic, you can see there is plenty of space left. Ideally, i'd like the text to run all the way to the right or even runover onto second line. Thank you, TF
Back button will return user to a page even if page has been removed from dom
I have a simple CRUD type app written in Jquery Mobile. In order to prevent caching of the page that contains a list of all the "items", I delete the page from the DOM when the page changes. Unfortunately, when a user clicks "back" to return to the page they just left it will display a blank page rather than request the page again. I need either an alternate way to prevent caching of that page, or a way to ensure that the back button won't send the user to a non-existant page. Thanks in advance!
Microsoft .NET chart controls on mobile
I am using Microsoft .NET chart controls to render some bar graphs. how do i display the charts so that they are mobile optimized ? I am using JQM libraries for presentation and C#.NET for backend. Please advice. <div id="dvTabContainer" style=" margin:0px 0px 0px 0px;" > <cc1:TabContainer ID="TabContainer1" runat="server" OnActiveTabChanged="ChangeTab" AutoPostBack="true" Width="750px" ActiveTabIndex="0" > <cc1:TabPanel ID="tab1"
Any page with a select using data-native-menu=false modifies the page title with the placeholder option text.
Example: jQuery Mobile's own documentation page: http://jquerymobile.com/demos/1.0a4.1/docs/forms/forms-selects.html As you can see, the <title> now contains "Choose one..." several times, once for each select using data-native-menu="false" that has placeholder options. Any ideas on how to fix this?
navbar renders incorrectly when linking between two different layouts
I have two layouts. One layout has a footer navbar with 4 buttons. The second layout has a footer navbar with 3 buttons. Both navbars use custom images. Attached are the two navbars. When following a link that takes you from one layout to the other, the footer navbar gets rendered incorrectly. See attached. I am using the default true value of ajaxEnabled. If I set ajaxEnabled to false, the rendering problem goes away.
how do you specify a sub page using $.mobile.changePage("page2.html")
hi, I am wondering if there is a way to specify which specific page div to load when using changePage to navigate to a different html page. For example, I have 2 html pages in my app. My program starts with page1.html. page2.html contains 2 jquery mobile pages. <div data-role="page" id="html2page1" ... </div> <div data-role="page" id="html2page2" ... </div> I want to be able to call $.mobile.changePage("page2.html#html2page2") from page1.html but it doesn't work. And $.mobile.changePage("page2.html")
jQuery Mobile doing ajax request for inline pages when passing parameters
For developing a web application I am using jQuery Mobile. However, I recently ran into a problem when having multiple pages in a single HTML-file and trying to link to them: <div data-role="page" id="first"> <div data-role="header"> <h1>First</h1> </div> <div data-role="content"> Content of first page </div> <div data-role="footer" data-id="footer"> <div data-role="navbar"> <ul> <li><a href="#first?foo=bar" class="ui-btn-active">First</a></li>
CompareAttribute of ASP.NET MVC 3.0
Hello All, I am using MVC-3.0. I need to compare 2 model values for equality like password, confirm password. So, I used the CompareAttribute. I am also using jQuery 1.5 library. When the model values are compared(I am using CompareAttribute) and if the values are not same the CompareAttribute pops an error message in to the UI. Now the problem is even if I clear and provide same values after I get the error message, the message is not cleared from the screen. The code still smells filth in the values
Windows Phone 7, Local, internal linked "pages" not working if page has select menus
I am using JQuery mobile in a Windows Phone 7 project. The internal link pages in my app would not work in the phone browser, but will work in any other browser. To debug the issue, I tested the 2 page example given in the local internal linked pages of JQuery Mobile doc. Then in the second page I added the code from the form elements select menus example. Then the internal page linking does not work. When I remove the select menu code the internal linking works. I need these Select menus for
Custom button properties
hello Gurus. I am a newbie to jquery and I learning it. ofcoz, it looks wonderful and my interest in it is building day by day. I am creating a sample page and i have got few buttons in it. They all have different sizes, colors, and positions. I know it can be done through a custom css. but i really cant figure out how would i relate the button to those custom css. The question might be too silly, but i am quite stuck in this. Please help me :)
Change Checkbox Label Text
I am trying to change the label of a checkbox. The detail is I am detecting the browser screen size and making the label more descriptive if there is room to display. On small devices the label is trunctated. The code that I tried. $('#CheckboxTrackingLabel').html('Track'); The checkbox does not seem to display if the html of the label is changed in script. It switches to just a label if the code is called. What do I need to do to get it to remake the checkbox after the label text is changed?
.ui-btn-active{} removed on navbar alpha 4
In the docs - http://jquerymobile.com/demos/1.0a4.1/#docs/toolbars/docs-navbar.html the navbar holds the active state of a button when pressed. All the links on the docs page have href="#" When i try to do the same thing but put href="Javascript:myFunction():" then even if myFunction() does nothing, the active state is removed from the clicked button. I saw there was an issue with alpha 3 where the selected state was not being maintained but this seems to be happening with alpha 4.1 Has anyone used
Disable all page state persistence in jQuery Mobile
Hello, Is there a way to disable page state persistence in jQuery mobile? Basically, I don't want pages to jump to the last-viewed location when I navigate back-n-forth. I don't want any collapsibles to maintain their state between page transitions either. I want every page call to act as if that is the first page call. However, I DO want the location to be maintained with hashes. Do I have to change $.mobile.changePage() or is there a flag that can be set somewhere to disable this behavior? Thank
Persistent footer navigation - is there a way to keep it visible always?
I'm using alpha 3. The navigation is working great thus far, but I'd really like to not have it disappear and re-appear like it currently does on scrolling. Instead, it would be great if it can stay fixed like it is on the iphone native UI.
Gracefully degrade to JS-only site in sub-A-grade browsers?
Firstly, I love jQuery Mobile. Secondly, sorry if this question has been asked before, but I couldn't find it if so! I would like to use jQuery Mobile *only* in A-grade browsers, and degrade gracefully to a JavaScript-only site in other browsers. In other words, not load the jQuery Mobile CSS or JS at all in other browsers. What is the recommended way to achieve this? Bonus points for actual code :) Thanks.
A4.1 : IE7 taking 100% CPU
Hi All, I want to migrate from a3 to a4 to provide support for IE and wp7. It is described somewhere in Release notes of 4.1 that says, "An error was causing jQuery Mobile to fail in IE8 & 9, but we’ve resolved the error by adding an activeElement conditional and pages now render suprisingly well. There are a few style tweaks needed to make this perfect, especially on form elements, but jQuery Mobile now works in IE 7, 8 and 9." However a4.1 demo site works well in IE7 , I'm having the issue with
turn off ajax for a particular link
Is it possible to turn off ajax transitioning for a particular link only? For now, I'm turning off ajax globally using $.mobile.ajaxEnabled
a4: data-title attribute not working
Per the release notes of Auto-updating page titles for Ajax navigation, there's a new attribute that should one to manually define a title. Either the attribute doesn't work, or I am missing something obvious. Also, I tried the attribute on different spots, just to verify. Correct me if I am wrong, but it should go with the DIV that has the data-role="page" attribute. What am I missing to have the data-title attribute work correctly? <!DOCTYPE html> <html> <head> <title>Page Title 0</title> <link
History.js in jQM
Is there an existing plugin for jQM that uses History.js as the navigation model? Or is it in the roadmap for jQM core (or some other support for HTML5's History API)?
"thisUrl is undefined" || "X is undefined" FIX
~ LINE 2551 : ORIGINAL: //rewrite src and href attrs to use a base url if( !$.support.dynamicBaseTag ){ var newPath = path.get( fileUrl ); to.find( "[src], link[href], a[rel='external'], :jqmData(ajax='false'), a[target]" ).each(function(){ var thisAttr = $(this).is('[href]') ? 'href' : 'src', thisUrl = $(this).attr(thisAttr); //if full path exists and is same, chop it - helps IE out thisUrl = thisUrl.replace( location.protocol +
jQuery Mobile and Zoomooz
I am trying to use zoomooz and jquery mobile together but it isn't quite working. Thought I'd see if anyone out there has tried and succeeded or has got some traction. It seems to me to be something with the url management (hash tag)??? Any one have any ideas why they wouldn't work together? Any help would be so appreciated! Cheers
changing text works, except for buttons
have a simple form. pretty much copy paste from the documentations. I can change the text of any element on the page, except my buttons. $('label:first').text('asdf') [ <label for="user" class="ui-input-text">asdf</label>] $('button:first').text('asdf') [ <button name="action" id="btnLogin" value="login" type="submit" data-theme="b" class="ui-btn-hidden" aria-disabled="false">asdf</button>] The above code is from my chrome javascript console. it does return the button object with the
tap event causing page load when returning false from function
Hi, I have an unordered list like so: <ul class="std"> <li><a href="pathtolargerimage"><img src="pathtosmallerimage" /></a></li> <li><a href="pathtolargerimage"><img src="pathtosmallerimage" /></a></li> </ul> I am using the tap event to display the larger image in a placement holder on the page The problem is that very often, I am receiving "page loading" which is not the expected or desired outcome of this code... have tried using $.mobile.pageLoading( true ) to suppress loading, but to no avail.
Bad tap behavior on form select
I am building a Rails 3.03 application using jQuery Mobile 1.0a3 to render mobile views. I look at it in Safari on an old 1st-generation iPhone. I have a collection_select in one of the forms. This renders a touchable control that looks like a button, which opens a pop-up select element with the list, so the user can select the option/value. So far, so good. The problem… If I tap the rendered button with just a quick tap, the select list will pop-up then immediately disappear (with no option/value
jqMobile 1.0a4: slider not updating properly
Hi, To reproduce: go here and click on "Settings". See the slider at the top. Click the little up/down arrow buttons. The number to the left of the arrows changes. Expected result: the slider knob on the right should also move, in sync with the numbers. Actual result: the slider knob does not move. Consequence: the slider knob is out of sync with the numbers. Note that the slider knob does move if you use the up/down arrow keys. It is the arrow buttons that fail to update the knob position. Using
The layout collapses when returning from the dialog.
When coming back from the dialog, the main page's layout collapses. Some DOMs of the main page is created dynamically(the dialog is created statically). Please tell me how to deal with this. (Or is this a bug of jQuery Mobile ?)
Cannot remove back button
Is it possible to remove / hide the back button of a list page that is nested inside of a listview? I have a page with a <ul data-role='listview'>. Each item in the list view has a nested list, which results in a new page when the user selects an item from the first page. While I can disable the back button from the first page by using the data-backbtn='false' tag, how do I remove the back button from the child form? As an alternative, I could disable the title bar from the child form, but I can't
Can't get layouts switched by rotation in iOS Simulator
Hello, I'm making my first try in developing an iPad App with JQuery Mobile 1.0a4.1 and Phonegap. It all goes fine so far, but I can't get my layouts "switched" on rotation in iOS Simulator. If I try my page with different window widths / heights simply in Chrome on desktop - it's all fine, "body" is getting classes "landscape" or "portrait" and styles are changing accordingly to them, as I wrote in theme. But in iOS Simulator (compiled) - this trick doesn't work anymore... May be there are some
Datepicker as a popup
Hello, how do i open the datepicker as popup?
Navigation with external link
Hi I've just started using jQuery Mobile so sorry if this is a simple answer! I've got my basic page done and when I link to other pages in the same domain I can get the header bar working with a back button, e.g. <div data-role="header"> <h1>Page Title</h1> </div>However I also want to link to an external page but it always takes up the whole screen. Therefore is it possible to link to an external page but also have a header bar with a back button and if so how? Thanks
Address Bar Not Hiding - Alpha 4 Safari iPhone
I've noticed that in Alpha 4 the address bar on safari iPhone is no longer hiding like it did in the previous Alpha 3 release. Is a new configuration setting required to force this behavior now or is this a bug?
jqmobile 1.0a4 - styling problem
upgrading from 1.0_a2 to 1.0a4 got me some styling problems. For example: the icon of the "ui-btn-left" sits too far on the left, reaching out of the button and getting cut off. I just wanted to ask if this is a known bug, if there is a fix, or if somebody else expierienced this. thx gbye
UI Broke after upgrade
Hi, I was using Alpha 2 for my jQuery Mobile app. The UI was perfect. When I upgraded to Alpha 4, some icons are missing. Please refer attached image file for reference. Any idea, why this is happening and any solution for this?
Bug with back button
Hello, I use Jquery for my mobile website, I have a problem with the back button, display don't work like you can see on this screen: http://s3.noelshack.com/old/up/retour_menu-96eb8f3416.png My menu is like this: <ul data-role="listview" data-inset="true" class="ui-listview ui-listview-inset ui-corner-all ui-shadow"> <li data-role="list-divider" role="heading" tabindex="0" class="ui-li ui-li-divider ui-btn ui-bar-b ui-corner-top">News</li> <li role="option" tabindex="-1" class="ui-li ui-btn ui-btn-icon-right
update content instead of page
since the header and footer are the same in my whole project i want to only update the <div data-role="content">, but i have no idea how to do this. Do i need to hack in the jQueryMobile script (and if, where?) or is this possible otherwise? thanks in advance
Really long listview = Blank page on iPhone
I set up an example page here: http://jsbin.com/opavi5/3 On any desktop browser, the page displays properly. But on iPhone4, it is just a blank page. If I shorten the list, the page displays fine on iPhone. It also displays fine on Android phones. If I change the script references to alpha 3, the page displays fine on the iPhone. So some change has broken long lists with the iPhone, but I have no idea where the problem is. Edit: Also, as a sidenote. This is a very simple list. So I had to make it
A smarter list filter
Hello, just wondering how difficult it would be to have the list filter behave like this : - when I search for : foo bar, it first filters out items not containing "foo", then items not containing "bar" - when I search for "foo bar", it filters out items not containing "foo bar" with a space between them. Currently, unless I missed something, the second case applies (well in fact not true cause quotes are searched in list items) Thanks.
Next Page