Functions and plugins not functioning on second page
jQuery Mobile has been a great framework to build my website/app (using PhoneGap) but while developing it inside the desktop browser, I've discovered that my functions are not being run until the page is refreshed directly. My app consists of 3 pages: - intro screen to choose which language - main form - results page to print form inputs I go to the second page using a link <a href="en/form.html" data-role="button">English</a>and inside that second page I use the validate plugin to test the form
type=search - mini version
Hi All, I'm trying to create a header bar that has a home button on the right, title in the middle and search bar on the right. Whenever I use the search input, it seems to want to break onto a new line. Does anyone know how I can avoid this? Thanks Warrick
graphic not showed in jqplot
Hi. I'm trying to add jqplot to my project. I have extracted to a folder called jqplot in my netbeans 7.2 IDE. later in my config file I add the next: <!--[if lt IE 9]><script language="javascript" type="text/javascript" src="jqplot/excanvas.js"></script><![endif]--> <script language="javascript" type="text/javascript" src="jqplot/jquery.min.js"></script> <script language="javascript" type="text/javascript" src="jqplot/jquery.jqplot.min.js"></script> <link rel="stylesheet"
Which chart use in JQM to add events??
Hi. I have been using charts in conjuntion with a map to show an elevation profile (map + chart in the same page) One div for the map, and one another for the chart.. Using code in https://developers.google.com/maps/documentation/javascript/elevation everythings ok, but chart is not correctly showed in most mobiles, in web page and simulators works great. So, my question is: I need to change google chart and use another open source library chart which work ok in jquery mobile and had the posibility
expected url format for local html files?
Hello - I've created a list within a jQuery mobile page named Home.html. I'm developing the page on my laptop in my own personal dev environment. I want the first button in my list to be a "Locations" button that redirects to my Locations page. I've created a Locations.html page in the same directory as my Home.html page. What's the proper url to use for the a href within the li? I tried the following 2 urls but when I click on either of these urls my page displays a jQuery Mobile dialog that
"open dialog" button displaying as url instead of button
Hello - I'm using the following anchor per the jQuery Mobile website to implement a basic modal dialog: <a href="http://www.google.com" data-rel="dialog">Open Dialog</a> Unfortunately, this is only displaying an anchor, not the Open dialog button. Also, when I click on the url, the page redirects to the url in full page mode instead of displaying the redirect url in a dialog. What am I missing? I have attached a text file of my webpage....
Comment System AJAX/PHP in JQM
Hi! Im trying to build a comment system with AJAX, PHP and MySQL, but i have found some example that not working in JQM. Could anyone help me? Thanks very much!!
Button using data-rel="back" does not use slide transition in Chrome.
I have a button in a navbar to to back nagivation. Here is the syntax I am using: <a data-rel="back" data-direction="reverse">Back</a> The calling page uses a link such as: <a href="foo.html" data-transition="slide"> The transition works fine in Safari. In Chrome, there is no transition, it just loads the prior page. The weird thing is if I use the link : <a href="foo.html" data-role="button" data-direction="reverse" data-transition="slide"> instead of the prior link listed then chrome
ipad scrollable pls help
Hi, I integrated flickable code with my code... http://labs.kojo.com.au/demos/flickable/demo2.html but i am not able to make the menu to be scrollable in the popup after clicking this link <a class="openme">Find ATM Locations</a> <!doctype html> <!--[if IEMobile 7 ]><html class="no-js iem7"><![endif]--> <!--[if (gt IEMobile 7)|!(IEMobile)]><!--> <html class="no-js"> <!--<![endif]--> <head> <meta charset="utf-8"> <title>Flickable.js / Demo 2</title> <!-- Mobile viewport optimization --> <meta name="viewport"
scrollable
how to transfer this code http://jsfiddle.net/aNSEn/98/ into scrolling like this... http://labs.kojo.com.au/demos/flickable/demo2.html
Embedded YouTube - back button not clearing youtube heading
Hello I have embedded a Youtube video on to a mobile website ..... <div data-role="page" id="includ2" data-theme="c" data-direction="reverse" data-position="fixed"> <div data-role="header"> <h2>Video</h2> </div><!-- /header --> <div> <iframe width="280" height="158" src="http://www.youtube.com/embed/dR8lt_NkfDI?rel=0" frameborder="0" allowfullscreen></iframe> </div><!-- /content --> </div><!-- /page --> This plays the video fine
Centring grouped buttons
Upon version 1.1.1 this markup <div style="text-align: center"> <div data-role="controlgroup" data-type="horizontal" data-theme="a"> <a class="mbtn-group" href="#about" data-role="button" data-theme="a">About</a> <a class="mbtn-group" href="#help" data-role="button" data-theme="a">Help</a> <a class="mbtn-group" href="#tou" data-role="button" data-theme="a">ToU</a> </div> </div> has centred grouped buttons. Now it is aligned left and it seems I can't get around it.
Select menus wont open on android
I have this problem with select menus They wont open on android (95% of the time) but work fine in iOS. I have tried all the fixes out there (webkit-backface-visibility, removing absolute/relative positions from buttons) but for no avail. Does anyone have a solution for this?
Multiple Sliders - Different Highlight Fill
I have 4 sliders on one page and would like the "highlight fill on the track up to the slider handle position" be a different color for each slider. I have not been able to figure out how to make this work. Any help would be appreciated. Thanks, Dieter
how can i update checkbox id to database?
<input type="checkbox" id="checkAddress" onclick="checkAddress(this)"/> function checkAddress(checkbox) { if (checkbox.checked) { //here i have checked the checkbox,if it is checked i want to update the checkbox result to database alert("a"); } } so i want to update the checkbox id or value to database..how can i do this??
List scroll issue
I have a list where each item is clickable. When I scroll the list the pressed item is being clicked. How can I prevent it from being clicked when scrolling?
White screen blink with fixed footer
Hi guys, I am testing jQuery Mobile 1.2.0 alpha on a Samsung Galaxy S2 running Android 4.0.4. I have noticed there is the white screen blink between transitions when I have a fixed (data-position="fixed") footer. When I remove the data-position="fixed" from the footer, the transitions look great with no blinking in between so it certainly looks like a problem when we specify fixed positioning. Here's my footer code <div class="footerBar" data-role="footer" data-theme="a" data-id="mob_footer" data-position="fixed">
Flip Toggle switch trigger event when flip is started
Hi all, I'm quite new in jquery mobile and for now I have some problems using the Flip Toggle Switch. In my setup the flip toggle switch is refreshed every second with the server state. So when the server value is changing the flip toggle switch is changing too. So far so good. But when I try to flip the switch slowly from on to off it could happen that the flip toggle switch is refreshed and the flip is going back to its starting position. Now I'm looking for a event like slidestart and slidestop
Select SQLite3 offline
I am having trouble finding the info I need... Here is generally what I am trying to do. SQLite3 (I am new to this but have extensive MySQL/PHP experience). The database will hold about 1400 rows and be nearly entirely used as selects. This is for mobile access and trying to figure out how to select the data w/o access to PHP. I found some code online I am trying to work with on a test db, but I am not getting anywhere. var selectAll = "SELECT * FROM mobile_page_history"; function createDatabase(){
Dynamic listview from JSON not showing until manual page refresh (data issue, not css!)
I am pleading for any help on the following issue I have as I have not seen anything else on the web like it! I am building an app with seperate pages, no multipage pages, and I am loading items dynamically into a fieldset and into a listview using 2 JSON formatted strings. The JSON data is 100% correct and the syntax is perfect as I have tested it on numerous validation websites. The 2 JSON strings are around 100kb each. What happens is I click a link on the first page which then laods the 2nd
Showing live videos from a net cam with jquery mobile
Hi, I'm a newbe to jquery mobile and java script and struggling with a problem which might make you laugh. I do like to show a video stream from my network camera in an app. My problem is: I do not want to run this camera unprotected. Is it possible to include the stream even when you have to enter an id and an password? I guess it is but I have no idea how to do it? Right now you have to enter the IP and the port of the camera and then the user ID and a password and then you do have an mpeg file
jQuery Mobile 1.1.0 - this.button is undefined when trying to disable button
On pageshow i trying to disable a button but then i got a javascript error says "this.button is undefined", you find a test page that shows only one button and script that trying to disable the button on pageshow. I have tried on pageinit but then i getting only "loader" image and no button and the same error. My test page: http://test.rickardp.se/jqm/button_test.html Some ideas?
[Help me using jquery]
Sorry if I'm still early in this jquery mobile learning . I want to create a login function to check the input of the username and password in my form using jquery mobile. This application will I package into the native Blackberry applications. Here I am having difficulty in making the login function with the help of jquery to retrieve data from the field and sent to a URL on my webserver. My code : $(document).ready(function(){ $("#submit").click( function (){ var username =
Specify contentType for $.mobile.changePage option
I am passing data to be posted to the server. However, since the server accept XML and JSON, I have to specify the contentType just like a regular jQuery ajax request. This is what I tried but did not work: $.mobile.changePage('/Detail', { type: 'POST', contentType: 'application/json', data: { item: marker.item } }); Please allow an option to specify this.
can't select just injected elements
Hello Community, I'm new to jQuery and jQuery Mobile developing, but I resently desided to give jQuery Mobile a try, rather then developing native android apps. But I am stuck for over two days now, at the point, that I'm not able to select just injected Elements. The injecting takes place in the pagebeforechange event wich I register as followed: $(document).bind( "pagebeforechange", function( e, data ) { //recognize right pagechange //inject photogallery } And the selection takes place
How to define the height and width of the text area in Jquery Mobile?
Before entry, the input field is predefined size (two lines on the screen width)..:( Its not taking anything as I define in the rows and cols value.. Ex: Still the input feild is fixed...Showing no changes. Gradually, as we introduced the text, the height of the input field increases, to view the text introduced in its entirety. But what I need is to define my own height and width of the textfeild...And gradually feild should increase if the text entered is more. Code I am using is: <div data-role="content">
Support for page redirection in Jquery mobile using Ajax calls
Hello, Here is a question I asked on StackOverflow some days ago. It has no answer yet. BTW, if you want to earn some reputation on SO, I just started a bounty for that. == I am building a JQuery Mobile application based on a MVC framework. My problem is that I cannot send "redirect" directives (either HTTP, Javascript, META-refresh) to the browser. It results in the browser displaying "undefined" (indeed, this error is not explicit at all , it sounds like a bug to me) I know that I can fix the
Preloading on first page load
I'm using the multipage template, so only just one html file. Now I want the whole page to have a preloading and not only showing a white page before the content is displayed. I figured out that jquerymobile already is using a loading function so I tried to use it like this: javascript:; javascript:; $(document).ready(function() { $.mobile.loading( 'show', { text: 'page loading', textVisible: true, theme: 'a' }); }); But it's not working! I've put it directly after the jquerymobile include. Can
Listview not show up after coming back to cached page
After creating and populating a listview in code on a cached page, I migrate to another page but then come back to the original page. In Chrome and FireFox I see the previously generated listview but in IE 7 and 8 the list view doesn't show up. I inspect the DOM and see the cached page and previously generated listview items. I'm not sure why they're not displaying, i don't see any visibility CSS applied. Is this a known issue? Thanks!
Problem in fetching data from SQLite database and displaying it as list
Hello! I am new to jQuery Mobile. I am trying to fill a list with "li" items by fetching records from SQLite database. The problem that I am facing is that all items are displayed as a single "li". Below image shows what I am getting And I should be getting is The code that I have written is var strItems = ""; var query = "SELECT id, name FROM categories WHERE ID IN (1, 2, 3)"; try { initDB(); //fillCategories(); localDB.transaction(function(transaction){
loading multiple pages via Ajax
Hi, Is it possible to load multiple pages via Ajax? jQM demo loads multi-page template wihtout Ajax and I have noticed that all extra pages load via Ajax are not added to DOM. Can it be implemented? Best regards, Janusz
Button Custom Icon not working in PhoneGap?
Hi all, I am trying to use custom button icon, the attached example works when running in browser, but doesn't when runs in emulator/real phone (where the '+' icon is shown instead of the custom search icon), I am using Google development tools for Android for development. Any idea what I have done wrong? Thanks! Best Regards, Chee Seng
JQuery Mobile & Phonegap Navigation
Hey guys A while ago I started to work on an Android (and iOS) app with JQuery Mobile. It worked quite good, except I had two problems with the navigation. First, in all Phonegap versions after 1.2.0 (at the time I worked on the app, there was 1.4 out) I had the problem, that when I go back with the Android back button, there was something like an infinite loop. Let's say I started on page 1 and opened page 2, now when I press back button, it keeps switching from page 1 to page 2 and back, every
jQuery mobile css after refresh
Hi, I know that questions related to mine were already asked but unfortunately nothing helped me so far. So the problem is that in some cases (after refresh for example) the css is not applied - actually I'm not sure that it's only the css. When JQM is being loaded well it adds some elements to the html and attributes like class. When the problem appears nothing is added so this might be the reason of the missing css. One more thing that might be relevant is that the communication with he server
How to display the page loading widget while loading dynamic content?
Hello, I'm often adding content dynamically using $.getJson in order to retrieve values from a php script. The problem is that it takes a few seconds to get the content and to display it. How can I display the loading widget during that delay? Thanks a lot.
Can I lazy load images after scrollstop?
Our search results include the user's profile image. I need to lazy these images until the user scrolls and the images enter the viewport. However, I'd like to wait until after the JQM scrollstop event is fired before loading the images. The JQ plugins I've evaluated don't support this (as far as I can tell). Does anybody have a solution for this?
Events in jQM bind(), live(), on(), delegate()
Can someone explain me what event method should be used for jQM? With this I mean bind() & live() & on() & delegate() ... I know that from jQuery 1.7 the on() method is preferred, but jQM docs gives us multiple examples. Maybe standardize this...
Jquery Mobile - Element is hovered after changePage
I am facing a really strange issue and I have been trying to solve it for days now. I've researched the issue, however I didn't find anyone else who faced the same issue. The scenario is the following: I am building a web application for desktop and mobile devices. I have my home page with a table grid, for my menu items. I register onlclick listener on the TD tag where I call Jquery Mobile's changePage. Something like this: $('#home').live('pagecreate',function(event){ $('#db td') .bind('vmousedown',
Closing JQM new popup cause page to refresh uselessly
Hello, I'm using the new jqm popup with the 1.2.0 alpha release and my problem is that my page from which I call the popup is refreshed uselessly when closing the popup using esc key or clicking on the screen... This refresh happen only the first time I close it. If I reopen and close again the popup the page is not refreshed... It seems that for some reason jqm history mecanism get messed up.... It don't seem to be a built-in feature because this does not happen for any popup in the jqm demo
events doubt
How to convert the same jquery functionality into zepto? jquery http://jsfiddle.net/EgQVX/ zepto http://jsfiddle.net/rajkumart08/s6hBG/
Next Page