how to cache page when going away from it and not cache when return from it
For now, I am using jQuery mobile version 1.3.2. According to the documentation, making a page data-dom-cache will make the dom bigger and bigger, so I am trying to avoid doing it as much as possible. But to me, it makes sense to cache a page if going to another page, but not cache it when returning to a previous page. For example, moving form page1 to page2 to page3. When a user moves from page2 to page3, i would like to cache page2 so when the user goes back to page2, he is at the same point when
How to change header of collapsible in 1.4.0
I need to change the header of a collapsible. This is my JSFiddle: http://jsfiddle.net/rCFzP/2/ Somehow the icon dissapears. How can I get the icon back? Thanks, H
jQuery Mobile slider widget deprecation
I understand that the jQuery Mobile slider widget is deprecated. What is the recommended alternative if one's application is slider-based? David D.
1.4 Custom transitions not working
Hey there, Up until 1.4 I've been defining custom transitions as explained in this stack overflow post: http://stackoverflow.com/questions/20806208/has-no-method-transition-error-with-a-custom-transition-setup-on-jqm-1-4-0/20807365?noredirect=1#comment31214747_20807365 I upgraded to 1.4 recently and now my projects transitions have gone tits up. Being an intermediately skilled programmer at best, considering the answer I got on stack overflow this is what I've gotten so far in trying to rebuild
jQuery.mobile.changePage problem, version 1.3.2
I have a strange problem with jQuery.mobile.changePage. Here is an example. i have a function which creates a page dynamically and put contents on it, then use jQuery.mobile.changePage to show it. let's say the function is called function createPage() { var pageid="dpage"; // here is some code to check if "#dpage" is already in the dom, if not create it var page = jQuery("<div data-role='page' id='dpage'></div>").appendTo(document.body); // now put a back button
problem
Hello guys, On my page, i have an image. Under the image, there is a button. When clicked, the image would become bigger. But when i press on the button, the image will not become bigger. Im sure it must work. Can anyone of you find the solution to solve this problem? Huge thanks! ------------------------------------------------------------------------
How to increase performance
Hi, I have only 1 html-file, but it contains over 10000 strings of code. Whether performance increase, if create a separate html-file for each page? Sorry for my english. I hope you understand me.
where ,is Jquery mobile design app in new web site?
hi about 2 weeks ago ı can find jquery mobile desing page easly but now with this new site ı cant find desing page.someone send me design page link.help me.thnx sorry for bad grammar :)
some observations on ajax navigation and help appreciated
for the past two months, i have been trying to get a mobile version of my site. so all my stuff are for jquery mobile 1.3.2. here are some things that i have figured out by myself, so please comment on what i have to say and tell me if i am doing something wrong. first as watusiware pointed out that multi-page way of doing things is not very useful unless you have a very small site involving only very few pages because you cannot navigate to a multi-page with ajax. (1) i am not sure sure if i am
Jquery Mobile autocomplete plug in
hello guys i'm a newbie to jquery mobile and am developing a mobile application. Am having a problem with making one of my lists autocomplete when typing into the search box using a remote data source. I have done a bit of research and found out about the jqm autocomplete plugin it seems to be working but the problem is that i cant see the actual values from my remote data source all i get is "undefined" values on my list. Please help see code below <title> Data</title> <meta name="viewport"
The same ID in multiple pages?
I have a strange problem, but after reading a few posts here I think I may have an idea what is causing it. I have a panel with a form in it containing some radio options, two popups to pick a "to" and "from" date and some JavaScript to do some form validation. All those elements are in a PHP page that I include in several pages of the app. When you pick dates in the form, you submit them and it reloads the current page, which reloads a new recordset from the database based on those dates, then the
The definitive ID experiment
I copied this from a response of mine. I think it deserves it's own post. Here's a little experiment you can to do to understand why using IDs is a problem in jQuery Mobile. I haven't put this in a jsFiddle, etc, because I want to keep it as dead-simple as possible. I want people to create a file locally and experiment with their browser console. (Or, if you prefer, add console.log statements.) ------ Try the following simple example. You only need a simple page, and jQuery (don't need jQuery Mobile)
jQuery mobile a "changePage" message problem
when in version 1.3.2，I can use this way to chage other page，and show the "changing" message $.mobile.changePage('index.html', ..... $.mobile.loadingMessage = "reading..."; $.mobile.loadingMessageTextVisible = true; but in version 1.4.0，the "changePage" method will deprecated as 1.4.0 and removed in 1.5.0 by future http://api.jquerymobile.com/jQuery.mobile.changePage/ so I use pagecontainer widget's change() method instead，now I use this way $(':mobile-pagecontainer').pagecontainer('change', 'index.html',
Multiple div around textbox
I am using jquery mobile 1.3.2 version. I have a html table (With data-mode=reflow), which is bound to an observable array using knockout. Whenever an element is added to array, a new row is added dynamically to the table, which is working fine. The problem is there are two divs around textbox (As shown) . Please let me know how to avoid one div around textbox. <table> <tr> <td> <input data-mini="true" data-bind="value: UnitsReceived, attr: { name: 'UnitsReceived_' + $index()
Issues with Header and Footer background color in jQuery Mobile 1.4
Hi, Until jQM 1.3, customized background color where working using the jQM CSS class ui-header & ui-footer. But after upgrading to jQM 1.4, effects of these class has been negative. The 1.4 framework uses active/default theme background color for header and footer. Let me know if this is jQM 1.4 release bug. If not how to apply the customized background color for header and footer in jQM 1.4 Thanks!!
multi-page navigation
i am trying to implement a multi-page site. but the problem is that JQM uses ajax which only loads the first page of a multi-page document. Is there a way for me to simply force JQM to load a document completely and replace whatever in the dom with the newly loaded pages? My situation is that I want a user to be able to sign in to my site, and also sign in with a different user name. so upon sign in, i just do a reload which should get everything right for the newly signed in user. This is the way
Numbered list problem with dots
Hey, i have problem with numbered listview. JQuery Mobile version <script src="../../Scripts/jquery.mobile-1.3.2.js"></script> HTML <div class="ui-body ui-body-c" style="padding-top: 15px;"> <ol id="playerList" data-role="listview" data-split-icon="delete" data-split-theme="a" data-filter="true"> </ol> </div> PROBLEM DESCRIPTION Names are not longer then others. When i will add new name, it will shows like ... (dots) after new loading from DB and
Problem with a collapsible listview
Hi guys, I had a problem while trying to port an app from 1.3 to 1.4 and I can't find the way to fix it, I hope you can help me. The problem is about trying to put a collapsible listview like this one http://demos.jquerymobile.com/1.4.0/listview/#Collapsiblelistview dynamically. I read the data from a json file, then generate an unordered list and then refresh the listview, it worked fine in 1.3, but now the search filter just doesn't appear at the top of the list like it used to do (it does if I
how to call a function
Hello guys, Im using jquery mobile now for a while, but i can't solve this problem. i would really appreciate if someone could help me. I found a code online (a real countdown, so it can show how many hours left till ".." event will begin). My question is now, how can i display this function? The code i found, i placed it in the head with <script> and </script>. How can i call the function itself in the html so it displays the countdown on my browser when i do preview in safari. I really could
How do I navigate 'back' dynamically ?
I can navigate dynamically using: $.mobile.navigate('#' + pageId); But how do I get the reverse animation? I have tried the below but I see no change :-( $.mobile.navigate('#' + pageId, { reverse: true }); and $.mobile.navigate('#' + pageId, { direction: back });
View The Retrieved Data from webSQL Database in list
I want to view the database data in <li> format and actually the data are names of picture I want to view. Here's the javascript database code var createStatement = "CREATE TABLE IF NOT EXISTS batikPattern (id INTEGER PRIMARY KEY AUTOINCREMENT, originalPattern TEXT, outlinePattern TEXT)"; var selectAllStatement = "SELECT * FROM batikPattern"; var dropStatement = "DROP TABLE batikPattern"; var db = openDatabase("BatiQu", "1.0", "Address Book", 200000); // Open SQLite Database var dataset;
Javascript not executing on window.onload when page first loads, but does after a page refresh
I'm pretty new to JQuery and think I have a fundamental misunderstanding of how JQuery mobile works. I'm learning as I go, so I'm not necessarily looking for a specific answer, but a direction to go find it on my own. I am writing some javascript functions with PHP at the server. When the page loads, there is a window.onload command that runs one of the functions. Contrary to what I'm thinking should happen, it doesn't. The script is written at the server then served to the browser. At which time
jqXHR object ?
Is it possible to get access to the jqXHR object from the pagebeforecreate or other jqm event? I'd like to have access to the entire page response (responseText) - not just data-role="page" specifically, I'd like to grab the shortcut icon from the requested page so that I can dynamically update the page's icon.
range slider inside panel doesn't work
I have some sort of canvas paint apss on mobile. I would like to increase the paint brush size simply with a range slider but as soon as I increase the value in the slider, the paint brush size does'nt seem to increase at all. Here's the code. I put the range slider inside a panel <div data-role="panel" data-position="bottom" data-display="overlay" id="bottompaneloverlay2" data-theme="a"> <div class="ui-bar ui-bar-c"> <form id="largeurs_pinceau"> <label for="largeurs_pinceau">Brush Size:</label>
New issue (1.4) with date fields causing major problems
Hello, This I'm sure did not happen in 1.3 or I would have seen it - but now I see it all the time, and it's causing data to be lost. We simply have a date field <input type="date" value="" name="dadNeededBy" tabindex="10">And when you enter it on the FireFox browser or the iPHONE, it works and enters the date into the system. When you go back to the form, it is: <input type="date" value="" name="dadNeededBy" tabindex="10" value="10/10/14"> The issue is on the browser (FF, IE, Chrome), it's fine
JQuery Demo Page Text Input
Your H2 and H3 tags are messed up in the demo Text Input page.
When change page what is change
http://www.youtube.com/watch?v=qxVO0tFdiuA&feature You can watch video. I captured video for showing problem. When i create popup and show listview. It is working correctly but when i change page and load listview, It is not working, I think global variable will deleted. here select is global variable, first time openning search page it is working but second time openning search page,nottings work. i dont know why ? When make popup its working. What is it changing when i change page ? How can i
Themeroller version 1.2.0 is broken?
Hi All, Loading the URL Themeroller for version 1.2.0 fails and appears to 404 on a number resources the page requests: http://jquerymobile.com/themeroller/?ver=1.2.0 Does anybody know what might be happening?
Checking if a remote file exists once detection is realised.
Hi, I have a function that detects internet connection by returning true or false. Using: status=checkConnection(); then returning either True or False from the function. Now if that statement is returned as True so I now know that I have a connection I then want to do something similar to detect the existence of a remote file. So the function would be something like. file_exist=lookForFile(); function lookForFile(){ Ajax call to look for file. If it exists return True otherwise False.
Loading a remote JSON file.
Hi, I am having problems trying to load an external JSON file. I have established the file exists on the server but now want to use it to make a list. This is the JSON file I am using: var employees = [ { "firstName":"John" , "lastName":"Doe" }, { "firstName":"Anna" , "lastName":"Smith" }, { "firstName":"Peter" , "lastName": "Jones" } ];But unsure using JQuery how I access it to return an array. Thanks in advance.
1.4.0 Collapsible: Icon dissapears when updating header
I have a project in JQM 1.3.2. This project uses a collapsible. For multi language I have to update the header and the content dynamically. In version 1.3.2 this worked: HTML <div id="idCollapsible" data-role="collapsible"> <h3 id="idCollHead">OK!</h3> <p id="idCollCont"></p> </div> JS $('#idCollHead').text('translation'); In 1.4.0 this no longer works. The icon dissapears. I tried a lot to fix this, but without success. Please help!
panel between page header and footer
Is there a clean way to render a panel between the page header and footer? I'm working on an application that requires the window to be (vertically) split in half and the panel widget seems to be perfect just for that. But panels are always rendered on top of the header or the footer but this gives the user the feeling that the content of the page doesn't really belong to the scope between the header and footer. I made a jsfiddle for people who know how to change behaviour of the panel. http://jsfiddle.net/3cVXu/
1.2.0 and 1.4.0 Compatible ?
I developed my site using jQuery Mobile 1.2.0. I am now starting a new site based on the old site. I tried to use 1.4.0, but things do not format correctly. Are 1.2.0 and 1.4.0 compatible with one another?
add a listener to activate jQuery Mobile listview after dynamically injecting code
I am having trouble finding the correct event to add a listener to jQuery Mobile listview with filter and custom "autocomplete" code. $('.autocomplete').on("listviewbeforefilter", function (e, data) { will work when unordered list is already on the page <ul class='myclass' data-role='listview' data-inset='true' data-filter='true'> However if I inject the unordered list, it does not work. For greater clarity, try my js fiddle! You will see the first listview works, but those subsequently added, do
Unique advantages about the web app - questions
Does a mobile web app have the greatest advantage in terms of APIs? What favors the web app, if ordinary websites also have access to the same API's and can use them the same way? Can you call a website "mobile web app" simply by inserting jQuery Mobile and data tags, for example by taking a WordPress template and change the head portion and insert data tags in the HTML page? Is a mobile web app the only web application that can be converted to a native app?
JQM 1.4 scroll to top on collapsible click bug
Hello everyone, Trying not to fall behind, I recently started to update my website's JQM library from v1.3.0 to v1.4.0-rc.1 So now I have this bug. When a user clicks on a collapsible widget that is placed inside a panel, the page automatically scrolls to top. I would also like to mention that I also use ember-1.1.2.js , handlebars-1.0.0.js , jquery-1.10.2.js in case it matters. Here is some code from the panel: <div id="create-machine-panel" class="side-panel" data-role="panel" data-position="right"
using php in collapsible-setn doesn't work
Is there a specific reason that I can't execute some basic php-code inside a collapsible-set? I have tried it on many ways, but without succes. Is there some kind of basic rule which I don't know of? My code is: DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jQuery Mobile-webtoepassing</title> <link href="jquery.mobile-1.3.0.min.css" rel="stylesheet" type="text/css"/> <link rel="stylesheet" type="text/css" href="style.css"> <script src="jquery-1.8.3.min.js" type="text/javascript"></script>
Documentation deficiencies 1.4.0
Friends, I am having trouble finding adequate guidance on a couple things: 1) there is reference to deprecating fixed toolbars in favor of "true" persistent toolbars, but not much discussion on how to implement, where to put header/footer, etc. 2) the section on using the pagecontainer to achieve page changes, rather than the .mobile item is also kind of light; the spec given for using the change method gives "to" and "options" as parameters, but the code examples don't demonstrate use of "to" Would
RC to Final
Hello, If I have the Release Candidate being used, is this the exact same as what was released yesterday? There is nothing (no documentation, post or FAQ) which describes any differences between the RC and the final release - and if people need to reupdate their source.
Thanks for jqm 1.4.0
Dear jqm team Thank you very much for the early Christmas present! Really love the new design. More icons, an updated theming application, no more ugly gradients and rounded corners. Excited to explore all the other new features of 1.4.0. Thumbs Up! Merry Christmas! Ralph
Next Page