Having trouble with Ajax calls in Sencha Touch 2?

In my application, I have a simple function that is called from the launch() function:

function makeAjaxCall(){
  Ext.Ajax.request({
    url: 'ajax/Hello!', // The request should be sent to host/ajax URL as an HTTP GET request
                 // and the server should respond with plain text `Hello!`
    success: function(response){
      prompt('Successful Ajax call!', response.responseText); // Custom prompting method
    }
  });
}

The issue I'm encountering is that this request doesn't appear to be made. It's not showing up in my Play framework server logs or in Google Chrome's network developer tab.

UPDATE: The program also appears to be getting stuck at the Ext.Ajax.request function.

Answer №1

I've found success with the following ajax code implementation.

Ext.Ajax.request({
    async : true,
    url : 'api/login/',
    method : 'POST',
    jsonData : {
        "email":Ext.getCmp('loginUserNameTxtBoxId')._value,
        "pwd":Ext.getCmp('loginPasswordTxtBoxId')._value,
    },
    success : function (request, resp) {
        alert("in login success");
    },
    failure: function(request, resp) {
        alert("in failure");
    }
});

Answer №2

Make sure your URL is an HTTP URL and specify the action (GET, POST) you want to take. To make an AJAX call, use Ext.Ajax.request as you've already done.

If you need to include parameters, create a parameter object.

Here's an example:

 Ext.Ajax.request({
        url : 'http://example.com/api/endpoint',
        method: 'POST',
        params: {
            name: 'John Doe',
            email: 'johndoe@example.com'
        },
        success: function(response, request) { console.log('Request was successful'); }
    });  

To check if the request has been sent, examine the network tab in your Chrome developer tools.

Answer №3

It came to my attention that I had overlooked including Ext.Ajax in the requires field of my application. Once I added it, everything functioned perfectly.

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

construct a table utilizing JSON information

If I have data returned from an ajax call that needs to be processed, a table like the following needs to be created: ID NAME Object Type ============================================== 1 SWT-F1-S32-RTR-1 Network Switch 2 ...

The XMLHttpRequest() function throws NS_ERROR_FAILURE when sending requests to localhost using either an absolute or relative path

Encountering an error in Firefox 31 ESR: Error: NS_ERROR_FAILURE: Source file: http://localhost/Example/scripts/index.js Line: 18 Similar issue observed on Internet Explorer 11: SCRIPT5022: InvalidStateError The script used for AJAX function call i ...

Search a location database using the user's current coordinates

Currently, I am working on a project that involves a database containing locations specified by longitude and latitude. Upon loading the index page, my goal is to fetch the user's location and then identify every point within a certain distance radius ...

Please provide either a string or an object containing the proper key for TypeScript

Within my project, the languageSchema variable can either be a string or an object containing the 'Etc' key. The corresponding interface is defined as follows: let getLanguageSchema = (language: string): string => languagesSchemas[language]; ...

To access a restricted selection of images stored in Firebase

Is there a way to load additional images from Firebase by clicking a button? I created a function that looks like this: onLoadMore() { if (this.all.length > 1 ) { const lastLoadedPost = _.last(this.all); const lastLoadedPostKey = lastLoadedP ...

Connecting radio buttons to data in Vue using render/createElement

How do you connect the value of a selected radio button to a specific variable in the data object within a Vue application when using the render/createElement function? ...

Utilize Google Charts Table Chart to extract data from an object-literal notation data source

Here's a look at the data source and Listener function: Data Source var data = new google.visualization.DataTable( { cols: [{ type: 'string', label: 'Col1' }, ...

I am facing a challenge with AngularJS where I am unable to navigate between pages using the

I'm having issues with my route file app.js. Whenever I click on any link or button, it redirects me to books.html. What could be the mistake I'm making? var myApp = angular.module('myApp', ['ngRoute']); myApp.config([&apo ...

Performing string replacement on an Ajax response prior to adding it to the document

I'm facing an issue when trying to update the response from a jQuery ajax request. I need to replace myPage.aspx with /myfolder/myPage.aspx before adding it to the DOM. Is it possible to achieve this using jQuery or plain Javascript? This is how a pa ...

What could be the reason for JavaScript delaying the execution of DOM statements until a variable is true?

Today I've been tackling numerous bugs, but there's one particularly tricky bug that has me stumped. The snippet of code below pertains to a basic logon page. Currently, the only valid username is 'admin' and the corresponding password ...

Using both an API key and password for authentication in request-promise access

I have been attempting to make a GET request to the Shopify API using request-promise in Node.js. However, I constantly encounter the following error message: '401 - {"errors":"[API] Invalid API key or access ' + 'token (unrecognize ...

leveraging an array from a separate JavaScript file within a Next.js page

I am facing a situation where I need to utilize an array from another page within my Next.js project. However, it seems that the information in the array takes time to load, resulting in encountering undefined initially when trying to access it for title a ...

Steps for performing a runtime cast

When working on a web application written in TypeScript, there is a feature where users can add additional JavaScript functions that will be parsed at runtime (new function(Function as String)) for execution. These functions should return an object defined ...

Differences between Angular's $injector and Angular's dependency injectionAngular

As a newcomer to Angular, I am exploring the use of $injector and its get function to retrieve specific services. For instance: app.factory('$myService', function($injector) { return { ... var http = $injector.get('$http&apos ...

What methods can I incorporate sophisticated logic into my dataform process?

Summary I am looking to enhance the functionality of my Dataform pipeline by introducing a layer of modularity (via JavaScript functions) that can identify when there is a disruptive change in the schema of my raw data source. This system would then autom ...

Jasmine: Ways to invoke a function with a specific context parameter

Looking for guidance as a newbie to Jasmine on calling a method with context as a parameter. Example: function locationInit(context) { } Appreciate any help and advice! ...

The curious case of jQuery.parseJSON() failing to decode a seemingly valid Json string on a Windows-based server

I am currently running a WordPress JavaScript function code on a Linux server that also includes a PHP function called "get_form_data". jQuery.ajax({ type: "POST", url: MyAjax.ajaxurl, data: {action: "get_fo ...

Improving Express middleware results in a 'undefined property cannot be set' error

Currently, I am in the process of restructuring the middleware within my Express routes based on the recommendations from CodeClimate to eliminate redundant code. However, after refactoring the code, I encountered a TypeError: Cannot set property "checkUse ...

Sending parameters within ajax success function

To streamline the code, I started by initializing the variables for the selectors outside and then creating a function to use them. Everything was working fine with the uninitialized selector, but as soon as I switched to using the variables, it stopped wo ...

Ways to include text with specific choices in a drop-down menu?

Within a form, I am encountering a situation where a select box's options are pre-selected through ajax based on a previously entered value. I am now seeking a way to append additional text to these pre-selected options only. for (i in data) { $("#my ...