Obtain access to a Java list of objects using JavaScript or ExtJS

Interested in working on a list of objects with JavaScript, potentially using ExtJS as well in the project. There are two lists in the JSP file (modelList and categoryList) forwarded by the controller, and the goal is to access data in both lists. Is this achievable?

JSP code snippet:

<table class="form">
    <tr>
        <td class="label"><a class="required"></a><spring:message code="serviceModel.category" /></td>
        <td class="value">
                <form:select path="category" onchange="javascript:App.reloadUserNumberOnCategoryChangeForWorkflow(this, ${categoryList}, ${modelList}) ;App.removeError(this)>
                    <form:option label="" value="" />
                    <form:options items="${categoryList}" itemLabel="description" itemValue="description" />
                </form:select>
                <form:errors path="category" cssClass="errormsg" />
        </td>
    </tr>
    <tr>
        <td class="label"><a class="required"></a><spring:message code="service.userNumber" /></td>
        <td class="value">
                <form:select path="userNumber">
                    <form:option label="" value="" />
                    <form:options items="${modelList}" itemLabel="description" itemValue="description" />
                </form:select>
                <form:errors path="userNumber" cssClass="errormsg" />
        </td>
    </tr>
</table>

Controller code snippet:

uiModel.addAttribute(WebConstants.CATEGORY_LIST, catList);
uiModel.addAttribute(WebConstants.MODEL_LIST, modelList);

Answer №1

To transform your Java object into a JSON array, consider developing a JSON service. Retrieve the list from the server using an AJAX call.

Frameworks like Spring and Struts offer built-in methods for this task. Alternatively, you can create your own solution using a servlet and a JSON library from json.org.

Answer №2

Unfortunately, no direct method is available to achieve this.

The only plausible way to accomplish this task would involve utilizing the View to create JavaScript code that defines the object.

For your specific scenario, you might want to consider implementing the following:

<script type="text/javascript">
  <c:if test="${!empty modelList}">
    var modelList = [
      <c:forEach var="model" items="${modelList}">
        {
            description: '<c:out value="${model.description}"/>',
            otherProperty: '<c:out value="${model.otherProperty}">'
        },
      </c:forEach>
    ]
  </c:if>
</script>

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

Develop an ASCX component to handle various tasks

I am currently in the process of developing a unique custom control that will feature two radio buttons. This project is being carried out using MVC4 and ASP.NET technology. At the moment, I have successfully created two sets of two radio buttons on separa ...

Express POST request body is required

I am starting to learn nodejs and express, and while reviewing some code I found this interesting snippet. Can someone please explain what it means and how I can send a POST request to it using cURL? There are no specified data fields. app.post('/&apo ...

Difficulties arising when trying to convert latitude and longitude coordinates to xyz for camera rotation within Three.js

Currently, I am working on a JavaScript application that allows users to design their own closet. My goal is to enable smooth rotation of the closet without changing the distance from the camera to the closet. While it would be simple to rotate the object ...

Efficiently managing various notifications on Android platform with multiple intents

I have developed a basic app that allows users to input text and set it as a notification. Users can create multiple notifications as needed. The goal is for users to click on a notification and be directed to a new activity named ResultActivity. In Result ...

What is preventing me from accessing my session array in this.state.props from my mapStateToProps in React-Native Redux?

I am currently facing an issue with my Redux store setup. I am attempting to store an array of Session objects, where each Session object contains an array of Hand objects. However, when trying to access my store using `mapStateToProps`, none of the option ...

Incorporating Blank Class into HTML Tag with Modernizr

Currently, I am experimenting with Modernizr for the first time and facing some challenges in adding a class to the HTML tag as per the documentation. To check compatibility for the CSS Object Fit property, I used Modernizr's build feature to create ...

How can I retrieve JSON data from an AJAX request on an HTML page?

How can I display my JSON data on an HTML page using this JavaScript code? $.ajax({ url : 'auth.json', type: "GET", dataType : "jsonp", success: function(result) { $.each(result, function(i, v) { // Loop through each record in ...

Unable to transfer Vue.js components in and out of the project

I have a directory structured like this. VueTree components Classic.vue Modern.vue index.js The Classic and Modern components consist of a template, export default {}, and a style. I am importing both of them in index.js as: import Classic ...

The method in the calling class cannot be resolved, even though it exists and compiles successfully in both the interface and implementation classes

I am currently working on developing a series of Selenium tests using Java. One crucial part of my program involves the utilization of a class named ResponseInterceptor.java. This particular class leverages methods from both my IReporter.java interface and ...

Generate a dot density map with the help of Google Maps

I am looking to create a dot density map using Google Maps for my state. I have all the counties outlined with their respective populations, and I want to scatter dots randomly within each county to represent the population. The goal is to make a dot densi ...

State not visible in Redux Devtool extension on Chrome browser

I am still getting acquainted with Redux, especially the Redux DevTools. Recently, I developed a simple application where users can be clicked on to display their information. Essentially, the state contains the currently selected user. However, for som ...

The issue of elements flickering while being hidden and shown with jQuery has been observed in both Chrome and

Having trouble with a simple animation using jQuery? While it may work smoothly in Firefox, you might be experiencing flickering in Chrome and Edge. Check out this jsfiddle for reference: HTML <div id="boxes-wrapper"> <div class="box"></ ...

Updating the contents of one specific div without affecting all other divs with the same class

Below is the HTML code snippet in question: <a class="btn test-btn test-btn-1"> <span>Content 1</span> </a> This particular code block appears multiple times on the page. The number at the end of test-btn- is dynamically generat ...

dojo.xhrGet evaluating script tags

I have a piece of code that is similar to the following: var targetElem = dojo.byId('xyz'); var xhrArgs = { url: 'Welcome.do?call=JS', preventCache: true, load: function(data){ targetElem.innerHTML = data; dojo.parser.par ...

The ng-view in index.html is not being loaded by AngularJS

I've been working on setting up a single-page application using AngularJS. In my setup, I'm using Node with Express and have an Apache server functioning as middleware. The issue I'm facing is that while my index.html page loads without any ...

Guide on extracting data from an HTML table column and saving it to a JavaScript array with the help of JQuery

Suppose there is a table column containing 10 rows, each with <td id="num"> and some text value. Is there a way to utilize JQuery in order to iterate through every row within the column and store the values in a JavaScript array? I attempted the co ...

Next.js experiences slowdown when initializing props on the server side

I've been working on implementing SSR with Next.js. In my code, I'm fetching JSON data and using them as initial props. Everything works fine in development mode, but when I deploy to the server, fetching only works on the client-side (when navi ...

Obtain offspring from a parent element using jQuery

$(document).ready(function() { $.ajax({ type: "POST", url: 'some/url', data: { 'name':'myname' }, success: function (result) { var result = ["st ...

Variable remains unchanged by method

I am currently working on an app that utilizes the user's webcam. In case navigator.getUserMedia fails, I need to change the error variable to display the appropriate error message instead of the stream output. Since I am new to Vue, please bear with ...

The onclick function is malfunctioning when attempting to use the Windows Phone app in Visual Studio 2015

web development <div class="align_center"> <div class="btn EmployeeloginBtn" **onclick="new Employee().connect()**>CONNECT</div> </div> Employee.js: var Employee = function() { var self = this; self.connect = fu ...