Jquery-Mobile-Navigation
Hello! I am almost done the design the website I've been working on but have run into an issue with the mobile navigation. It covers up the rest of my navigation, and I'm not sure how to fix this problem. Any advice or insight would be helpful. I have provided the Jquery I'm using below and here is a link to the site: http://www.giiwedinnoodin.com/index-F.html Jquery var screensize = document.documentElement.clientWidth; $(document).ready(function(){ var isMobile = window.matchMedia("only screen
Background ajax
Hi, I send an ajax request every some time with a javascript timer , when ajax call start it shows the jquery mobile loading sign. I want that ajax call to be in the background without showing the loading sign , How I do that ?. Thanks
Please advice on plaform
Hello, I am planning on creating an app aiming to the android platform and I would like some advice from users with experience with jquery mobile. My app is going to incorporate: - Google map usage - User current location - Sql database - Forms that the user will save data - user saved points (lat/lon) into the database - Geo location queries Can these be accomplished with jquery mobile and HTML5 or should I be looking directly at native android development? thnx in advance
Facing issues with Jquery Mobile and jquery ui autcomplete feature
This is the way i am using autocomplete for my jquery mobile application which is using jquery ui <input type="text" id="iamat" name="iamat" onkeypress="return nospecialCharacters(event)" required/> <div class="autoSearch_result_Wrap" id="iamatsearch" name="iamatsearch"></div> $("#iamat").autocomplete( { source: function(request, response) { var iamat = $.trim($("#iamat").val()); $.ajax( { success: function(data)
$(“:mobile-pagecontainer” ).pagecontainer( “change” not working on second time
On click of a button , i am reloading the same page this way (document).on('click', '.cancelyes', function(event) { alert('herree'); var uuid = '123'; var screen_id = '910'; var cust_id = '122'; var minimum_order = 133; var addreslabel = '222' $(":mobile-pagecontainer" ).pagecontainer( "change", "index.html?UUID=" + uuid + '&screen_id=' + screen_id + '&cust_id=' + cust_id + '&minimum_order=' + minimum_order + '&addreslabel=' + addreslabel+ '&accessedfrom=' + accessedfrom ); }); This works fine for
Automatically open filtered collapsible set items
I've created a a simple page which has a data-filter applied to collapsible set items (please see code below). The collapsible set items are closed initially. I want to be able to enter a word to filter by and have the matching collapsible set items automatically opened when they are returned? I can't find anything in the docs that will help me. Any ideas? <div data-role="page" id="page"> <div data-role="content"> <h1>Collapsible set with search</h1> <div data-role="collapsible-set"
Getting google maps latlng Array from JSON
Dear forum-members, I'm new to this forum and pretty new to JQuery and I have an issue that I can't solve by myself even after long research. Currently I'm loading coordinates into an array directly in my html-file: var AreaCoords = [ new google.maps.LatLng(48.250118898964146, 16.542320251464843), new google.maps.LatLng(48.25304504692614, 16.472831717692315), new google.maps.LatLng(48.20913525537747, 16.440147397806868), new google.maps.LatLng(48.190462182620756, 16.468437190633267), new google.maps.LatLng(48.18167250808985,
Long list demo is not working
The Long list demo in the following link is not working on Google Chrome Version 43.0.2357.124 m and Android 5.0 browser http://demos.jquerymobile.com/1.4.5/selectmenu-custom-filter/
How to capture events for dynamically created data-role=“collapsible”
Could you please let me know how to capture the events for data-role="collapsible" This is my fiddle http://jsfiddle.net/5kbEE/18/ I have tried it this way $('.my-collaspible').on('collapsibleexpand', function() { alert('herere'); }); How ever i observed that the above event is working fine in case the data-role="collapsible" is static one (http://jsfiddle.net/5kbEE/19/). Could you please let me know how to make it work if it created dynamically
Panel doesn't work on jQuery Mobile app with limited width for pc viewing
I would like to make my mobile app look the same on a pc as on mobile. So in theory it's basically enough to make the width smaller. Here's what I found on stackoverflow and used: <style> html { background-color: #333; } @media only screen and (min-width: 600px){ .ui-page { width: 600px !important; margin: 0 auto !important; position: relative !important; border-right: 5px #666 outset !important; border-left: 5px #666 outset !important; } } .ui-header {width: 600px !important; margin: 0 auto !important;}
Search Multiple Webpage URL and Display as HTML
Hi, I am normally not a back-end programmer (that's why I can't really understand programming stuff), but I am requested to develop an ios mobile app using jQuery Mobile. WIll truly appreciate it if some kind souls are willing to help me out! I am currently doing a search function, in which user should type a keyword, and the jquery script should search through 60+ url pages (pages written in .aspx, only can run using intranet) in one go and return links which contains the keyword in it. When the
jquerymobile and Cookies Law banner?
Hi all, is there a way to add a cookies banner to a site created using jquerymobile? I tried the most unobstrusive ones but none of them worked. I badly need to show a banner on all pages (until the user click the banner OK button) but I can't find one? How can I comply with laws here in Europe with jquerymobile? TIA tony
append + trigger(“create”) really slow with large DOM in Phonegap
I'm using Phonegap and JQuery Mobile to create an iPhone mobile application. This application parses an external JSON and its contents are "formatted" in the Javascript appending the corresponding HTML tags and then adding all of this to the DOM. This is done with the following: $('#container').append(output).trigger("create"); The previous code works perfectly when the data in the JSON is small and therefore the contents in the output variable is also small, but when the data is large and the
problem transition inpages
hello i complete my application PHONEGAP using JQM but i find a problem in the transition in pages every transition the screen become white befor loading pages what i should do thanks
jQuery Mobile page transfer bug - there is a ">" while new page are loading, after page loading finished it will disappear
As title, I have two pages in different .html file, the first page with a form, while click on "submit" button, submit the form to server side, then server response the second page. But I find a bug(possible) while the page transferring, that's there is a ">" on the up-left corner while the browser is in loading the second page. I don't know why, anyone can help me??? thanks!!! -- page 1 -- <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>Advice</title>
Can't get the footer to stay fixed on transition.
For the little project I am creating I need to implement the code that makes a content div the exact size between the header & footer (primarily for when using the keyboard). I have this working fine - although it is slightly out in the fiddle I have created it works in a browser and iOS simulators. The problem I have is keeping the same footer across all pages. If I use the same data-id it still scrolls instead of remaining fixed. Any ideas or help would be greatly appreciated as once over this
Loading multiple versions of jquery mobile
We have an issue where we're injecting code (not malicious, through a SaaS service) into a page and there is already a version of jquery mobile in that page with a page defined. Is it possible to load 2 versions of jquery mobile into the page? We've tried a number of things but all of them haven't worked. Here's what we've tried: Right after jquery loads, set noconflict() to our own variable (ncjq). Then, right before loading our version of jquery mobile, we: ncjq(document).bind("mobileinit", function()
jquery mobile data-transition slide not working when page is too long
Currently, I'm using jquery mobile data-transition="slide". It is working when page content is not so long, it means roughly less than 1400px(the page height), it works perfectly. However when page content is too long, slide effects does not work, link is still living but no slide effect・・・ I tested manytimes and I'm sure that error occurs depends on page length. Please please help me out of this problem.
android webview onpause, onresume
i have a problem, when my android application (webview+jquery mobile) is suspended and onresume is called after 5-20 minutes, jquery freezes - i have to restart the app, i only found this in google - but can´t be a real solution?! http://www.codedisqus.com/0JzjqWgUPj/application-freeze-when-bring-back-to-foreground-cordova-3-jquery-mobile.html
Column toggle popup not showing correctly the first time
Hi, I'm working in a jquery mobile site, where I have an ajax method that creates a table dinamically and then I use html() to add it to a div, a button renders the table each time, from 10 to 10 records, the very first time that the table is generated, the column toggle popup looks weird, right after I access #page1 but the following times, it shows correctly, when using the button, this is pretty much the code: function populateGrid() { var data1 = "<table data-role='table' data-mode='columntoggle'
Can't get any image slider to work with jquery.mobile
I've tried nearly every slider I can find, and none of them will work properly with jquery.mobile. Currently, I'm trying to get jquery.excoloSlider to work. The problem is, when I go to the page with the slider, it doesn't show. If I refresh the page, it shows and works. But when I go back to page one and start over, same thing happens. It's pretty much the same with any slider. Other sliders I've tried include Photoswipe, Swiper, Swipe, wmuSlider, Glide and others. I've tried combing through the
Get Android menu button to work while in app?
How can we engage the Android phone's menu button? In other apps, I've noticed you can press the menu button and have some options.
How can I set up an exit to close the app?
What's the best way to let the user close the app? I saw an example of an exit popup screen in the documentation, but there must be more to it than just the popup. Does some script have to be added somewhere? When I try backing out of my app, it just brings up the splash screen and then the app comes back on. Thanks for any help.
Opening a mobile app, I get an alert("Object Error")
Hi Guys, Can anybody shed some light on why I get an object error on certain devices when I open the app we have been developing? It also does not happen every single time you open the app but randomly and also not all devices experience this when opening the app. Any thoughts?
jquery mobile pageinit not firing after changepage event
I'm trying to navigate to a different .html page using I have got two HTML Pages namely one.html and second.htmml On click of button button under one.html , i am calling second.html as shown below function callPage () { $(':mobile-pagecontainer').pagecontainer('change', 'second.html', { transition: 'slide', changeHash: false, reverse: true, showLoadMsg: true }); } second.html $( document ).on( "pageinit", "#homedeliverypage",
Set min-height data-role="page"
I noticed that although I have a very small content, the height of the page is always 333px. you can set it? <div data-role="page" data-url="/Login_prova.aspx" tabindex="0" class="ui-page ui-page-theme-a ui-page-active" style="min-height: 333px;"> I work with small screens and 333px are too many. what is the best practice to change it?
jQuery mobile panel doesn't close fully only on Android browser
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.css" rel="stylesheet"/> <script src="https://code.jquery.com/jquery-2.1.4.js"></script> <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js"></script> </head> <body> <div data-role="page"> <div data-role="header" data-position="fixed" > <h1>Test Page</h1> <div data-type="horizontal"
Disable JQM styling? Text-shadow problems...
JQM is modifying a lot of elements: background, link shadows etc. I've added: <script> $(document).on('mobileinit', function () { $.mobile.ignoreContentEnabled = true; }); </script> And data-enhance="false" to my wrapper. But it still drops shadows under my menu items... How do I fully disable JQM besides for the elements I need it for?
JQM, scrolling to the top of content element from a page transition?
Using a single HTML file with multiple JQM pages is there a way on transition that I can scroll/revert back to the top of the content element when that page is transitioned too instead of the position it had left prior to the transition taking place? Thanks. PS, Apology if this is in the wrong forum (could see JQM in the options).
How to retrieve Parameters passed through Jquery Mobile ChnagePage
On click of a Button , i am redirecting to a page known as qrcode.html as shown below $(document).on('click', '.qrcode', function() { $.mobile.changePage("qrcode.html?UUID="+uuid+'&cust_id='+cust_id); }); This is redirecting to the qrcode.html page , where i am trying to fetch the parameters as shown Inside qrcode.html page $( document ).on( "pageinit", "#homedeliverypage", function( event ) { var UUID = getParameterByName('UUID'); var cust_id = getParameterByName('cust_id');
sliderstop event.
I was trying to get the change event on a slider to work and it would not file. I googled sliders and found sliderstop on stackoverflow and it works fine. I am using 1.4.5 and in the docs for that version, sliderstop does not exist. I did find sliderstop in 1.2 docs. Has that event been discontinued? If so, is there another event that I should be using? Thanks.
jquery.mobile css overriding my own css
I generated my own css via the Theme Roller app at themeroller.jquerymobile.com, but jquery.mobile-1.3.0-beta.1.min.css overrides all the background colors. What am I doing wrong?
How to prevent autofocus on first input when clicking a link on popup in jQuery Mobile
I have a textarea and a link in a jQuery Mobile popup. When I click link, textarea gets focused automatically and keypad is showing. (on ios) I wanted to redirect to another page by clicking the link, but before it redirects, keypad is showing which is not necessary as I don't want to change any text. I checked jQuery Mobile 1.4.5 demo page but it has same issue: http://demos.jquerymobile.com/1.4.5/popup/ But it seems 1.3.1 has no such issue. Please help me!!!
Button text change via click event and sending geo data
Hello guys I am new to jQuery and developing an app for a tablet with geolocations. I have a question about a button text I want to change. I have a button named vlock with the text "Lock". If I click the button the text should change to "Unlock" and the current position should be send to a msg box. So I can change the button from "Lock" to "Unlock" once! But this should be change whenever the button is clicked. also I could not get it working to send the geo data in a msg box. maybe someone here
data-rel="back" not working after upgrading JQM from 1.2.1 to 1.4.5
Hi, We are in process of upgrading our project from JQM 1.2.1 to JQM 1.4.5. After upgrading, navigating to back page stopped working. Our project is in MVC and Back button is added as below in Layout page. <a href="#" data-rel="back" data-role="button" data-inline="true">back</a> data-rel=back supposed to ignore href value, and navigate back to previous page, right? It's not behaving in this way in JQM 1.4.5, it was working in JQM 1.2.1. What am I missing here? Please someone help me to fix this...
Need collapsible widget only but custom package not working
I just want to use the collapsible feature of jQuery mobile. Using the custom download interface I selected that widget, downloaded the code (two css and one js), and installed. It's not working, tho, so I'm wondering if I'm missing another step? Another file(s)? It looks like the "picker" selects the necessary dependencies, so I assume everything I need is included in the download? http://farbest.com.s200192.gridserver.com/ingredients TIA
Change touch area for slider control?
I'm looking to increase the touch area of the slider control knob. More exactly, I want to add a padding of 10px around the knob. Is there a way to do that? Thanks!
Responsive mobile menu with jquery mobile
hello, After a lot of hours, I don`t know what to do anymore. I created a simple html page with a RMM menu. I want to use this with jquery mobile navigation. Still after a lot of tries and searching on google, i cannot find the perfect solution. //REPLACED THE CODE WITH JS FIDDLE https://jsfiddle.net/tk7kvr8d/ Can someone please tell me why after clicking on Upload foto button, the menu disappear?(I think it is a problem with the CSS)
Header Buttons
Hi, all, I am new to jQuery Mobile and I just started today. I am building a "mobile friendly" version of my desktop site and getting there very fast. However, I am not sure how to combat an issue I am having. I built my theme using the Theme Builder and I have a button in my header. All is working so far; however, the button is not centered vertically in the header and would like to know how I can get this to happen. I was considering adding some padding via CSS, but I am sure there is a quicker
Tap event on Radio Button
Hello all. I am trying to add the tap event for radio buttons widget and it does not seem to work. Can someone help me out here? The JS is here... $(document).on('pageshow', function(){ $("input:radio[name=cuisine-choice]").on("tap", function() { console.log($(this).val()); }); });The HTML is here... <fieldset data-role="controlgroup" id="cuisine-choices"> <legend>Choose your cuisine</legend> <input type="radio" name="cuisine-choice"
Next Page