how to disable a page in jquery mobile
Hi I am using jquery mobile in my android phonegap application.I am showing the loading popup in the onload using jquery mobile and when loading popup is shown,i can able to type in the textbox in the html page.How to solve this problem Here is my code: $(document).ready(function () { $.mobile.loading('show', { text: 'Loading', textVisible: true, theme: 'a', html:"" }); });
prevent iphone app to auto stretch in ipad
Hi Guys, I have an app designed for iphone in jquery mobile and phonegap. It works fine on iphone or ipod. but the moment i open it on iphone, it stretches it self in the ipad for fluid layout i guess. So how do i prevent it so that it will be centered like other apps.
if browser is old and not support jquery mobile, what should appear in buttons code place
jQuery mobile buttons code, works in all newest browsers, what if browser is old and not support jquery mobile, what should appear in buttons code place?
Not able to load JSON when coming from other pages & swipe issue on a page
Here is my index html http://pastebin.com/Svi6kbMF players.html, http://pastebin.com/VKUUaEkv buynow.html, http://pastebin.com/tUpAKFSm Problem I am having is, JSON doesn't load on players.html when I visit it from index.html or buynow.html. Moreover, I am trying to add swipe to players.html but it's not working. Am I wrong anywhere?
Problem to execute Javascript with JQuery Mobile 1.3.0
Hello, Currently, I'm working with JQuery Mobile 1.3.0 under a "ASP.NET MVC 4 Web Application". In this project, I use Javascript, HTML, AJax, and so on. When I put this line in my code '<script src="@Url.Content("~/Scripts/jquery.mobile-1.3.0.js")"></script>" to use JQuery Mobile, my Ajax and Javascript codes don't work anymore. Do you have a solution ? Thank you
modifying nested collapsible content after return from dialog in jqm-1.3.0
Hi, I've got a page containing nested collapsible content that's dynamically generated through an ajax call to another page. Each element has an edit icon that allows the user to edit the content of what's in the <h3> header. The editing is done via a call to a dialog using the new 1.3.0 capabilities of data-rel="dialog" called from within an <a href=[page] dat-rel="dialog" ...etc. > link. All is well with saving the edit to a database behind the scenes. My problem is that after the user closes
Custom Theme
I have put together the first test page of a project. I created and added a custom theme. I have referenced the CDN CSS for in the document as well as the custom theme I created. Everything works great on my desktop server environment, but when I push it out to my production server and navigate there over the web from the same browsers, the themes revert back and drop all of my custom CSS. Any thoughts?
Authentication using jQuery in Worklight
Hello every one is there any one who had develloped a mobile application in Worklight with jQuery mobile ? I need a authentication part Thank's in advance
Non-ajax form not posting
I'm trying to add a hidden form that will be triggered to submit to a page on a desktop version of my mobile site, but even stripped down to the basics, the submit doesn't do anything, even just using the button, with the form visible. I've tried everything I can think of, including disabling jQM enhancements, but no luck. Anyone have ideas what I might be doing wrong? Thanks <form method="post" data-ajax="false" id="fullSiteForm" action="http://localhost/myapp/logon.do?site_preference=normal" target="_blank">
Open panel on swipe
New to jQuerymobile and have to say I love it! Working on my first app and really like the Open Panel on Swipe feature. I was able to get it working by placing the script in my document head tag. I changed the pagename from #demp-page to #mypage and it works like a charm for that page only. I've been looking for a way to have this work on all my pages, not just one. $( document ).on( "pageinit", "#demo-page", function() { $( document ).on( "swipeleft swiperight", "#demo-page",
loading effect
hello am trying to use loading effect(transition) on click of my form button, please how do i go about it, thanks
data-enhance="false" not escaping dynamic divs
Hi I am using a jquery library to create a flipbook animation, however when I try to escape the flipbook I have some issues, the dynamic content is still styled even though it is inside a data-enhance="false" div, here is the jsfiddle: http://jsfiddle.net/adamsurfari/DpQQV/ the issue is that inside my div: <div class="turn-page-wrapper ui-page ui-body-c" tabindex="0" style="position: absolute; overflow: hidden; width: 200px; height: 300px; top: 0px; right: 0px; left: auto; bottom: auto;
Simple button not working, unless I hit F5
I have a strange bug http://goo.gl/GhVzL When I click on 'Planificador de viaje', I get taken to this page http://goo.gl/CZaaQ This is as expected, but when I click on 'OK, entiendo', the button doesn't work UNLESS I refresh the page. Any clues? There are no alerts in my Javascript console in Chrome. However, when I look at the Error Console in Firefox, I see that this warning initially appears "Error in parsing value for 'pointer-events'", but then vanishes when I hit F5. I've searched, but
How change page with javascript?
Hello, i'm Daniel from Mendoza, Argentina. I have one multipage site. I want to load an internal page from a function. .... function test(){ if ($("id").val()==1) { //load page2 ???????????????????????????? }else{ alert('Error'); } .... <div data-role="page" id="page"> <div data-role="header" data-position="fixed"> <h1>Simulador AVL</h1> </div> <div data-role="content"> <div id="controles"> <input type="text" name="ip" id="id" /> </div> </div> <a href="" data-role="button"
validate select data-role="slider" with jQuery
Hello, I would need some help with a jQuery validation for my mobile web site (jQuery mobile + Asp.NET). I´ve got a jQuery validation for my register form (developed in asps.net) and it worked fine untill I included a select data-role="slider" on the form. <label for="accept_conditions_flip">Swap Centre Active:</label> <select name="accept_conditions_flip" id="accept_conditions_flip" data-role="slider"> <option value="0">No</option> <option value="1">Yes</option> </select> I don't know how
ajax request
Hey Guys, I'm having a problem with ajax-calls in my jquery-mobile application. I'm doing an ajax call like $.ajax({ url:SOMEURL, Origin: "*", dataType: 'json', success:function(data){ alert(data); }, error:function(xhRequest, ErrorText, thrownError) { console.log('xhRequest: ' + xhRequest + "\n"); console.log('ErrorText: ' + ErrorText + "\n"); console.log('thrownError: ' + thrownError + "\n"); alert("Could not
Collapsible blocks for a newbie!
I'm brand new to mobile development, our mobile site has recently been created for us and it looks great. I have been adding content on a daily basis and getting used to the mobile layout. One thing I would now like to add are collapsible, accordion blocks for a page which has 3 sections. So I looked at all the downloads available and went for this one Zip File: jquery.mobile-1.3.0.zip (JavaScript, CSS, and images) This gives me numerous css and js files. So from the jmobile site I added the following
UI and Plugin for RSS Feeds Reader
Hi All, Wanted to know if there is any JQuery Mobile Compatible RSS Feeds Reader for Mobile / Tablets. Please suggest. Regards, Anurag
CSS Bug (and solution) in navbar
Hi. This always happened (since old versions) and I always fixed by removing horizontal scrollbar with java (for android apps and using phonegap layer for jqm) but today I tried to fix it in CSS. In the navbar, if you have "a" elements (buttons) and if you have odd elements (lets say 3), the width in the last "a" element is always longer than the parent container, causing the browser to show an ugly horizontal scrollbar when touching and dragging inside the page, as shown in http://tinypic.com/r/eivb0l/6
how include predefined data either as db or local storage, ready when app run for first time
how in a jquery mobile phonegap app include database kind data,... I know only to create db and make the user add to it, but I do NOT know how include predefined data either as db or local storage, ready when app run for first time...?
listviewbeforefilter / asynchronous AJAX request / update
I use the following code for a listviewbeforeupdate with external data. Some changes from the examples on this site: - no page ID is identified as the javascript is only inserted dynamically with PHP subject to the page loaded). - no reload if >3 letters The latter adjustment should be a performance booster as the data-filter is quicker than multiple Ajax requests (at least in my case) Everything works fine with a synchronous Ajax request. However with an asynchronous Ajax request (which I prefer
JQM Data, Closing & Re-Opening App.
Hi, I am not sure if this is the right place to post but here goes. Can anyone tell me that if you close an app to use another one then re-open the original do you open on the same page and any settings that are in use remain? For example, if a user enters there name and age in an app - close it whilst for example using the calculator - then re-open it, would it still open in the same page with both the names and age that the user had entered still in tact?
enable and disable it scrollstar in jquery mobile
Hello I am new to the forum I did not find solution in google for my problem, my last resort was to go here, well I commented my problem, I disable the scroll when opening a panel jquery mobile and enable the close but unsuccessful, alone with desabillitarlo to open the panel, I did something asin: $(document).on('pageinit',function(){ $("#my_panel").panel({ beforeopen: function(event,ui){ $(document).on( "scrollstart", function(event){ event.preventDefault();
Applying css to html snippet
Hi, I written some learning resources for my students for use on mobiles and have some accessibilty settings in my single page resources that allows the user to change the font size and background colour. I have separated all the relevant stuff into this example page to demonstrate my working model. <!DOCTYPE html> <html> <head> <meta charset="UTF-8" name="viewport" content="width=device-width"> <style type="text/css"> .txtwrapper { font-size: 16px; } .bgcolour { background-color: rgb(250,250,250);
jQuery Mobile loading accordion dynamically not functioning
I am loading the jQuery Mobile accordion dynamically via JavaScript and having it create the elements and inject the HTML into the page. Now when I do this, I don't get the styles, I don't get the theme and I don't get the functionally. It basically does not work. Does anyone know why it is doing this? let me know if you need anymore info. $('#film').attr({'data-role': 'collapsible-set', 'data-theme': 'c', 'data-content-theme': 'd'}); var sort_by = function(field, reverse, primer){ var key = function(x)
Any alternative to useFastClick?
In 1.0b1 there was the useFastClick global option. Then in 1.1.1 and subsequent releases it's gone. I'm just wondering if there's a popular alternative to get that 300ms response improvement back on iOS?
Nested list alternative now that it's deprecated
Hi all, I use the nested list functionality a lot, and I see that it is deprecated in jQM 1.3.0 (according to the docs) and will be unsupported in future releases. I'm not sure why it is being left behind, and I'm wondering if there is now a better way to achieve that functionality. What I hope isn't the answer is that they want us to switch to making ajax calls for every click. The nested list does a nice job of allowing a certain level of navigation without new web calls, and then rely on ajax
problem with changing collapsible icons
I'm using jquery 1.8.3 and jquery Mobile 1.3.0 and i have a problem changing icons of collapsible button. i can do it only once :-/ after it's stuck to the second set of icons i assigned. For example i have a collapsible set. <div id="ui_form_pa" data-role="collapsible-set" data-inset="false"> <div data-role="collapsible" id="grp_newpa_cat" data-collapsed="false" data-collapsed-icon="circle-blank" data-expanded-icon="circle"> some wall of text.... </div> </div> <a data-role="button"
Problem CSS when using Jquery
Hi, I have a really strange error. When I use some Jquery function, the css doesn't works. I give you an exemple : The first list looks good (l.16), but the second using Jquery doesn't works (l.36). Thanks ! <!DOCTYPE html> <html> <head> <title>Page Title</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" /> <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
getJSON on bind(pageshow) function returns nothing from PHP file
When sending the request from the jQuery Mobile script to the specified PHP file, nothing is returned, nothing is appended to the html file. Here's the URL of the page: localhost/basket/newstext.html?url=http://www.basket-planet.com/ru/news/9235 newstext.html: <head> <script src="js/newstext.js"></script> </head> <body> <div data-role="page" id="newstext"> <div data-role="content"> <div id="textcontent"></div> </div> </div> </body> newstext.js: var serviceURL = "http://localhost/basket/services/";
How to set data-wrapperels="div"
Hello, I am using jqm 1.3 and I am trying to set <a href="#menu" data-role="button" data-iconpos="right" data-shadow="false" data-wrapperels="div"> Link </a> but jqm implements it as a <span> I've been Googling for some time, but can't find info about it. Can someone explain me how it works or paste me a link where I can get more info? Thank you
dynamic creation of navbar
how to dynamically create a navbar with out using a static control group??
iframe width and height in percentage or responsive?
Sorry for re-posting my problem. I'll try to explain better my needs here. I "simply" need to open a popup containing an iframe using percentages. So that a popup will fill the viewport by, say, 90%width and 90%height. But I've found only samples with fixed width. How the hell can a fixed width popup fit on smaller screens? For instance, once I click the button that will trigger the popup, the popup will be sized to 90% width of the viewport and 90% heigth of the viewport. Is there a sample that
call webservice in phonegap
hello,I m getting problem in how to consume webservice in phonegap on button click. plz rlpy...
Header and Footer native browser zoom
If you specify no viewport in a JQM Page, then you can zoom in the page with the native mobile browser zoom. But if you have a fixed header or footer they will grow bigger and bigger, because they use em or something as dimensional unit. If they would be sized with the new css units vw or vh they wont grow bigger. Is there a way to tell jqm to use them ?
Autocomplete fails on sub page calls.... please help
Hi Guys, I'm currently testing the 1.3 autocomplete example. Everything works well on the initial page load but then the script fails on subsequent calls to other links on the page. I'm currently using: $(document).bind('pageinit', function () { $( "#autocomplete" ).on( "listviewbeforefilter", function ( e, data ) { var $ul = $( this ), $input = $( data.input ), value = $input.val(), html = ""; $ul.html( "" ); if ( value && value.length > 2 ) {
Fixed footer moves above the keyboard during text input
I've adopted fixed toolbar design in JQM for my mobile app using data-position="fixed" They look just fine, except that in some devices (typically Android devices), when user tap on text input box, they keyboard shows up and the footer moves from bottom of the page to above the keyboard (that is in the middle of the page) This doesn't happen for iOS though. Have any of you face this issue before? How to prevent the footer from moving above the keyboard? It would taking up too much space and left
how to trigger pageload event?
Hi all, This is what I do to register the pagecreate event: $('#MyPage').on("pagecreate", OnPageCreate); function OnPageCreate() { alert("created"); } However when I try to register the pageload event in the same style: $('#MyPage').on("pageload", OnPageLoad); function OnPageLoad() { alert("loaded"); } That doesn't work. Appreciate if someone can shed some light on the matter.
JQM iframe handling
Hi all, I'm building a JQM (1.3.0) web app and I need to include some content from external pages (php pages on the same server). I'm trying to use JQM popups but I cannot make them to work properly. It seems that I can only use fixed iframe width and height. But using fixed width/height won't work on all mobile devices, expecially when changing page orientation. Is there a sample to look at using JQM with iframe on mobile devices? The sample provided on JQM website are fixed width/height. I would
Poor performance of checkboxes in a controlgroup
I have a page with popup that lets user select the items to be displayed. Problem is, when the number of items (checkboxes) in this popup is too large (say 50 checkboxes), the page is running very slow on mobile when user trying to scroll through the list to check/uncheck the items. This fiddle gives the basic idea of how the filtering looks like. http://jsfiddle.net/UeGPn/ In actual application I used iScroll to wrap around the checkboxes so that the popup fits the height of the screen on mobile
Next Page