Select drop down is appeared in bottom of the page
Hi All, I am using struts1.3 with jQuery. I wish to achive data-native-menu='false' for good view. Following this code, the drop down options are displayed not really below the component. Its showing bottom of the page. What is wrong in this code? Pls.. <label for="select-choice-1" class="select">State</label> <div data-role='fieldcontain'> <select data-native-menu="false" name='stringselect' id='stringselect'> <option data-role="none" data-placeholder='true'>Choose
Small Problem with responsive column toggle table in JQM 1.3.1
Hi, when I have a responsive column toggle table (eg as in http://view.jquerymobile.com/1.3.1/dist/demos/widgets/table-column-toggle/) and resize the window to make it smaller until a column is hidden because of a breakpoint reached and the make the window wider again the now hidden column does never come back (try it on the mentioned demo page!). Reason IMHO is that in the self.update function starting at line 10913 in the 1.3.1 distribution first if (this.checked) is true (because this is the default)
dynamic grid?
Hi all, I need to create a dynamic grid that will display data coming from a mysql databse. I need to loop the database records and create the grid dinamycally, but how can I loop a five-column grid? I'm using dreamweaver cs6 and a php-mysql server model. TIA for any idea or suggestion. tony
JQM page refresh
when i navigate from one page to other by data transition slideup..i want to refresh the entire page. how do i get it done....
how do I managed to drag the image to the side?
put an image in my application, but I can only move it up and down. I can not move it to the side.
Swipe between pages
Hello, I have a page that shows a listview and each item in this listview when clicked will show its content in a new page. The same is applied to the rest of the listview items their content will be shown in a new page. But the page showing the content of each listview is the same for all. Meaning there is two data-role="page" divisions in the html document. One to show the listview and the other appends data to its content division. The way data is appended is by using a webservice that takes from
So stressed: Template for JSON + Phonegap not fully working, flicker
Hey all, After DAYS of trying to get this to work and no luck I've thought I'll try get some help. What I'm trying to do: Phonegap + jQuery Mobile app (Done) On selected pages pull html data from my wordpress website using the json API plugin. Steps I want include: Opens app, user navigates to a page, once the page is shown if the device is online start to pull data and show it, if its offline alert the user with a message and have a refresh button to try again (maybe the users 3G dropped out for
undismissable popups dismiss
I thought I would explore pop ups to replace a dialog widget that I am using. But it needs to be undismissable. I tried the undismissble demo at http://api.jquerymobile.com/popup/ but as soon as I clicked outside of the pop area the pop up disappeared. What gives?
responsive panel demo broken / how to keep a panel open on a large window
Is it just me, or is the following demo broken (I tried in Chrome / Firefox on Mac and IE on Win 8)? http://view.jquerymobile.com/1.3.1/demos/widgets/panels/panel-fixed.php I am trying to build a website that uses a left side panel menu. When the page is open in a large window (on a computer) I want the panel to stay open. When the page is open on a small window, I want the menu to be closed until the user opens it. It sounds to me like I should be able to just add class="ui-responsive-panel"
stop immediate propagation
I have a question concerning this piece of code: $(document).ready(function(){ $(document).on('slidestop',function(event, data){ event.stopImmediatePropagation(); }); }); It is meant to prevent double triggering by slide menu. Does it matter where in the code it is placed ? It is not restricted to one slider, but affects all the menus of this kind, yes?
Changing data-theme of Collapsible listview
Hi, i want to change the data-theme of a collapsible listview programmatically. <div data-role="collapsible" data-theme="b" data-content-theme="d" id="benutzer-div"> <h3>Benutzer</h3> <ul data-role="listview"> <li><a href="#sitzung" data-transition="fade">Sitzung</a></li> <li><a href="#messenger" data-transition="fade">Messenger</a></li> <li><a href="#benutzer" data-transition="fade">Benutzerübersicht</a></li>
Refreshing dynamically generated listviews repeatedly not working
I am new in jQuery Mobile, and I am starting to develop an app and I am running into a problem of refreshing dynamically generated listviews. I have checked extensively on the net for solutions, and I have tried a lot of suggestions but with no success in my app. I have two pages. The first page is to choose a tournament, and in javascript I will open the second page which has the following (simplified) structure: <div data-role="page" id="pageAutoDiv" data-theme="a" data-add-back-btn="true">
Jquerymobile 1.3.1 rounded corners not displaying properly on blackberry 5 to 7
With jquery mobile 1.3.0 and 1.3.1 rounded corners are not displaying properly on Blackberry 5 to 7. This is also evident with form elements, such as buttons, sliders etc. Please look into this.
dynamic page navigation using $.mobile.changePage and History
Hello, I have been trying to fix this for days and I could really use some help please. I have a simple database driven app; pages are loaded dynamically from a Mustache.js template using data from a database. The result is a jQM Page object which I call $.mobile.changePage(obj) on... Each page is the same, it has a listview. The listview objects point to other pages (which are themselves dynamically injected). The listview href url is #id (id being the id in the database to query) and this is working
Firefox fixed header jumping
Hi All! I have such a code: http://jsfiddle.net/twEJ4/2/ When I test it with my firefox in my test page I see the fixed header of page1 jumping after the back slide animation from page2. It is ok when I test in jsfiddle, also it is ok with webkit browsers. Why the header jumps to its place at the end of slide animation with back link?And it appears in the same place.
collapsible auto expands on entry page
I added a collapsible list as menu to a small website with just a few pages. It all works fine, but always when i go to the first page that i opened with my browser, the menu does not collapse, but stays expanded. The menu is in an extra file and included, so it is the same everywhere. It also does not matter which of the pages i use as entry page. I tested it with several android mobiles. Is this a know problem or even a wanted feature?
I want to know js and css file import order
Hi, I am developing jQuery with struts1.3. Below list of files i imported. Some of the case page is not displayed as perfect. What i doubting the order of imports. Please tell me, what is the exact order to import js and css. Core jquery files and Mobile items files <link rel="stylesheet" href="./jmobile/themes/gray.css" /> <link rel="stylesheet" href="./jmobile/css/jquery.mobile.structure-1.2.0.min.css" /> <link rel="stylesheet" href="./jmobile/css/mobileStyle.css"> <script src="./jmobile/js/jquery-1.9.1.js"></script>
Add to Home Screen iOS/Android
Can anyone recommend the best method to get users to "Add to Home Screen". I've built a mobile site with JQM and now want to remind users to add it to their home screen on iOS and Android phones. Seems like most people don't know this can be done. I've found this script, and input on using it or is there a better approach for JQM? Thanks! http://cubiq.org/add-to-home-screen
Help with navigation
Ok I'm at my wits end and this is the last issue that needs to be resolved before we can roll out the initial version of our dedicated mobile app. I have a page in our mobile app (courses.html) that internally transitions between several jQM "pages" all the while programmatically setting lists with data. Flows like this: courses.html -> List of terms (#terms) -> List of disciplines (#disciplines) -> List of courses by discipline (#courses) -> List of classes by course (#classes) -> Class Info
when i added jquerymobile i "lose" my orignal z-index
before added i could click on the checkbox and it worked but now i can't when i click on the checkbox it click on the link_show'. how i can fix it? Example: <a href="{{ path('link_show', {'id' : item.Id}) }}"> <div id="a"> <div id="b"></div> </div> <div id="listado_hipotesis_preferido"> <form class="gf-form" method="post" action="./"> <ul class="gf-checkbox"> <input data-role="none" type="checkbox" id="checkbox-1" /><label for="checkbox-1">
Best way to load a page...AJAX
I am new here, and I am reading the docs and getting some online tuts to work on my stuff. I've done a lot of stuff, but I have this simple doubt. Whats the best way to load a page dynamically? I am trying to do this: $('#page2').click(function(){ $.ajax({ url:'page2.html', success: function(data){ $('.content').html(data); } }); }); And this: $('.menu').click(function(){ var ref = $(this).attr('href'); $('#content').load(ref).fadeIn('normal'); }); As you can see, I wanna let a default page with
disable ajax
you can disable ajax using pagechange something like this: function comentario(val){ $.mobile.changePage("comentario.php", { type: "post", data: { value: val }, transition: "turn", reverse: true }); } <a href='javascript:comentario(2)' data-ajax='false'>comentario</a>
JQM Javascript is not been used
I have search in the forum for the answer, found some stuff but its still not working. In the first page(index), i have inserted the javascript into the data-role="page" ... <div data-role="page" id="swipepage"> <script src="js/myjs.js"></script> ... i have included alert to check if the javascript is been used. scontent is the div id where this code will work alert("no ficheiro"); $(document).on("pageinit", "#scontent", function(){ alert("scontent"); //The code of the second page
listview filter reveal min lenght?
Hi all, I really like the JQM 1.3.1 filter reveal option and I need it to filter a php-mysql query. It works perfectly but it begins to show results as soon as I type something. That's ok with the default behaviour of the filter. But I need to enable the filter once the user has typed at least 4 characters. Is there a sample that show how to do this in a php-mysql environment? TIA tony
jQuery Mobile dynamic page event
Hi, I am created a dynamic page using jquery mobile, how to get an event after create this page and i need an alert from this button this is my code: $("#test").on('click',function(){ var newPage = $("<div data-role=page data-url=testpage><div data-role=header><h1>TEST</h1></div><div data-role=content> <input type='button' value='clic kMe' id='click_me'> </div></div>"); newPage.appendTo( $.mobile.pageContainer ); $.mobile.changePage( newPage ); });
How to prevent jquery.mobile-1.3.1.js autoscroll the whole page with 4 lines
I am experiencing auto scroll behaviour after page load when i am using jquery.mobile-1.3.1.js. If I remove the script this does not happens. What to do? Environment= ie 10 and in a aspx page. Uses the flip toggle switch,http://api.jquerymobile.com/slider/
div data-role navbar leaving space to the far right
I added a nice navbar to my app using <div data-role="navbar" data-iconpos="right"> and then using ul,li tags to create a visually pleasing footer nav. However, to the far right there is a small vertical line about 4px wide that I don't want to appear. It's not a big deal and doesn't impact functionality but it has been driving me nuts... it's all I can look at now because I'm crazy. Has anyone else run into this? How can I get rid of it?
How to autohiding the header and footer bars in jquery mobile?
can anyone tell me how to autohiding the header and footer bars for the large content in jquery mobile? And also another one how to disable the vertical scroll in iphone mobile using jquery mobile?
form submit on iPhone 3G won't work
Hello all, i am really getting frustrated. The following HTML- form submit code won't work on iPhone 3G (iOS 4.2.1). For now I have no idias why. Tried also some suggestions fount with google, but it just won't work. fyi: - The same code work fine on iOS6, Android, and desktop browsers - js alert does work on iPhone 3G (iOS 4.2.1) (tested it with simple a href) What I already tried: - update to newest jquery-mobile - get form by submit - get form by name Do anyone of you have any idea what
Theme Problem?
How to Fix this? my data theme is gray but it has white. How to fix in css???
How i can use swipeleft and swiperight in JQM 1.3.1?
Hi, i have some problems with the use of swipe in my app . I have a div : <div class='box'>Content</div> I would create some actions when a user swipe left on the element, so i create this simple script: $( document ).on( "pageinit", function() { $( document ).on( "swipeleft", ".box", function( ) { alert($(this).html()); }); }); This is the onlyone script that work for me but when i swipeleft on the element the alert appeare three times? Why? Thanks for help !
Automatic redirect to first page even after changePage in Google Chrome
Hi, I have a problem with a jqm app, it seems a jqm bug with Google Chrome. I've made a concept proof with just a bit of code here: http://www.net-monsters.com/demos/jqm/foo.html As you can see, at the pageinit event, it just declares a sample object "foo" and instances it, after that, it redirects to a dialog page "#page2" The problem is that, though the code redirects to #page2, it finally ends at #page1. There are three "solutions" by now: 1. wrap the changePage in a setTimeout function ( really
DOM elements don't get refreshed in pageinit/pageshow event after navigating using $.mobile.changePage with reloadPage=true
I have got two html pages each containing JQM page. If I move from Page1 to Page2 (by clicking the button in the example using $.mobile.changePage with reloadPage=true) and then move back to Page1 then assigning any value to txt1 textbox (inside the pageshow event) doesn't work - textbox remains BLANK. However in the second trip (i.e. Page1->Page2->Page1 using button click) it works. Code example is here: Page1.htm <!DOCTYPE>
<html>
<head>
<title>Page-1</title>
<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>
Jquery Mobile and jquery ui datepicker
Hello, I am using jQuery Mobile 1.3.1 with jquery 1.9.1 and jquery ui 1.10.3. I am using a multi-page template for the application. On the index page I am loading the required JQM css and script files. Infact all my html pages have the same script and css files loaded. On a certain page I want to display a datepicker, so, on that page I load the jquery ui css and script files along with the JQM files. The datepicker shows up only when I give data-ajax="false" on the anchor tag the loades this page.
Current Market Share Numbers of jQuery Mobile
Good day! Currently, I am writing on a paper for my university and I am looking for current market share numbers of jQuery Mobile. Unfortunately, the only source I found on the internet is from 2011[1]. Does anybody have current numbers? Thanks! Greetings [1] http://trends.builtwith.com/Reports/Mobile-Web-Technology-2011/Mobile-Web-Technology-2011.html
Sliding submenus
Hello, I tried searching for this, but I couldn't find any answers; sorry if I missed something. Anyway, here's what I'm hoping to do: I have a listview populated (via ajax) with comments. I'm hoping for it to be able to do two things: Respond to a tap/click by loading replies (already implemented). Second, I'd like the user to be able to swipe the <LI> from right-to-left to reveal a sliding panel with other options pertaining to the comment; this panel only covers the comment list item (give
Jquery Cookies
Im creating a mobile apps using Icenium(html,css,jquery mobile,java script). One of the features of my apps is to have a save username and password of persons who log-in. and many said it will work using plugin. But i tried many plugin but it didnt work. Is there anything you can help about my problem?a example of simple code when use cookies taht will work in my apps. Hope you can help me. Thanks
Jquery Mobile 1.3.1 on code.jquery.com?
Hi all, I was just wondering if JQuery Mobile 1.3.1 will be on code.jquery.com soon? Thanks!
Any issue using PHP INCLUDE for the head section ?
Hi, Ok, so I've got a site up and running (Using individual html files/Not multipage) Would there be any issue with jquery if I used a php include for the head section of each page, placed just below the title tags? Example: A file called head.php <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <link rel="apple-touch-icon" href="images/apple-touch-icon-iphone.png" /> <link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-ipad.png"
A nice image display/gallery method? (Not Flexslider)
Can people suggest some nice ways/scripts for displaying images other than flexslider? I've tried to get it to work (As posted here) but can't...and it's stopping me developing the rest of the site. I've still got flexslider running LINK REMOVED but you have to refresh the page for it to load and I can't manage a fix. PS: It does load if you visit that link directly...Annoyingly. Something that either flicks through images via touch or click, or something that displays x amount of images all displayed
Next Page