How to make JQM to an downloadable app
Hi, I am sure this must be one of those baby footstep questions. Say I have am having an jQM + php + Db(JPD) built application fully functional. As of now, there is no device specific features that this application is depending upon. If I type web URL it works in the smart phones. Now if I have to provide this as downloadable app is it possible and where should be the cut-off, I mean all processing are done at the server side. (basically nevertheless to say php generates the rendering JQM scripts).
ajax loader gif garbled
help: my ajax loader gif is messed. I copied a replacement to the 'css/images' folder but still looks garbled.
jQuery Mobile modal dialog window doesn't submit correct with Begin.Ajax
i have some problems with a modal dialog in my jQuery mobile / mvc 2 application. when submitting the modal dialog the returned view opens in main window and not as expected in modal popup. my modal dialog is implemented as an aspx page that looks like this: <%@ Page Title="" Language="C#" Inherits="System.Web.Mvc.ViewPage<Models.ContactData>" %> <div data-role="page" id="Contact"> <div data-role="header" data-theme="a"> <h1>Contact</h1> </div> <div data-role="content" data-theme="a"> <% Html.EnableClientValidation();
how to make a request when i leave a especific page
hi all, i need to do a request when i leave a especific page in jQueryMobile, can i bind a event of jQueryMobile to do that? or have another way to do it? thanks!
Is there a max length on data-url parameter?
Just launched update to our mobile site with JQM ver 1.1.0 and jQuery ver 1.7.2! Is there a limit to length of data-url? Here is our value and it is throwing Javascript error: Error: Syntax error, unrecognized expression: data-url='/FlightStatus/ShareDetails?CarrierCode=UA&FlightNumber=1&Origin=IAH&Destination=HNL&DepartureCity=Houston%2C%20TX%20(IAH]&ArrivalCity=Honolulu%2C%20HI%20(HNL)&DepartureTime=9%3A41%20AM&ArrivalTime=1%3A01%20PM&DepartureDate=Mon.%2C%20Oct.%201%2C%202012&ArrivalDate=Mon.%2C%20Oct.%201%2C%202012&MarketingCarrierCode=UA&OperatingCarrierCode=UA&MarketingFlightNumber=1&OperatingFlightNumber=1')
Download builder, swipe events and mobileinit
Hi all, At this stage in my project I only want to use the swipe events of jQuery Mobile. I've used the download builder with just the default options ticked, and that gives me the events required. However I am trying to modify the value of $.event.special.swipe.horizontalDistanceThreshold as I find the default value doesn't suit my needs. But it appears that this property needs to be changes within the mobileinit event which doesn't get fired at all. I have my scripts included in the correct order
How to iterate a Map in jquery?
Hai, I am using Jquery Mobile, Spring3 mvc. I have the problem with iterating the loop.....the following is my code in Controller class : Map<String,List<String>> test=new HashMap<String, List<String>>(); List<String> temp1=new ArrayList<String>(); int i=1; for(DoMenu l:menuList){ List<String> temp=new ArrayList<String>(); temp.add("submenu "+(i++)); temp.add("submenu "+(i++)); temp.add("submenu "+(i++)); test.put(l.getMenuId().toString(), temp); } model.addAttribute("test1",
Exclude header and footer from popup overlay
I would like my header and footer to be accessible when a page has an overlay due to a popup menu (as seen on http://jquerymobile.com/branches/popup-widget/docs/pages/popup/index.html). So in a nutshell, only the div with attribute 'data-role=content"' should have the overlay applied. How can I achieve this?
Display Dialog Box of size according to its textarea content
Hi, I have a Jquery mobile dialog that contains a textarea inside it. I will open the dialog box with some contents inside the text area.The issue I am facing here is that once a dialog box with a large content inside text area is opened and closed and after that even when I open a dialog with a small text area content its size is not altered. The dialog size remains the same as for the previous open with a large content inside text area. How to make the dialog size adjust according to the
Preventing auto-fill function of browser
Hi, I am trying to prevent auto-fill function of browser on Android 2.3.X. I can make it work on Chrome browser of my PC, but the code doesn't seem to work on Android mobile. Could you tell me how I can make this script work? How shall I re-write the script? Thank you very much for your help! function setVals() { $('input:-webkit-autofill').each(function(){ var text = $(this).val(); var name = $(this).attr('name'); $(this).after(this.outerHTML).remove(); $('input[name='
Jquerymobile - lost data on browser back button
Hey guys, I'm making an app webview for iPad using aspx .net. The page is simple, basically I have some fields for search, the button "search" call the C# method and it fetch a repeater using the listivew style of jquerymobile. The user clicks on link to go to detail page and the C# fire a postback, hidden the results div using display=none and show other div for details. When the back button is pressed, Chrome and Safari lost the results data (only FF save the results). I tried put parameters
ajax navigation to page with dynamic listview
Hi I would need some help on the follwing scenario: I have a page which calls a second page (no multipage template). On this second page I have a listview which is dynamically populated (from a webservice call). function loadSPTasks() { $.getJSON('/SIGProto/_vti_bin/listdata.svc/Aufgaben', function(data) { $.each(data.d.results, function(i, result) { html = "<li><a href=\"" + result.Pfad + "/DispForm.aspx?ID=" + result.ID + "\" data- ajax=\"false\"><h2>"
[SOLVED] Why does the dialog close button knock me back to my main page sometimes?
I have an application with two main pages (a login page and a map page) that spawn dynamic pages to be used as dialogs, most of which have sub-pages, in a chained dialog structure. So a perfectly normal course of action would be: Login -> Map -> Dialog -> Sub-Dialog Originally, I was moving from Map to Dialog using a button on the interface that looks like this: <a href="#dialogID" data-icon="arrow-r" data-iconpos="right" data-rel="dialog" data-role="button" data-theme="b" class="ui-btn-right">Info</a>
leaflet cloudmade and live pageinit
I use maps from the leaflet cloudmade and for them to be displayed correctly when I load the page, I get to use $ ('# MyLocation'). Live ("pageinit", function () {, the first map is loaded properly but I can not get the second map to display correctly, it just gets a little bit visible. Looks like $ ('# mylocation1'). live ("pageinit", function () {does not work the second time. Grateful for the tip! <!DOCTYPE html> <html> <head> <title>Kartfunktioner</title> <meta http-equiv="Content-Type"
Load script before document load
I'm trying to address the issue with Facebook OAuth as described at the bottom of http://jquerymobile.com/test/docs/pages/page-navmodel.html. On a registration page I have a "Sign in with Facebook" button. When I click it I get a "Page Load Error". Added to the registration page: <div data-role="page" id="register"> <script> $("#register").live('pageinit',function() { if (window.location.hash == "#_=_") window.location.hash = ""; }); </script>
collapsible structure not getting displayed under dynamically modified collapsible set
I have a collapsible set as mentioned below to which i dynamically add several collapsible's which also contain dynamic content. The issue is that I add collapsible structure to the collapsible set first and then add dynamic content to that collapsible structure. After adding the content to that collapsible I modify as below $("#struct0").appendTo( ".ui-page" ).trigger( "create" ); where struct0 is the id of the dynamically created collapsible.This helps in jqm applying styles to that collapsible
Jquery lightbox implementation for Images and youtube without 3rd party plugins
Hi , I am trying to implement a lightbox effect to my images and youtube video, but i dont want to use a 3rd party plugin. Is it possible to do that in JQM and how? Thanks in advance,
Epic reading in the source files
Hi. It's nice to see that we (as in users of JQM) is not the only one that can get frustrated from time to time. These was found in the comments in 1.2.0-RC2: // TODO sweet jesus we need to break some of this out //append to page and enhance // TODO taging a page with external to make sure that embedded pages aren't removed // by the various page handling code is bad. Having page handling code in many // places is bad. Solutions post 1.0 // TODO sort out a better way to track sub pages of the listview
Navigating into nested list
Hi , I have a nested list and the elements within nested list link to pages which are in a tabbed format like Homepage (List)--->Nested List(HREFs to pages)---->Tab1 | Tab 2 | Tab3 Href1 Href2 Href3 Now the issue is when i reach my tabbed pages ,i need to have a back button in header which navigates into nested list directly. If i just try a normal "back button" , it will lead me
heading style inside LI problem
inside LI heading H1..H5 receive class='ui-li-heading' and show same size and style on screen! why? but outside ul/li work it perfect! how can i used heading Tags inside Lists with normal font-size?
Ajax and Jquery Version problem
Jquery version 1.7.2 is not supporting .ajax function, but when i use jquery 1.2.6, ajax method is working. but i need to use jquery 1.7.2 in my applicaiton, because if removed that my jquerymobile styles are not getting applied. how to solve this issue
Select tag problem in 1.2.0 RC2
When I try to get html select tag using alert(this); It returns [object HTMLSpanElement]. In previous its working fine. Please help me ASAP. Thanks in advance.
Select items in listview
Hi, I'm new to the JQM world and have gotten stuck on how to select one or multiple items in a listview and have the selection by "sticky". In the attached snap, I'd like to maintain search, the autodivider, the styling for the items when deselected and hovered over, but remove the right arrow (I have no underlying pages). I want to be able to tap a list item to select it and change the background color to indicate it's selected. Multiple items may be selected and remain selected. Basically, each
Newbie Requires Help - Changing Active Color For Touch State of Mobile Users
Here is my jsfiddle: http://jsfiddle.net/Wgajs/4/ I don't know how to achieve the same effect using jquery, when a user presses the button/link with their fingers. I've read part of the website but find it very confusing and don't know what to look for? The reason I require jquery (I think) is because this effect does not work properly on Android mobile web browsing. When you scroll down the page and touch a link, the highlighted green color (active css state) gets all buggy and only shows partially,
Is there a way of displaying alerts?
I want to display an alert to the user after some basic bounds checking on an input field. Something like: "Hey you can't enter a negative value for age" or "Your age must be a number between 0-120".or "You left this field blank" Is there a "jQuery Mobile way" of doing this? I was thinking about just using a footer toolbar with a div that could be updated with an alert. Looking through the documentation, I thought about using a dialog box, but that would be over kill because I don't want to display
Is the id attribute required for <div data-role="page"> when using the Single Page Template?
I am currently using the single page template system (one div data-role="page") per page on my site, and I have not been specifying id attributes for each page. Should I be doing this? When I was reading the documentation, it seemed like it was only necessary for multi-page templates. I'm seeing some odd behavior when binding to the pageinit event and was wondering if omitting the id attribute is the reason why.
Way to get different size for each navbar item?
Hi, I'm trying to get my nav-bar to have one item that is only the icon (for space issues). Here is the code I'm using: <div data-role="navbar" data-iconpos="left"> <ul> <li> <a href="/cgi-bin/links/page.cgi?t=mobile_en" data-theme="" data-icon="home"> Home </a> </li> <li> <a
jQuery Mobile styles being applied on even numbered page visits. Weired ajax behavior
Alright, admittedly there are a lot of words here, but this is a problem I've never seen before, and quite a peculiar one at that. So, it will probably be worth the read. I have a page that dynamically produces Listviews in response to a link clicked from $.mobile.autocomplete. The listview has two types of <li>'s, and are themed accordingly and have a class set accordingly. Lets call them l-1 and l-2. When I click on l-1, what should happen is the following: That listitem toggles a class that gives
How do I preenhance other pages?
Hi. When I'm using a mulipages, how to I enhance some of the other pages? I start at the 'startpage' but how do I enhance the other pages that hasn't been displayed and therefore enhanced yet? As I have a natural flow in my mobile web app. I would to to preenhance some of the other pages in order to minimize the transition to these following pages. My next question is how do I avoid JQM trying to enhance an allready enhanced static page? Kindly regards Ruffio
Newbie in jQuery Mobile
Hello, i have a trouble with my project html files. It's the first time I am developing in this technology. I have a problem making a link to a window in another HTML page on the same servir. Always shows a error "error loading page". Does somebody help me? Thanks
Form troubles.
I have a page that contains a form. Form other pages i call the form like this: $.mobile.changePage('pages/frm1/frm1.html', {transition: 'slidedown', role: 'dialog'}); So from page1 that is located in root/ i call it like this: $.mobile.changePage('pages/frm1/frm1.html', {transition: 'slidedown', role: 'dialog'}); from page 2 that is located in root/pages/test/ i call it like this: $.mobile.changePage('../../pages/frm1/frm1.html', {transition: 'slidedown', role: 'dialog'}); Everything work great...but
Help me Web -JQM
I developing one web-JQM but with the following error: I have one page that displays a list of products, our style paging swipe, showing off different slide is ok. but when I click the link to go to the other, the old html tags and it still displays the first page (first slide) can not swipe anymore (when I F5 page, it runs properly but I do not want that). Please just help me.
Chain Select Menu Not showing data on mobile devices when use data-native-menu="false"
Hay i have a problem in my jquery mobile sites. i have three drop down first related to country 2nd related to states and third is city. when i select country then relative states of thus country should be shown. this thing working o my lical server(desktop) but when i upload the site on server and access it throw mobile device countries are there and i can select them . but states are not showing (Remeber I am using data-native-menu="false" ). function getStates (cid) { $.ajax ({ type: "POST", url:
Restrict number of characters entered in textarea in JQuery Mobile Dialog
I have a textarea inside a dialog in a Jquery mobile page. How do i restrict the number of characters entered the textarea to a specific count.The maxlength attribute specified doesn't seem to work for the text area.
JQM 1.2RC2 Dynamic Page Generation:browser refresh loading wrong page
http://jquerymobile.com/test/docs/pages/dynamic-samples/sample-reuse-page.html The example is exactly the stuff I am using when you click an item you go to the next page : http://jquerymobile.com/test/docs/pages/dynamic-samples/sample-reuse-page.html#category-items?category=animals But since JQM1.2RC2 (ok, last used for me was the 1.2alpha so might have changed a bit earlier) when you refresh (browser refresh) it shows the "main page" and not the list #category-items?category=animals where I expected
Refreshing nested listview causes corruption
Summary: multiple calls to listview('refresh') causes the child items of the nested list to be wrongly associated with the parent (using 1.1.1 with jq 1.7.2 and no other plugins). Details: The parent list is 50+ names. When clicked/tapped, each name opens to a nested list with email, phone and other personal details. The list of names is generated dynamically. Building the listview works fine if there is only one call to listview('refresh'). To give a little quicker feel, I had wanted to do a refresh
Events on collapsible: click, collapse, expand: which order are they triggered?
Hi all, I have a collapsible div, whose header is divided in two parts. The first one is the standard header text, the title of the collapsible. The second one contains, for reasons that I can't control (it is required to be like that), an input type text. I need to make the collapsible behave like this: - if the first part of the header is clicked (the title text): standard behavior (expand/collapse) - if the second part of the header is clicked (e.g.: focusing the input text): default behavior
Why don't I see my scaling anymore when using jqm?
Spend 2 whole evenings now, am not seeing where I go wrong: When navigating from my main page to a dialog and back I lose control over elements on screen. What am I doing wrong? My -stripped- code looks like this (test.php): <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" /> <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
does jquery mobile work for a single page that is meant to be displayed in a frame?
My portion of an app. only has control (and lives within) a frame that another document controls (and I don't have access to). I'm a newbie to jquery mobile, and I tried to create a minimal interface for this new 'mobile app' within this frame, but the framework does not seem to be doing its job (in the sense that it does not appear to be detecting the fact that I'm viewing the site with a mobile device, so the header and footer of this minimal page appear as they would when viewed using a desktop).
Please help
Hello, I am developing a web application that calculates the level of a task, I used HTML5 and jQuery Mobile I've developed a list-view links to other php file in php passing a value, as follows <li> <a href = "golpes_especiales.php? value = 2 & acu = <? php echo $ acu;?>"> It tries poscionar casual </ a> </ li> In the gathering via php I Get the parameter value and also adding: <? php $ value = $ _GET ['value']; $ acu = $ _GET ["acu"]; $ acu acu + $ = $ value; ?> php is a final file shows these
Next Page