jquery Moble + google maps does not render as a mobile page
Hi, I'm attempting at creating a new mobile site using jquery mobile and google maps. I have a map loading with the directions services in what I think should be a jquery mobile site but when I view it on a mobile device it looks like a desktop version and is extremely small. The display is small and the buttons aren't rendering as a jquery mobile view. I'm fairly new at jquery and jquery mobile so I maybe missing something simple. Here is a code sample: http://jsfiddle.net/Nemesiss/J82UJ/ below
refresh a form element
i can't seem to find documentation about the new refresh stuff.. is it supposed to work for form elements too? i tried this: $("#detail_form").html(data); $("#detail_form").fieldcontain('refresh'); but my radio buttons aren't getting styled. anyone know how to do this? html code is: <form action='/~polling/polling/polling.php' method='post'> <div data-role='fieldcontain' id="detail_form"> </div> </form> php is: echo "<fieldset data-role='controlgroup' data-type='horizontal'>
Trouble with jump to the page
Hi. I'm using jquery mobile lib. I'm testing application on my phone with android. So I have one problem with jump to the page now. I open main page. In the bottom of page I see word "Loading". Then I click on a link "Page2". Then Page2 rendering under my page. What I am doing wrong? Sorry for my English.
Loader dos not work while the page loading
Hello all, I have problem with page loader it's not showing while the page loading for example http://www.3aqark.com/webapp when your click on the link (inside the page) it suppose the loader showing will the next page loading!! and same problem in the next page!! any help ^_^
How to apply video chat using jquery mobile?
Hey guyz i am using Jquery mobile.... i would like to know how to apply video chat in it? and also how to link it to face time in case of iphone???
Issues in a Windows Phone WebApp using JQuery & JQuery mobile
Hello, I have some issues in a webapp for Windows Phone 8.0 (that runs in WP8.0 and WP8.1), the index.html uses: <link rel="stylesheet" href="css/jquery.mobile-1.4.2.min.css" /> <script src="js/jquery-1.11.1.min.js"></script> <script src="js/jquery.mobile-1.4.2.min.js"></script> the source code is here: https://www.dropbox.com/s/mwv9m9bgguv9dw9/Demo_Forum.zip ( this file contains a folder with html/css/js code, a wp80 webapp for test and a website with code to debug in simulator if needed- this is
jQuery Mobile Static Progress Bar
What's the best way to create a simple jQuery Mobile friendly Progress Bar? I don't need a dynamically changing progress bar (ajax updating). I thought about just using a slider. I just need to occasionally set it to a value.
Pop Up in navbar and tabbed content
Hello all! I am creating a navbar that will be used as tabs. All is working well with the tabs. I would like for the last link in the navbar to open a popup with a list. The popup doesn't come up when it is in the li tag of the navbar. When I remove the li tag from the popup menu item it works just fine. Also it will work if I remove the data-role="tabs" from the outer div. The pop up content is located inside of a data-role = "page" which is something I noted from the docs that is required.
Scrolling issue on a page with many Checkbox Fieldsets (ControlGroups)
I have a fairly long page of 40+ checkboxes. The checkboxes are grouped in ControlGroups (Fieldsets). After scrolling down the page some, I notice the after tap action stylings get applied to a different checkbox (several checkboxes above it). This happens when you Tap on a checkbox approximately 1/2 way down screen. Scrolling down changes where the styling is applied; it seems to be based on position. The checkboxes towards the top half don't experience this issue. Also, the problem only occurs
Close popup div when clicked outside
I have a popup div that shows only when clicked on particular button. It even hides when clicked on the same button. My problem is, i also want to hide div when clicked anywhere outside. In fact, if i click on my screen, outside the popup, it will hide. But if i touch the screen and scroll it down or up the popup still there !
link widget, is data-dom-cache meaningful?
since the linked to page has data-dom-cache, what does the attribute data-dom-cache on the link mean? does it override anything? just tried, and it does not seem to make any difference. a confirmation of no meaning will also make me happy. thanks.
jQuery Mobile Sliders within slider group can influence one another
Hi, I have an odd issue I can't seem to resolve that involves jqm slider widgets. The problem does not occur regularly and only on my Android phone when using the Phonegap app I have created which uses the sliders... I have around 8 pages that contain different groups of sliders (groups of 2 or 3 sliders per page). Aside from the sliders responding slowly on my phone, the sliders seem to work fine save for one irregular problem- if I drag the handle of one slider and then change to the handle of
$.mobile.pageContainer.pagecontainer("change", url, {reloadPage}) is not removing the existing page?
if i do $.mobile.pageContainer.pagecontainer("change", "somepage.php") and sompage's data-dom-cache="true" and has a page div id="myid" now go back to the from page, "#myid" is in the dom because data-dom-cache="true" now do $.mobile.pageContainer.pagecontainer("change", "somepage.php", {reloadPage:true}) from my understanding, this should remove the contents of "#myid", basically do $("#myid").empty() and put the new content into "#myid", but jqm does not empty "#myid" instead it inserts another
is there a data-reload or data-reloadPage on a link?
since the $.mobile.pageContainer.pagecontainer("change", url, {reload:true}) or {reloadPage:true}, does a link have a similar attribute?
internal page navigation with data-dom-cache="true" or "false"
when i have a multipage jqm application, does it make a difference if the attribute data-dom-cache is set to true or false when navigating between pages of the same document? i looked at the dom, that div is never removed from the page. so data-dom-cache is only significant when navigating to an external page. am i right or wrong? thanks for your thoughts.
is it a bug? $.mobile.pageContainer.pagecontainer("change", url, {reload:true});
have anyone notice this? according to the documentation for version 1.4.2 reloadPage (default: false) Type: Boolean Note: This property is deprecated as of jQuery Mobile 1.4.0 and will be removed in 1.5.0. Use property reload instead. Whether to force a reload of the page even when it is already in the DOM. Used only when the 'url' argument is a URL. but with reload:true, it does not force a reload only when {reloadPage:true}, reload will be forced.you can test it to load a url (in my case, just
How can I do scalable images in IExplorer and Firefox as the Responsive Web Design suggested?
Using the "max-width" property doesn't work for IE an Firefox, but it does for Chrome. I am not interested in the reason of that, but in a solution, a way to simulate these property if I have an image inside a table that I want to be resize if the width of the table changes.
how to clear browsing history?
i have an index.php (all page divs are with data-dom-cache='true') as a multipage document. the first page is a div "#index", and other internal page divs. but from it people can go to other pages (not interval to index.php). when people go back to "#index" (from a page not internal to index.php), href="#index" is not going to work since other pages are external and not fetched through ajax. so I set href="index.php". since all the page divs in index.php are with data-dom-cache="true", clicking on
Problem with taphold and click on same element
I need a click event on a 'A' element buttonified to do one thing But if the user longpress (taphold) the same A, another thing must happens. The problem is that after taphold is triggered, and user leave the finger, the click event is fired. I tryied event.stopImmediatePropagation() but without luck. How to resolve this ?
Popup not styled
Hello, I've a problem when I click on my button for opening the popup dialog. Actually, the popup doesn't accept data-theme="a", data-theme="b", data-theme="c",...I'm obliged to use css style with "background-color:#4b88b6;" and also, the button 'OK' is not styled with JQuery mobile. Do you have a solution ? Thank you <script> $(document).on('pageinit', function (event) { $("#connectionFacebookBtn").on("click", function (event) { $("#dialog1").popup(); $("#dialog1").popup('open');
Replacing panel widget with Snap.js
Does anybody know how to set up Snap.js in jQuery Mobile? I'm trying to migrate from the jQuery Mobile panel widget (which has major scroll issues), but it doesn't seem to want to work at all: http://jsfiddle.net/frank_o/vZBzD/3/ In comparison here's a working version without jQuery Mobile: http://jsfiddle.net/frank_o/5X4K9/5/ Thanks! Frank
How get the value of a input text using prev() and val() method?
Hi everyone Im trying to get a value of a input type text. im used the val() method. I apply this method with a selector based in the location of the input text, using the prev() method. In the var $curr i have the selector of the input text. In the next line i put the $curr var in red. This confirm that its the correct selector of the input text. In the next line i trying to get the value but with $curr doesnt works. When i change this line for $('#TextFromInput').text($( ".test" ).val()); (using
Collapsible attributes disappear after trigger('create')
Hello, all, I'm very new to jQuery and jQuery Mobile. I try to load some data from an external database and show each row in a collapsible, but it doesn't work even when I replace the dynamic data with static html. What I'm trying is this: On my page I have: <div id="tableContents"> </div> In JS I do: $(document).ready(loadData); and loadData does this: $( "#tableContents" ).load( 'some.html', '#table' ); $('#tableContents').trigger('create'); And some.html contains: <div id="table" data-role="collapsible"
jQuery mobile issue
I'm using jQuery mobile on my site, but when I access parts of the site that doesn't use the jQuery mobile they kinda fail. One page where I use jpgraph wont load. I'm stuck with the ajax page loader forever. How can I solve this problem ? If I refresh the page, then it works. Seems like there's a cache problem ?
how to cancel a page change?
i have a page, when it is shown. i want to make sure some data are corrent. if not, i want to prevent it from being shown. since i do not know from where the change will come from. i need to attach a event handler to this page. (will be deprecated, but some people are fighting to keep it in) so now i have tried $("#page").on("pageshow" "pagebeforeshow" "pagebeforeload" and in the handler i tried to return false, or e.preventDefault() but somehow the page still show up. is there a way for me to cancel
Is there a difference between pagecontainer's load and change?
it looks like the pagecontainer's load method is not needed because the change method can do all it does. the change method can load an external url as well as the load method can.
Swipe to close panel also triggers click button events
To whom it may concern, I'm working with panels currently using JQM 1.3.1 and I'm finding an issue with it's swipe to close event handler when I set the panel to not be dismissible. If I have a button or onclick event handler on the panel and I were to swipe over that area to close the panel, the onclick event is also triggered which is not ideal. This is what I have so far. HTML <a data-role='button' href='#rightPanel'>OPEN</a> <div data-role='panel' id="rightPanel" class="rightPanel" data-position="right"
back page in reverse direction, is it possible?
Normally, when transition is "slide", a new page comes from the right of the screen, and when click on a link with data-rel="back", it goes away to the right of the screen. When i set reverse to be true (on a link with data-reverse="true") or do a page load (or change) when reverse:true, the new page will come from the left of the screen. But in this case, when it goes away through a click on a link with data-rel="back", or call $.mobile.back(), it still goes away to the right of the screen. i am
data-theme="a" doesn't work for a dialog box
Hello, I've a problem when I print the dialog box on the screen. I tried the data-theme="a", data-theme="c", data-theme="d" but I've every time the same color printed(in white). There is just the data-theme="b" that prints the dialog box in black. I tried with $("#dialogbox1").trigger("create") but it's always the same result. Do you have a solution ? Thank you <script> $(document).ready( function(){ $("#contentDialog").html("dfds"); $.mobile.changePage('#dialog1', { transition:
editable list view
Hi everyone :) I´m trying to development a editable list view with jquery. My list, began with an element that have inside some elements that you could see when you click on it. i have a button to create a new element of the principal list. How can i create another element of the principal list with the same type of elements and characteristics of the first element of the principal list? Here is my code: <title>Lista con Botones</title> <meta name="viewport" content="width=device-width, initial-scale=1">
Listview is locked for some reason
To whom it may concern, I'm having a weird issue that may or may not be repeatable for other people but I managed to repeat it every time. This issue only happens on an iPad though and does not happen on the browser. Some background: This is a phone application using a mash up with PhoneGap to access the WebSQL library as well as some other stuff but only needing the WebSQL for this issue. I'm using JQM1.3.1 but I don't want to update to the latest 1.4 because there's too many changes between the
Stop webapp from streaming mp3 file but download it instead
I am coding a webapp using html5 and jquerymobile, and i created a download link that streams the mp3 file, which i dont want it to do. i used the html5 download tag but it doesnt help, only works in chrome. <a href="Zagro Deejays feat Lala - Inspiration (Main Mix).mp3" download="Zagro Deejays feat Lala - Inspiration (Main Mix)" class="ui-btn ui-shadow ui-corner-all ui-btn-icon-left ui-icon-arrow-d">download</a>
"after-create" event for panel?
Hello, i want to add a class to a specific element in a panel, after its completly created/loaded. But using event "create" does not work. "beforeopen" does work, but i dont want to fire it every time the panel opens. Is there a solution like "after-create", that fire one time when panel completly has beend created? Thank you
looking for example templates or gallery for jquery mobile 1.4.2
Are there any sites that have a good gallery or example templates using jquery mobile 1.4.2? I have only been able to locate examples with older jquery mobile versions. Best regards, Ty
iframe popup
Hi guys, Trying to implement popup with iframe embedded. This documentation is not that clear for me. I want to dynamically bind popup to table cells, i have a widget that can be embedded. now if i take this div: <div data-role="popup" id="popupVideo" data-overlay-theme="a" data-theme="d" data-tolerance="15,15" class="ui-content"> <iframe src="http://player.vimeo.com/video/41135183" width="497" height="298" seamless></iframe> </div> (with my own url) I get an iframe inside my page already, its not
how to write radio button click event in jqueryMobile
$(document).on("vclick", "input:radio.rblPolls", function (e) { e.preventDefault(); alert('Hello'); }); function what i written is not triggering.Please help on this Thanks inadvance
I'm having problems with data-overlay-theme
When I open the popup overlay does not work fully. What is happening? My phone is a Galaxy III.
Help Jquery Mobile, Phonegap build and PHP MyAdmin
Hi guys, I am quite new to programming and mobile development and I came across an issue which I can’t resolve. Right now I am creating an image gallery app where people can share their comments on the images. So how can I integrate a PHP MyAdmin database into my JQuery Mobile app and still able to use Phonegap build to create my app? Many thanks.
how to load an external page (or force non-ajax reload)?
I try to let users click on the title bar (the middle portion) and force a reload of the page. so on the title bar <h1 onclick="$.mobile.pageContainer.pagecontainer("change", "index.php",{allowSamePageTransition:true, changeHash:true, data:null,
how to make a split icon dark (theme-b) while the split is light (theme a)?
Hi: For a listview, I can add a second link to make a split button. In version 1.3.2, if i do <ul data-role="listview" data-theme="d" data-inset="false" data-split-icon="gear" data-split-theme="a"></ul> here theme "a" is dark, theme "d" is light, the icon is black on a white button. but in version 1.4.2, it does not work, either both the split button and the icon are black, or both are light color. I have tried various ways, such as make the icon and button both dark with data-split-theme="b" and
Next Page