Controller not being reached by Ajax request

Hi, I am currently attempting to utilize Ajax with Spring Mvc Portlet in Liferay. I have a JSP file and Controller Class set up. My goal is to insert data into a form, but for some reason, my controller class is not being called when I click the submit button. Can someone please assist me in resolving this issue?

Here is an excerpt of my .jsp code:

<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>

<portlet:defineObjects/>
... (JSP code continues) ...

And here is part of my JavaScript code:

$('#saveBigForm').click(function(){
        var json = $('#bigForm').jqDynaForm('get');
        showFormJson(json);
        $.ajax({
            type: "POST",
            url : "${actionOneMethodURL}",
            data:   JSON.stringify(json),
            dataType: "json",
            success: function(response){
                if(response.status == "SUCCESS"){
                    $('#info').html("Success! Request has been added.");
                } else {
                    $('#info').html("Sorry, there is something wrong with the data provided.");
                }
            },
            error: function(e){
                alert('Error: ' + e);
            }
        });
    });

Finally, here is an overview of my controller class:

package com.myowncompany.test.springmvc.controller;

import java.io.IOException;
... (Controller class definition continues) ...

I have encountered the following logs:

09:36:56,291 INFO  [DispatcherPortlet:119] Portlet 'firstspringmvc' configured successfully
09:36:56,300 INFO  [localhost-startStop-19][PortletHotDeployListener:454] 1 portlet for first-spring-mvc-portlet is available for use
10:09:49,460 WARN  [http-bio-9090-exec-138][404_jsp:121] {msg="/$%7BactionOneMethodURL%7D", uri=/$%7BactionOneMethodURL%7D}
10:09:54,325 WARN  [http-bio-9090-exec-139][404_jsp:121] {msg="/$%7BactionOneMethodURL%7D", uri=/$%7BactionOneMethodURL%7D}

Answer №1

Experiment with the jsp core tag library,

link : "<c:url value='/VIEW/actionOne' />"

OR

link : "<c:out value='${actionOneMethodURL}' />"

Answer №2

To utilize JSTL core in your JSP page, you can do the following:

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

Also, make sure to update your ajax URL from

url : "${actionOneMethodURL}"

to

url : "<c:url value='/VIEW/actionOne' />",

Answer №3

Based on the information provided, I can pinpoint a few possible causes of the issue:

  • Your JavaScript may be faulty and not running properly. To check for errors, open the webpage in Google Chrome or Firefox, press F12, go to the Console tab, and look for any error messages.
  • The warning about ${actionOneMethodURL} not being defined suggests that there may be an issue with your JavaScript file. You can try defining it like this:

In your HTML (the .jsp file you posted at the top):

<script type="text/javascript">
ajaxLink = "${actionOneMethodURL}";
</script>

In your JavaScript file:

url: window.ajaxLink;

It's important to experiment with this solution as I am unable to test it myself. You may need to make adjustments such as where you place the script tags in your document and whether the quotation marks around ${actionOneMethodURL} are necessary.

Answer №4

To incorporate in a .jsp page, include the following:

var actionurl =${actionOneMethodURL};

Within example.js during an ajax call:

$.ajax({

            type: "POST",
            url : actionurl,
            data:   JSON.stringify(json),
            dataType: "json",
            success: function(response){
                // Handling response
                if(response.status == "SUCCESS"){
                    $('#info').html("Success........!Request has been added......... ");

                }else{
                    $('#info').html("Sorry, there is some thing wrong with the data provided.");
                }
            },
            error: function(e){
                alert('Error: ' + e);
            }
        });

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

Retrieve data from ajax call in segments before it finishes

When my browser sends an ajax/json request to the server, it calls several services to gather data of different lengths before displaying it in the browser. Instead of waiting for all the data to be retrieved at once, I would prefer to receive the data (j ...

Converting an HTML form with empty values into JSON using JavaScript and formatting it

While searching for an answer to my question, I noticed that similar questions have been asked before but none provided the solution I need. My situation involves a basic form with a submit button. <form id="myForm" class="vertically-centered"> ...

The submission of the form is not functioning correctly when triggered by JavaScript using a button

My website was designed using a CSS/HTML framework that has been seamlessly integrated into an ASP.NET site. Within a ContentPlaceHolder, I have implemented a basic login form. The unique aspect is that I am utilizing the onclick event of an image to subm ...

What is the process for incorporating personalized field attributes using an inlineformset_factory in Django?

I am currently working with an 'inlineformset_factory' and I am trying to determine the best way to set attributes for the individual fields. So far, I have not been able to find a method to add them without resorting to using javascript, which i ...

Looping through a jQuery script to add a class if a certain condition is met in another class

$(document).ready(function() { if ($("#grid .media-box").hasClass("brand1")) { $("#grid .media-box-content").addClass("brand01") }; } }); and in body looping div grid <div id="grid"> <?php foreach($data as $items) { ?> <div cl ...

Resolving problem with saving an Array of Objects due to parsing issues with empty objects

I'm experiencing a peculiar problem with the Parse .save method. Saving individual Objects and Arrays of strings works seamlessly. However, when attempting to save an Array of Objects like: [{"pos": 10101, "id": 2312}, {...}, {...}], I encounter issue ...

Carousel Alert: Ensure that every child within the list is assigned a distinct "key" property

I'm experiencing an issue that is proving to be more challenging than usual, as it appears to be related to a specific library. I understand that using a key from a file is not ideal, but the plan is for it to come from a database in the future. Libr ...

Newbie Inquiry Renewed: What is the best way to convert this into a functional hyperlink that maintains the data received from the ID tag?

I have no prior training etc. If you are not willing to help, please refrain from responding as I am simply trying to learn here. <a id="player-web-Link">View in Depth Stats</a> This code snippet loads the following image: https://i.stack.i ...

obtain every drop-down choice from Angular 2's selectiongetConfig() function

Within the document, there is a select element as shown below: <select tabindex="1" size="5" name="abc" multiple> <option value>Select a value.</option> <option value>option 1</option> <option value>option 2 ...

Combining state and props to efficiently pass them as props - what's the best method?

I am attempting to create a component that merges props and state together, allowing the actual view to simply focus on retrieving data from props. In the snippet of code provided below, I am experimenting with utilizing the spread operator (potentially ...

What is the best way to include an ID parameter in a $ajax GET request?

Real-life Dilemma I've been grappling with an issue for the past 4 hours - I'm attempting to send an http get request with the user ID as a parameter. Despite trying numerous examples found online, I continue to encounter this pesky error on the ...

Navigate to items within a content block with a set height

I have a <div> that has a fixed height and overflow-y: scroll. Inside this div, there is mostly a <p> tag containing a long text with some highlighting (spans with background-color and a numbered id attribute). Just to note, this is an HTML5 a ...

Is there a way to refresh the list automatically after deleting an item using Firebase?

When I use ngFor on a list to display multiple recordings in a table, I have two methods in my TypeScript file - one for getAll and another for delete, as shown below: HTML: <tr *ngFor="let value of imagesList"> <td scope="row& ...

What is the reason that this jQuery code is exclusive to Firefox?

I am currently working on a code snippet that enables users to navigate back and forth between images by displaying them in a lightbox at full size. The code functions flawlessly in Firefox, however, it does not seem to have any effect on IE, Chrome, and S ...

`Upkeeping service variable upon route alteration in Angular 2`

Utilizing a UI service to control the styling of elements on my webpage is essential. The members of this service change with each route, determining how the header and page will look. For example: If the headerStyle member of the service is set to dark ...

Utilize the native HTML attribute to capture the mouse wheel event

I'm interested in utilizing the mousewheel event in my project, but all the information I've found online relies on addEventListener(). I want to detect it using native HTML and CSS. In simpler terms, I'm hoping for something along the lines ...

CakePHP 2.0 fails to provide a 403 error code

When transitioning from cakePHP 1.3 to CakePHP 2.0, I encountered an issue with restricted actions not returning a 403 error when called by AJAX and the user is not logged in. In my previous setup, this served as an alert to prompt users to log back in. ...

Anticipating the outcome of a function in asynchronous JavaScript

After taking a break from web development for a couple of years, I recently dove back into it. While I dabbled in AngularJS before, I have now shifted my focus to Angular2. My current challenge revolves around handling asynchronous JavaScript. Despite enc ...

Mistakes in serializing arrays for javascript in an ajax request

I am trying to send an array of JavaScript objects in an Ajax call. This is how I create my array: var itemsToEdit = []; $(".editedItem[value='true']").closest("tr").each(function() { var itemToEdit = { id: $(this).find(".i ...

Changing Angular code to vanilla JavaScript

Here is an example code snippet for a plugin used in an Ionic/Capacitor/Angular project: import { ForegroundService } from '@awesome-cordova-plugins/foreground-service/ngx'; constructor(public foregroundService: ForegroundService) { } ... sta ...