Questions tagged [jquery-mobile]

Revolutionizing the mobile experience, jQuery Mobile stands as a powerful framework designed exclusively for smartphones and tablets. With its touch-optimized features, it elevates user interface to unparalleled levels across various cutting-edge mobile platforms, all proudly built on the foundation of jQuery.

Using jQuery Mobile alongside two distinct versions of jQuery

My current task involves inserting both jQuery and custom JavaScript into the DOM of an existing page. The jQuery is inserted right before my script, where I utilize window['my$'] = jQuery.noConflict(true);. This approach worked smoothly after ...

Hide Address with Jquery Dialog Box

How can I securely redirect a user to another page within the same website? In my specific situation, I have a form where users input information. For cancellations, they should have options available. When a user clicks the cancellation button, a dialog ...

The true screen resolution of Safari on iPhone devices

I'm feeling a bit lost right now. Currently, I am using Jquery Mobile and here is my code: <meta content='width=device-width, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no' name='viewport'> When I ran the following line of code: alert(Dat ...

Click the link to find the JSON node that corresponds to the onclick event

After parsing JSON, the JS code below is returning a list of movie titles for me. Each movie title node contains additional attributes and values that are not currently being displayed. My goal is to have the other values in that specific node displayed wh ...

Developing a Form Submission Feature Using JQuery Mobile

I'm having trouble submitting a form using JQuery Mobile. Currently, my code looks like this: <form action="#pagetwo" method="post" name="myform"> <input type="text" name="myname"> <input type="submit" value="submit" /> ... and th ...

How to ensure the table fits perfectly on the screen using JQueryMobile and Cordova?

I've been working on a JavaScript function that creates a dynamic page and displays data fetched from a database. However, I've encountered an issue where the displayed data overflows past the width of the mobile screen. Is there a way to ensure that the ...

Issue with Jquery Mobile listview not showing up

I'm currently working on a PhoneGap application using jQuery Mobile, which consists of four main sections, each with its own HTML file. The issue arises when navigating from one section to another; for example, if I load the main.html page first and then c ...

Tips for closing a popup without exiting the entire webpage

I'm facing an issue while trying to create a video playlist using two HTML files (index.html and video.html). In my video.html file, I have set up a popup for playing videos. However, whenever I close the popup or click anywhere on the page, it redire ...

Credit for the Position swipejs

After integrating a swipeJS photo slideshow into my jQuery mobile application, I encountered an issue. I am trying to create points for counting the pictures similar to what is seen on this page: Although I have added the necessary HTML and CSS code to my ...

Tips for removing borders from the AJAX Loading icon in jQuery Mobile

Is there a way to remove the borders from the default jQuery Mobile loading icon? I am attempting to call the ajax-loading.gif icon before any page creation. $(document).on('pagebeforecreate', '[data-role="page"]', function () { $.mobile.lo ...

Issue with $_SERVER['PHP_SELF'] not functioning properly

Apologies if this question has been asked before, but after searching extensively I couldn't find a solution. Therefore, I am posting here... The issue is that I'm trying to submit values on the same page (using jQuery Mobile UI) and I have used $_SERVER[ ...

JQuery Mobile fails to apply consistent styling to user input check items within a list

I have successfully implemented the functionality to add user input items to a checklist. However, I am facing an issue where the newly added items are not adhering to Jquery Mobile's styling. Here is a screenshot showcasing the problem: Below is th ...

Can the default jQuery mobile ajax loader be triggered automatically when making a $.post() call?

Similar Question: Displaying Spinner on jQuery Mobile Ajax Call Is there a way to automatically trigger the default jquery-mobile ajax loader when using $.post()? For example, can I set up a global configuration for this behavior? I came across this ...

Unique background image for every individual page

For my mobile app development using Jquery Mobile, I have implemented a custom theme but now want to vary the background images for different sections. My current code looks like this: .ui-overlay-a, .ui-page-theme-a, .ui-page-theme-a .ui-panel-wrapper { ...

Leveraging JSON Data within the ASP.NET MVC Framework

Being new to this, I am in search of guidance. Currently, I have set up an ASP.NET MVC4 (beta) Mobile project and I am faced with the task of consuming a series of REST APIs. The data from these APIs is provided in JSON format. Could you please provide m ...

Looking for a way to prevent a div element from scrolling in JQuery Mobile?

Here is my implementation: http://jsfiddle.net/coderslay/Lhb5Y/ I have content structured like this: <div data-role="content"> <div><!--Contains a button --></div> <div><ul>..<!--Contains a list -->...</ ...

Positioning a text field and a button adjacent to each other within the same row

My challenge is to consistently position a textfield and a button side by side. The requirement is for the button to always be on the right side of the screen, while the textfield should take up the remaining width on the left side. I initially tried setti ...

Enabling external ajax requests in an Android Webview with jquery mobile capabilities

I am working on a javascript/HTML application using jquerymobile that makes ajax requests to a remote server. While the app functions properly in Chrome (with web security disabled), embedding it within the assets/ directory of an Android application (a ba ...

Tips for adjusting the height of a selection box in jQuery Mobile

I am trying to make the select box height the same as the label (模板分類:). <select id="TamplateClass" style="height:1.5em">...</select> you can use CSS #TamplateClass{height:1.5em;} However, no matter what I try, the results are all th ...

Utilizing $.each to dynamically add data to a jQuery Mobile listview

Trying to implement a data reading mechanism using ajax resulted in unexpected html tag generation for <ul> <li>. The code snippet is as follows: (function( $, undefined ) { $(document).on("pagecreate", ".jqm-demos", function(){ ...

What are the steps to perform an Ajax request to an online web service?

I would like to send an AJAX request to an external web service using jQuery. However, I am encountering an error and unable to receive a successful response from the server. var url = "http://www.example.com/api/convert"; var requestData = { temperat ...

most effective method for recycling dynamic content within Jquery mobile

My jQuery mobile app has a requirement to reuse the same content while keeping track of user selections each time it is displayed. I have successfully created the necessary html content and can append it to the page seamlessly. The process goes something ...

SwipeJS is not compatible with a JQuery-Mobile web application

I am currently attempting to integrate SwipeJS (www.swipejs.com) into my JQuery-Mobile website. <script src="bin/js/swipe.js"></script> <style> /* Swipe 2 required styles */ .swipe { overflow: hidden; ...

Interaction between Javascript and PHP is only triggered upon the second click

Despite my efforts to find a solution, I've been facing some challenges... I'm currently developing a mobile hybrid app. The user is required to input their ID number, which is then sent to a javascript function for validation. Following this, a jQuery.ge ...

Invoke a function immediately after the application has finished loading (using both jQuery mobile and PhoneGap)

Currently, I am facing an issue with my application (built with jQuery-mobile and Phonegap). The problem lies in the need to execute a function that makes an ajax call returning a URL of an image. After receiving the JSON response containing the URL, I wa ...

"Exploring the world of JSON in the realm of

I am attempting to showcase JSON data using jQuery Mobile Is there something incorrect on this page? Check out my code here! Thank you! ...

Experiencing difficulty decoding JSON output on jquarymobile's HTML page when making an Ajax request

After developing screens for my Android application using PhoneGap and jQuery Mobile, I have included the necessary JavaScript and CSS files in my HTML page: <link rel="stylesheet" href="css/jquery.mobile-1.3.1.css" /> <script src="js/jquery-1. ...

The jQuery function is only operational upon page reload

I encountered an issue with a simple code snippet that I am using in a jQuery Mobile page on a multi-page website. The code, which is loaded from a separate file, was working initially but now only works when I reload the page. Upon inspecting the page loa ...

Avoid displaying identical items when rendering a page from JSON data

I am using ajax and json to render a page. The structure of my json is as follows: {"status":"ok","rewards":[{"id":201,"points":500},{"id":202,"points":500}]}. I want to load the data using ajax only once if 'points' have duplicates in any of the hashes. ...

Mastering Jquery mobile for efficient mobile analytical insights

I am on the lookout for a top-notch mobile analytics solution that can seamlessly integrate with Jquery Mobile. I've already explored this specific query: Flurry Analytics vs Google Analytics on the mobile platform However, those recommendations are tail ...

What could be hindering the activation of my button click event?

Below is the js file I am currently working with: var ButtonMaximizer = { setup: function () { $(this).click(function(){ console.log("The maximize button was clicked!"); }); } }; $(docum ...

Which approach yields greater efficiency for an image gallery in a hybrid application?

I have plans to create a one-of-a-kind hybrid application that showcases an extensive collection of 70-100 captivating images and videos. My main concern revolves around the effectiveness and efficiency of Jquery mobile. So, should I opt for Angularjs an ...

What are the steps to create a scrolling effect for the menu buttons on the mobile version of

When accessing the mobile version of Facebook on a handheld device, you will notice a menu with various options like "About," "Photos," "Friends," "Subscriptions," "Map," and more. This menu is designed to be slideable on your mobile device. Using HTML, ...

Having trouble accessing listview capabilities in jquerymobile?

I am currently delving into the world of jquerymobile. I am experimenting with a sample project where I aim to showcase a listview. Below is the code that I have been working on. <!doctype html> <html> <head> <link rel="stylesheet" h ...

Countdown to redirect or exit on Jquery mobile "pageshow" and "pagehide" events

Looking to implement a 30-second countdown on a Jquery Mobile page with specific requirements: (1) Countdown begins on pageshow (2) Redirects to new page when countdown expires (3) If user navigates away (pagehide) before countdown finishes, the timer fun ...

Adjusting the margins of jQuery mobile buttons

I seem to be stuck on a simple error that is causing me to spin my wheels. Take a look at the following jqm (version 1.3) view (in haml) #main-header{'data-role' => 'header'} #main-content{'data-role' => 'content'} #main-buttons %input#a{'ty ...

What steps can I take to make sure a jQuery Mobile table does not become responsive?

My goal is to make a table responsive by using media queries to hide optional columns on smaller devices. I need to hide two columns based on different screen sizes: @media screen and (max-width: 33em) { th.optional-1, td.optional-1 { display: no ...

Looking for a way to ensure a div reaches 100% height within a specified area without exceeding the boundaries of the body?

I am working with jQuery mobile and have specific requirements for my project: The main content will be a large graphic that needs to fill the entire page, with both horizontal and vertical scrolling if necessary. The header should remain fixed at the to ...

Several Divs Positioned on Different Pages with Backgrounds That "Scroll"

Currently utilizing: jQuery Mobile 1.4.5 I am interested in knowing if it is feasible to achieve the following, and if so, how to start working on it. At the moment, there are 4 page divs that utilize swipe for navigation between them with a horizontal t ...

Tips for efficiently obtaining JSON Ajax data, saving it to local storage, and presenting it in a jQuery Mobile list view

Upon calling ajax to my server, I receive 1000 units of data which I then store in my local storage before displaying it on a jQuery mobile list-view. However, this process takes around 50-60 seconds to complete. Is there a way to optimize this and make it ...

Optimizing User Experience: Maintaining Continuous Login Sessions on iOS with jQuery Mobile and PHP

I have successfully developed a jQuery Mobile website integrated with PHP that requires user authentication. The website is performing well on all platforms. Users using iPhones or iPads are encouraged to add the website to their home screen as a web clip, ...

An error occurred with redirecting using jQuery Mobile's new method in version 1.5

Utilizing jQuery Mobile for its history state feature, I am looking to redirect users to another "page" using the jQuery method recommended in their latest documentation. p/s: I prefer the jQuery navigation method due to the hashchange/history support and ...

Ways to identify the active anchor within an li element

Below is the code snippet I am currently working with: <li> <a href="<?php echo base_url()?>home/promos/call" class="promo-call active-call"></a> </li> <li> <a href="<?php echo base_url()?>home/promos/text ...

adjust highcharts chart size to fit screen width

Has anyone experienced issues with setting an explicit width of 400px on a chart? I am facing difficulties as the chart gets cut off instead of scaling down to that size. My main concern is having it resized properly for an iPhone mobile site. Can anyone ...

Having trouble with Cordova and JQuery AJAX integration?

After researching for a couple of hours, I discovered that my cordova app (CLI 5.3.3) is displaying a "page not found" error when making AJAX calls through jQuery. Despite following all the steps in the whitelist plugin (https://github.com/apache/cordova- ...

Changing a button's value on click using PhoneGap

I've been working with phonegap and came across an issue with my buttons setup like this: <input id="my_button" type="button" onclick="my_function();"/> The goal is to capture the click event and change the button's value, my_function ( ...

How can I use jQuery to show the text value of a selected checkbox, dropdown menu, and flipswitch in a popup?

This form's HTML is set up for input with a popup display feature upon submission. Currently, only text can be displayed in the popup. It doesn't show the text of selected checkboxes or dropdown lists - just numbers for the dropdown and "ON" for checkbox s ...

Customizing the size of dateBox icons in JQuery Mobile

Is there a way to increase the button size within the input box of a dateBox? Currently, it appears small and difficult to click accurately. Additionally, it would be beneficial if clicking anywhere in the input field could open the calendar, instead of ju ...

Looking for a way to easily swipe through videos?

My mobile phone viewport displays a series of pictures and videos, with the swipeleft/right function enabled for browsing. However, I noticed that while the swipe feature works fine for images, it stops functioning when a video is displayed. Can anyone p ...

Introduction screen in a JQuery mobile application for Android devices

I'm currently working on an Android app that utilizes jQuery Mobile within my web-based application. I have multiple pages in the app and I am considering adding a splash screen to display when loading a new page or while the page is being loaded. Any reco ...

Is it possible for a mobile web application to continue running even when the screen is

Thinking about creating a mobile web application with the use of jQuery Mobile for tracking truck deliveries. I'm interested in sending GPS coordinates back to the server periodically. Is this possible even when the screen is turned off? If not, any ...

Issue with loading scripts in CodeIgniter, jQuery Mobile, and jQuery UI - scripts are not loading initially, requires a refresh to

I am currently facing issues with my codeigniter application. The problem arises when I have a view/form (view 1) that, upon submission, loads another view (view 2). When view 1 is initially loaded, it does not load the correct JavaScript and CSS. Instead ...

Organize your items vertically using jQuery Mobile's list feature

I am currently working on a mini chat application. The messages in the list are appearing side by side and I would like them to be displayed one below the other. Is there a way to adjust the CSS or add classes to achieve this? <div style="height:100% ...

What is the best way to implement media queries for mobile phones and desktop computers?

I've come across similar questions before but still can't wrap my head around it. Here's my dilemma: I want the index page of my website to display in desktop layout on desktops and mobile jquery on mobile devices. Currently, I have set up my website and i ...

Implement Icon using CSS Class in jQuery Mobile

Is there a way to use an icon in jQuery Mobile on a span element and also support retina display without giving the span a fixed width? Should I attempt to utilize Media Queries to achieve this, or is there an "official way" to do it? Thanks, Nils ...

The text on the menu is not adjusting properly for small screens

Check out the jsFiddle link. The issue arises when the Result screen is set to the width of a mobile's screen. Instead of wrapping the text, it gets replaced by dots and cannot be scrolled to view the full content. Here is the code snippet: <a hr ...

Run javascript code after the page has transitioned

Struggling to create a dynamic phonegap app with jQuery Mobile, the issue arises when loading JavaScript on transition to a new page. The structure of my index page is as follows: <body> <div data-role="page" id="homePage"> <div data- ...

Is it feasible to utilize jQuery mobile without the use of AJAX, relying only on styles?

While I am aware of the jQuery Mobile download-customizer, I am struggling to determine which options need to be selected. It appears that the styles for input elements are somehow connected to the AJAX functionality? All I really desire is to have stylis ...

Tips for updating the DOM and ensuring the correct URL is displayed when navigating between pages in Jquery-mobile

Hello there, I'm currently in the process of learning JQuery mobile and have run into a small issue that I believe should be an easy fix. My website consists of two pages - index.php, contacts.php, and sendmail.php for mailing purposes. Each page is ...

Customizing screen dimensions for a single page using jQuery mobile

I am currently facing an issue with adjusting the size of a specific page within my application. Even though I am using <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, target-den ...