Disable the #&ui-state=dialog
Hi there ! It's simple, i don't found how i can disable the url creation (Who adding #&ui-state=dialog at the end of the url) when i open a popup. Some tips is very appreciate ;)
jQuery mobile - problem with call popup
Hi, How call popup with jQuery code ? ... This code doesn't work : $("#editDialog").popup(); $("#editDialog").popup('open'); runConfirmDialog(); function runConfirmDialog() { $.mobile.changePage( "#editDialog", {role: "popup"} ); }); My popup is: <div data-role="popup" id="editDialog" data-overlay-theme="a" data-theme="c" style="max-width:400px;" class="ui-corner-all"> <div data-role="header" data-theme="a" class="ui-corner-top"> <h1></h1> </div> <div data-role="content" data-theme="d" class="ui-corner-bottom
Where I can get a good looking jQuery mobile template with all the code and css files?
I've tried coding web pages from scratch with jQuery Mobile and I'd like to see if there's a way to can get a good looking, full, functional jQuery mobile template/pages with all the code and css files, and then just tweak-it/modify-it myself to fit my needs, rather then continue from scratch. Or find someone who can provide this type of help. Thanks
JQueryMobile - Refresh Page in Multi-page
I'm developin an App with Jquery Mobile + html5 + PhoneGap...i'm using a multi-page template...all my app's pages are in the same .html...somethings like this: <!--********* HOME *************--> <div data-role="page" id="home"> <div data-role="content"> ..... </div> <div data-role="footer" data-position="fixed" id="footer"> <a href="#menu" data-role="button" dataicon="home" data-transition="fade" id="credits"> </a> </div> </div> <!--********* HOME *************--> <!--********* MENU *************-->
Background-size:cover and persistent nav-bars
Hi, I made a simple website with a background image set for .ui-page that covers the whole page. There's also a persistent nav bar at the bottom. It seems that whenever a new page is fetched, the background image is initially loaded larger than it should be then is resized down to the screen. You can the issue in my test page. Is this a bug? Am I doing something wrong? Is there a fix or a workaround? Thanks. [Update: It doesn't seem like there is a problem when the window is maximized; only when
Google Chrome Metro (Win 8 Prof on Dell Tablet): on-screen keyboard not working correctly for JQM inputs
Hello, I am facing a strange problem when using Chrome Metro (on Win 8 Prof, Dell Tablet) and JQM various inputs like text fields, datetime fields, etc.. The on-screen keyboard appears just pops up and closes immediately again when "clicking" / tapping into a text input or text area. Additionally, I have faced this problem with my own mobile application as well as on the JQM demo site when using Chrome but not with IE 10. Has anyone seen this behavior before? Does JQM support Chrome Metro in general?
Call a javascript method on all events occurence
Hi I am new to Jquery Mobile. I would like to know is there a way to call a javascript method on all the event clicks of the events available on mobile. Reason : I need to call a javascript method which will set a variable to 0 which would suggest that the application is not in idle for it to time out. so if there is a way to count on all the event and call the javascript mentid that would be great. clearly : there exist a function already( parent.postMessage("alive message","*"); 0 ) which
delay after typing when using remote autocomplete
Hi, I am using the JQM remote autocomplete as demonstrated here: http://jquerymobile.com/demos/1.3.0-beta.1/docs/demos/listviews/listview-filter-autocomplete.html (I know that link is to a beta demo, but it actually works in stable 1.3.0 as well - I just couldn't find a demo in the docs) Two things that are possible when using the jquery-ui autocomplete are: Load the data from a json array downloaded at page load Wait x mS after last keystroke before firing, to avoid multiple unnecessary queries
Switch back to the old documentation for Jquery Mobile
Have you considered switching back to the old documentation style? I think I by now have done quite a lot with JQM - Fully functioning Web Apps, Trigger. io and Phonegap apps with REST driven backends, responsive displays, Google maps and Facebook integration - but - I would never have gotten this far with the new documentation. It is simply to piecemeal, unguiding, unforgiving. Don't get me wrong - you guys have done a heck of a job - really! But I simply cannot abide by the new piecemeal documentation
Programatically changing theme in a Jquery Mobile component
Why theme 'e' is not reflecting in the output? <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" /> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script> <title>title</title> <script> $(document).bind('pageinit', function() { $('input').attr('data-theme', 'e'); }); </script> </head> <body> <input type="text" /> </body> </html>
JQM ListView and Popups
Hi I have a listview in my jqm page which simply displays a list of items coming in from my database. I am using knockout template to render the list view. All this works fine. However when the user "taps" an item in the listview I want a "popup" to display with some option of what they want to do. This is simply a popup containing another listview with some menu options. The popup does indeed show, but then immediately disappears again. It almost like the event click is "hanging" around and "closing"
Listview
This is the response of my Soap-xml web service. How Can i put this in List view and count and put in a badge.?? Advanced Thanks for those who will Help.. <DataSet xmlns="http://tempuri.org/"> <xs:schema xmlns="" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata" id="NewDataSet"> <xs:element name="NewDataSet" msdata:IsDataSet="true" msdata:UseCurrentLocale="true"> <xs:complexType> <xs:choice minOccurs="0" maxOccurs="unbounded"> <xs:element name="Table">
select in popup(panel)? [CLOSED]
Hi, I can't get data-native-menu to be false when opening select(dropdown) in a popup when using panel. Is this possible? or link: http://goo.gl/eIQIT See attachment.
trigger("create") for a popup dialog doesn't show it with css
Hello, I want to prepend programatically a var which is a popup dialog into a content div. The problem is that when I try to trigger('create') and then to open the popup, it is shown but not with the complete css style, I mean the popup header and the fonts are not right. The jsfiddle is here: http://jsfiddle.net/amanz/4VKk2/1/ Can you help me please? Thanks, Andrei
Jquery mobile datetype is not working on Samsung S3 mobile.
Hi All, I have 4 date pickers on my page. when i click on first datepicker i am able to get the value in textbox. and click on second datepicker the page is getting struck. Is there any thing need to do? <input type="date" id="Schedule_startdate" /> I tested in Samsung grand. It's working fine.
Convert byte array stream to pdf
Is it possible to create a byte array stream to PDF ..... searching the NET I found some conflicting information and its lacking too. Basically I am using JQuery Mobile and calling a webservice which provides a stream of bytes. I want this stream of bytes to be converted to a PDF. Any help, very appreciated. Thanks.
.mouseover() help
$("figure").css({"top":y+"px","left":x+"px","width":w+"px","height":h+"px"}); $("figure").html('<img src="'+trg.src+'"'+jg_gallery_init("#gallery")+' />'); function jg_gallery_init (jg_s) { //creating structure $(jg_s).html('<div class="jg_controls"><div class="jg_c_stop"></div><div class="jg_c_play"></div><div class="jg_c_prev"></div><div class="jg_c_next"></div></div><div class="jg_image"></div><div class="jg_text"></div></div></div>'); //showing text info $(jg_s).css("margin-left","auto"); $(jg_s).css("margin-right","auto");
add data in a list
Hello I want to add in a list some data from the database when I apply this .js , the data is writen out a list .html <ul data-role="listview" id="pop_event"> </ul> .js var div = $("#pop_event"); for ( var i = 0; i < result.invocationResult.resultSet.length; i++) { div.append("<li><a ><table><tr><td><img src='../images/heart.png'></td>"+ "<td>"+ result.invocationResult.resultSet[i].name_event+"</td></tr>"+ "<tr><td></td><td> Nombre de participants: "+ result.invocationResult.resultSet[i].nb_part+
jQuery Mobile changePage in pagebeforeshow Flicker
In several of my jQuery Mobile pages, I need to ensure that certain variables are set before allowing the page to show. As such, I check for these variables in the pagebeforeshow event and if they are not present or correct, I call the $.mobile.changePage(...) inside the pagebeforeshow event and then immediately return. In jQuery Mobile 1.2.1 this seemed to work perfectly. However, now that I'm using jQuery Mobile 1.3.1 I've noticed an odd rendering issue. Now when I call the changePage inside the pagebeforeshow event,
Json Status Flip Switch ??
How do I run status all page, Flip Swtich ??? ( '#page1' , '#page2' , '#page3' vs... ) function updateControls() { $.getJSON(\/status.json\, function(json) { $.each(json, function(key, value) { $(\#\+key).val(value).slider(\refresh\); }); }); } $('select').bind('change', function(event) { element = event.target.id; if (element.substr(0, 6) == \outlet\) { eleid = element.substr(6, 2); } else { eleid = 0; } command = event.target.value; $.get('/cmd', { 'eleid' : eleid, 'cmd' : command }); }); $(document).ready(function
Using a custom theme for list icons
I used the theme roller to create a simple colour change of the arrow icons for a list (and hopefully also the plus minus symbols on a collapsible list) but can't seem to get the change to kick in. My css sheets currently look like this with my colour change one being called 'custom_list_arrows.min.css' <link rel="stylesheet" type="text/css" href="mobile.css" /> <link rel="stylesheet" href="themes/custom_list_arrows.min.css" /> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css"
binding pageshow events
Hi, I'm developing an healthcare analysis phonegap app. in the app i have a list of multiple files which I need to open read, analyse and display. at the moment I have a list and each item has href="#analyse", than in the code I have a click listener which triggers the analysis on chosen file and than it is displayed. My problem is that the analysis page displays just after the calculation is done which can be couple of seconds. What I want is to load "#analysis" page before the calculation is started.
Problem with listview item and ajax
Hi guys, Im quite new with jQuery Mobile and i have a problem with <li> and ajax.A page has an ajax at the loading and the <a href> gets me right on that page,and if i go with <li><a href="x.php">x</a></li> the ajax does not load. in case i make it <a href="x.php" data-role="button">x</a> it works( the ajax on the x.php page). I would like to use <li> elements because of their design and the count bubble. Thanks in advance. [ edit ] hi again, i just found out what was the problem: <li><a href="x.php"
Page cache issue
I have three data in list.php, after I click add button it will go to add.php, I pick a item and click on it when I am in add.php, it will use ajax to save one more data to database in the background, and I click back button which is use data-rel="back" api back to list.php, the data still be three, only if I refresh the page then it shows four data, how to show correct amount of data if I click back button I add two meta on list.php <meta http-equiv="cache-control" content="no-cache" /> <meta http-equiv="expires"
Dialog Not Opening [SOLVED]
I have a grid containing images and have created a white box in the lower right-hand portion of the page. http://mobile.gmjones.org/employments.html Inside this box, I have: <a href="#log" data-rel="dialog">Open dialog</a> I have a page: <div data-role="page" id="log"> <div data-role="header"> <h1>Dialog</h1> </div> <div data-role="content"> <img style="width:170px;height:220px;" src="http://gmjones.org/images/GrantPicNEW.jpg"> </div> </div> When I click 'Open dialog',
Move position of arrow-r icon
Hopefully this is my last question and I can eventually start helping others out! I have 2 buttons in my header, one on the left hand side using arrow-l and one on the right using arrow-r. The arrow-r one has the arrow icon on the left of the text which doesnt make much sense to me and I would have thought by default it would be on the right of the text. Can I move the position so it goes from the left of the text to the right?
[input type="date"] how to change date format
Hi, I am looking for how to change the date format used in jquery mobile. Default one seems to be taken from browser's preference (dd/mm/yyyy on mine, yyyy-mm-dd on a friend in UK with the same code), which does not match my needs. I did not find any where googleing it, at least I found no jquerymobile built-in solution. Does such an option exist ? Thanks for your help. <div data-role="fieldcontain"> <label for="startdate">Start Date:</label> <input type="date" name="startdate" id="startdate" />
Facebook login popup in JQUERY Mobile
Facebook login authentication using html and jquery mobile, When i am click facebook button in the jquerymobile page the facebook login page will display in the same window POPUP How to create this in using Jquerymobile.
[solved] string appearing as a word, its length wrongly shows as 1
here's how the string comes to existence: presidentsname = ((lista[number]).split("|")).slice(0,1); document.diagnostic.window1.value=presidentsname+" " + presidentsname.length; with Hollande the name shows properly, but the length turns out to be 1 how to modify presidentsname.length in order to obtain 8? or must the error be elsewhere?
Template Grid JQuery Mobile
Hello, I research an example of a grid(with lines and columns) with borders, colors, background-colors to have a beautiful grid to print on a mobile phone. Do you have any ideas ?
Play media files in protected htaccess folder
Hi all, My jquery mobile page is running well. The page itself is with an htaccess protected folder. I have links to mp3 files which are within this folder. They won't play on mobile phones (they do however on a desktop PC). If I link to an mp3 file located in an unprotected folder, it works (with both, direct linking and jplayer). So: - Using the jquery mobile site on a desktop PC, mp3 files within or outside htaccess directory can be played - Using the jquery mobile site on a smartphone, mp3 files
Icon not positioning correctly
Icons not positioned correctly in visual windows. there was a question about this for android 2.2 but i am on ios 6.1. any idea why these are out of alignment?
How to increase the size of icon button
Hello there ! I'm on the last step to finish my mobile website and when i test my website on mobile i found that the button icon is too little and not very easy to use...I would like increase there's size. How it's possible ? Thanks
Style Issues with JQM 1.3.1
Styles are not working with JQM 1.3.1. -- Input Fields are displayed as labels -- Modal windows are not populated as expected <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" /> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script> However these issue are not there with JQM 1.0.1 & 1.2.1 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css"
Android Issue (focus is not working on select box)
Issue with Android (WebApp). I am using below jquery : jquery.mobile-1.0b2.css jquery-1.6.4.min.js jquery.mobile-1.0rc1.min.js Focus is not working on select box in Android WebApp: -- tried binding the events mouseenter and mouseout Is there any other way? <!-- below is the sample code --> $(document).ready(function () { $("select").each(function (event) { if (navigator.userAgent.toLowerCase().indexOf("android") != -1) { $(this).bind("mouseenter", function (event)
JellyBean Issue (select box not populated with first click)
Issue with Android Jelly Bean (WebApp). I am using below jquery : jquery.mobile-1.0b2.css jquery-1.6.4.min.js jquery.mobile-1.0rc1.min.js Unable to populate select box options with first click -- Whenever a selectbox is clicked it does not reveal the options unless it is clicked multiple times How do I display the options on the first selectbox click? Any help greatly appreciated. <!-- below is the sample code --> $(document).ready(function () { $("select").each(function (event) {
The select column toggle button dont work when create the table dynamically (Table data-mode="columntoggle")
Hi, my name is Juan Pablo. First of all. Sorry for my poor english. My problem is that i append to my html table all the data dynamically (Columns and Rows). So, when the render finish i got my table complete but when i click the button "Column.." to select Columns to show or hide. this don't show me the popup windows I think is because I add the columns to my table dynamically I'm Using the released version 1.3.1 of jquery mobile With phonegap to develop a cross-platform app I copy here my html
Update from jQm 1.2.1 to 1.3.1 fails
Hi, i would like to update my webapp from jQm 1.2.1 to 1.3.1 but it seems that there is a problem with simply loading content from a txt-file with he load-command: this works with jQm 1.2.1: <!-- inhalt fuer server-meldungen nachladen --> <script>$('#server-meldungen').live('pageshow', function() { $("#server-meldungen-txt").load("server-meldungen.txt"); }); </script> <div data-role="page" id="server-meldungen" data-add-back-btn="true"> <div data-role="header"> <h1>Meldungsübersicht</h1>
page refresh not working with ajax navigation?
I have an index page successfully loading another page called information.php using ajax-navigation. However, when i am looking at information.php and i press the refresh button on the web browser, it displays information.php but i lose the head. does anyone know how to make the page reload with the missing head (from index.php)? here is my model: index: <!DOCTYPE HTML> <html> <head> <title>index</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="../css/ui-darkness/jquery-ui-1.10.2.custom.min.css"
autocomplete listview in IE7...?
Hi, I use remote autocomplete on my site: http://liveTrains.co.uk/ As demonstrated in the docs here: http://jquerymobile.com/demos/1.3.0-beta.1/docs/demos/listviews/listview-filter-autocomplete.html# This works for me as in the demo in almost all browsers. However, while the demo works in IE7, my site does not produce the dropdown filter list when using that browser. I'm running out of ideas as to why... Any suggestions?
Next Page