Implementing a function to navigate to a different page using jQuery mobile

I'm attempting to pass a function when changing pages in jQuery Mobile, but I keep getting an error that points to `$.ajax`

$( ":mobile-pagecontainer" ).pagecontainer(
    "change",
    "#schoolperformance",
    { reload : true, showLoadMsg : false,

      $.ajax({
          type: 'POST',
          url: "custom/php/showinfo.php",

          success: function(data){
              $("#new").html(data)
          },

          error: function(){  //on error

              console.log('failed to successfully destroy');
          }

      });

    });
javascriptjqueryajaxjquery-mobilejquery-mobile-ajax

Answer №1

Ajax cannot be executed without a function, and the pagecontainer does not accept a function in the change method. It is recommended to use the change event instead:

$(":mobile-pagecontainer").pagecontainer({
  change: function(event, ui) {
      $.ajax({
          type: 'POST',
          url: "custom/php/showinfo.php",

          success: function(data){
              $("#new").html(data)
          },

          error: function(){  //on error

              console.log('failed to successfully destroy');
          }

      });
  }
});
$(":mobile-pagecontainer").pagecontainer("change", "#schoolperformance", {
   reload: true,
   showLoadMsg: false
});

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Build a flexible Yup validation schema using JSON data

I am currently utilizing the power of Yup in conjunction with Formik within my react form setup. The fields within the form are dynamic, meaning their validations need to be dynamic as well. export const formData = [ { id: "name", label: "Full n ...

javascriptreactjsreduxformikyup

Eliminate the word "product/products" from the mini cart in the storefront header, while utilizing ajax

In the header of Storefront, there is a mini cart that displays the price and number of items. I am looking to remove the word "item" or "items" from the .count element. I attempted to override the storefront_cart_link() function with the code below: funct ...

ajaxwordpresswoocommercestorefront

How to obtain the value of TR in JavaScript?

Objective: Extract the value "2TR" from "MARSSTANDGATA132TR" using JavaScript. Need to determine the location of the digit 2 within the extracted string. Issue: Uncertain about the correct syntax to achieve this task. Additional Details: *The cha ...

javascriptregex

What is the best approach to enable Amazon Signature 4 presigned URL for Ajax functionality?

After spending nearly 48 hours troubleshooting, I have discovered an issue with generating a presigned URL for listing part of an S3 bucket's contents. The presigned URL works perfectly when pasted into the browser or used in hurl.it. However, when t ...

ajaxamazon-s3pre-signed-url

Using jQuery to make hidden divs visible again

I have a group of products arranged side by side within a div, and I am using a script to hide them one by one. However, at a certain point, all the products have disappeared, and I am struggling to make them re-appear. I've attempted to use .show bu ...

jquerytimeouthideshow

Loading 500,000 entries individually into mongodb results in a memory overflow

I am currently working on inserting a large volume of 500,000 records into a MongoDB collection. These records are stored in a CSV format, parsed, and then saved to an array. I am using a recursive function to insert the records one by one, and when a reco ...

javascriptnode.jsmongodbexpressmongoose

What is the most effective method for utilizing v-model with a pre-populated form in Vue.js?

Need some help with a form and looping through items in a module to generate textfields. Take a look at the photo for context: Link: Currently, I'm using a structure like this... <v-row class="d-block d-md-flex"> ...

javascriptvue.jsvuejs2vuetify.js

Rotate CSS elements dynamically using jQuery

I'm trying to figure out how to change the rotation value of an image element in my code. Currently, the rotation is set to 315 degrees, but I want to change it to 0 when a click event occurs. Can anyone help me with this? ...

jquerycssrotation

Angular not detecting changes in string variables

Issue with variable string not updating var angulargap = angular.module("angulargap", []); angulargap.factory('cartService', function($rootScope,$http){ var fac ={ message:"factory", getCart:function(call){ $h ...

javascriptangularjs

Improving jQuery Selectors Optimization

Recently, I've been pondering about the impact of specifying selectors very specifically versus very loosely in jQuery on performance. For example: $('$myId .someElement') Versus $('table#myId > tbody > tr > td > div.some ...

jqueryoptimization

When attempting to call a recursive method in Vue with a changing `this` object, an error is thrown: "RangeError: Maximum call stack size exceeded"

Update integrate codePen into the project. https://codepen.io/jiaxi0331/pen/xxVZBMz Description encountered an issue while trying to call the parent method recursively Code export default { methods: { dispatch(componentName, event, value) { ...

javascriptvue.jsthis

Is the AJAX form submitting back to its own page?

I'm experiencing some issues with AJAX on my website tonight. After submitting a form, the page refreshes with the values in the URL instead of performing the AJAX request. I have a validate plugin with a submit handler in place, but it doesn't s ...

javascriptjqueryajaxforms

The autoIncrement feature is causing a syntax error at or near "SERIAL"

Encountering a build error : Unable to start server due to the following SequelizeDatabaseError: syntax error at or near "SERIAL" This issue arises only when using the autoIncrement=true parameter for the primary key. 'use strict'; export ...

javascriptangularjspostgresqlsequelize.js

Why does Material-UI TableCell-root include a padding-right of 40px?

I'm intrigued by the reasoning behind this. I'm considering overriding it, but I want to ensure that I'm not undoing someone's hard work. .MuiTableCell-root { display: table-cell; padding: 14px 40px 14px 16px; font-size: 0. ...

javascriptcssreactjsmaterial-designmaterial-ui

Retrieve an array from a JSON object by accessing the corresponding key/value pair using the utility library underscore

I have a dataset in JSON format (as shown below) and I am attempting to use the _.where method to extract specific values from within the dataset. JSON File "data": [{ "singles_ranking": [116], "matches_lost": ["90"], "singles_high_rank": [79 ...

javascriptjsonunderscore.js

Transferring and displaying messages between PHP scripts

On my page (index.php), I have a simple layout consisting of two DIVs. The left side (#leftDIV) contains a form and another DIV (#messages) for displaying error messages. On the right side, there is another DIV (#mapAJAX) which houses a PHP script responsi ...

phpjavascriptajax

Transferring information from an HTML form to a C# webservice through AJAX

I've created a form in HTML using Bootstrap within PHPStorm, and now I want to send the information to a C# webservice using AJAX. However, I'm unsure about what to include in the AJAX URL section (shown below). Here is the HTML/Bootstrap form I ...

c#jqueryhtmlajaxweb-services

Is there a way to prevent my timer from resetting whenever I refresh the page?

Hey everyone, I'm new to coding and I could really use some help here. I have this code for a timer but I'm struggling to make it work properly even after refreshing the page. My goal is to keep the timer running smoothly, but I'm not sure w ...

javascript

What could be the reason for the GET method being executed after the DELETE method in ExpressJS?

Whenever I trigger the DELETE method in my Express app, it seems that the GET method is automatically invoked right after. This results in an error within my Angular code stating that it expects an object but receives an array instead. Why is the GET meth ...

javascriptnode.jsangularjsexpressmean-stack

Dialog in Angular Material refuses to close even after calling the dialog.close() function

I've been struggling with this issue for a while, hoping someone can assist. In my Angular project, I have a login component with a dialog that opens a new popup window. Upon successful login, this window closes and triggers the following function: l ...

javascriptangularangular-material