The Ajax function fails to trigger the desired function in JavaScript

My attempt to use Ajax to interact with a servlet seems to be causing some issues. When I check the Net tab in firebug, I can see that the server is responding correctly. However, for some reason, my vulAan function is not being called by the Ajax request. To troubleshoot this, I added window.alert() functions to check if any function is being called. Surprisingly, only window.alert("request verstuurd") is getting triggered. Here is the code snippet:

window.onload = function() {
    $("registreerform").observe("submit", controleer);
    $$("input")[1].observe("blur", getVulAan);
    $$("input")[2].observe("blur", getVulAan);
};

function getVulAan(event){

     var post = $$("input")[1].value;
     var huis = $$("input")[2].value;
     if (post && huis) {
     window.alert("request verstuurd");
     event.stop();
     new Ajax.Request (
      "http://www.ntwpracticumnet.ou.nl:8080/registratie/PostcodeServlet",
        { method: "get",
        parameters: {postcode: "1076CT", huisnr: "390"},
        onSucces: vulAan,
        onFailure: nietGelukt,
        onExcepton: nietGelukt
        }
      );
    }
}

function vulAan(ajax) {
    window.alert("request geaccepteerd");
    var jsWaarde = JSON.parse(ajax.responseText);
    var plaats = jsWaarde.plaats;
    var straat = jsWaarde.straat;
    $$("input")[3].value = plaats;
    $$("input")[4].value = straat;
}

function nietGelukt () {
    window.alert("niet gelukt");
}

Can anyone pinpoint what might be causing this issue?

Answer №1

In order to fix the issue, it is necessary to change the name of onSucces to onSuccess. Please refer to this link for more information:

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

When one div is hidden, the width of another div will automatically adjust to 100%

Is there a way to make #leftdiv expand to 100% when #rightdiv is hidden, and have both <div>s positioned next to each other when a button is clicked? I have successfully aligned both <div>s next to each other upon button click, but I would lik ...

Create a dynamic animation using Angular to smoothly move a div element across the

I currently have a div with the following content: <div ng-style="{'left': PageMap.ColumnWrap.OverviewPanelLeft + 'px'}"></div> Whenever I press the right key, an event is triggered to change the PageMap.ColumnWrap.Overvie ...

Measuring Euler Angles with 9-Axis Analog Sensor Data

I am trying to calculate Euler angles using analog sensor data in JavaScript. The sensor data consists of gyro, accelerometer, and magnetometer readings in three dimensions. I find the mathematical aspect a bit challenging, so any assistance or advice woul ...

Having trouble rendering an object in my ThreeJS project. The error message says: "THREE.OBJLoader: Unexpected line: 'usemap glass'"

I encountered an error while running threejs in an angular 8 application. The objective is to load an object, for which the object and material files were obtained from Kenney assets. Despite referencing examples on the official threejs site and other onli ...

Within the ASP.NET Framework 4, it is necessary to enable the Listbox control to trigger an event when a user double

Currently, I am developing a project in ASP.NET 4. I have encountered a situation where the regular ListBox in version 4.5 includes an attribute named OnMouseDoubleClick. However, since I am using ASP.Net 4, I am looking for the best approach to replicat ...

unable to retrieve JSON sub-elements

I encountered an issue while attempting to iterate through the JSON object provided. When trying to access the content-items using page.content-items, I received an error message. Is it possible to access an object that has a key with "-" in its name? Co ...

Procrastinate the time taken for the ajax process

I'm working on an AJAX progress bar using jQuery and PHP for file uploads. I want to delay the progress of the loading until after the file is completely uploaded. Below is the code snippet I have been using: uploadProgress : function(event, position ...

Building a Laravel PHP application that dynamically generates a custom JSON object fetched from the database and passes it from PHP to

I am faced with the task of generating a custom JSON object by organizing data retrieved from PHP in my Controller. I have full control over what information goes where and in what specific order. To accomplish this, it seems like I will need to go throug ...

Efficiently Organizing Data Using Coldfusion Loops in Columns and Rows

My issue lies in pulling data from a database to display on my website. I have three keys/attributes (columns) - PostedDate, DataImage, and Source that need to be shown together in one div with the posted date at the top, image in the middle, and source at ...

Using jQuery to dynamically disable links based on their HTML content

I am looking for a way to disable links based on the content within their HTML tags. In my website, there are several classified sections that may not always have content filled out. My goal is to visibly indicate to viewers when a classified section is em ...

I am encountering an issue where my Vue navbar is successfully changing the route but not updating the corresponding router-view

I have been working on a single-page application using Vue and I encountered an issue with the navbar when navigating through routes. The problem is that after the first click on a navbar item, the route changes successfully but the router-view does not up ...

UnknownReferenceError: jwreload has not been declared (Exploring dynamic routing in next.js)

Error in dynamic route with next.js Recently, I started learning next.js and encountered an issue while implementing a dynamic route. The error message "ReferenceError: jwreload is not defined" keeps appearing whenever I reload the page. Surprisingly, des ...

Clear the Material-UI textfield upon form submission

After submitting the form, how can I clear the value from the TextField? All of the components in my code are functional components, not class ones. The example below shows one of the TextFields, with others similar to it. Currently, setting type='sea ...

Forward to a task with a unique identifier obtained through asynchronous JavaScript calls

I am currently working on an application that utilizes AJAX with FullCalendar functionality. My goal is to enable users to click on a specific item on the calendar, prompting a dialog box with a "View Details" button. Clicking on this button should redire ...

The issue of anchors with jQuery.ajax()

Hello everyone, I'm encountering an issue with anchors and dynamic content loaded through $.ajax(). Take a look at my jQuery code: $("a.false").live("click", function() { var data = $(this).attr("href"); $("div#text").hide("fast"); $("di ...

Converting HTML to JSON using jQuery

Currently, I am utilizing the jQuery template plugin to dynamically create HTML based on JSON data that user can then modify (and even change). My goal is to find a way to convert this HTML back into JSON format so that it can be saved back to my server. ...

What is the best way to retrieve values from a nested array?

I am currently working on extracting data from an Array that originates from an RSS feed, which I have converted into a json format. The structure of the array is as follows: <channel> <item> <title> Title A </title> <de ...

Obtaining JSON data from a URL in Android

I am currently facing an issue where I am unable to retrieve a JSON object from a URL. The code works perfectly fine on a Spring application, but it crashes in the android environment. Can someone please assist me in debugging this issue? package co ...

Verify if a certain value exists in an array while using ng-if inside ng-repeat

Currently, I have a loop using ng-repeat that goes through a list of wines obtained from an API. Alongside this, there is an array variable containing all the IDs of wines that have been marked as favorites and retrieved from the database. My goal is to sh ...

Enabling a variable to encompass various types within ReactJS

In my code, I have defined two distinct types as follows: type A = $ReadOnly<{ a: ?$ReadOnlyArray<string>, b: ?string, }>; and type B = $ReadOnly<{ c: ?$ReadOnlyArray<boolean>, d: ?number, }>; Now, I am looking to create a ...