Triggering a JavaScript function upon the alteration of a Dojo auto-complete widget's value

I'm encountering an issue with calling a javascript function when the value of a Dojo auto completer changes.

Despite trying to call the function through the "onChange" attribute, it doesn't work as expected.

Within the javascript function, my objective is to:

  1. Invoke a struts2 action.

  2. Update the value of a hidden field.

To trigger the action, I found another method:
publishing a topic using the attribute "valueNotifyTopic="topicName"", which allows me to perform the action by listening to the designated topic.

However, this approach doesn't fulfill the requirement of changing the hidden field's value. Hence, the necessity to execute a javascript function

Your guidance would be greatly appreciated

Thanks!!

Edit:

This snippet represents the code in the jsp file:

<s:url id="scriptURL" action="viewContactInfo" />
<sd:div href="%{scriptURL}" listenTopics="viewContactInfo" formId="contactInfo" showLoadingText="false" preload="false">
<s:form id="contactInfo">
    <sd:autocompleter autoComplete="false" name="customer" list="customerList" valueNotifyTopics="viewContactInfo"/> 
    <sd:autocompleter autoComplete="false" name="contact"  list="contactList"  valueNotifyTopics="viewContactInfo"/>
    <s:hidden id="chngd" value="initial"/>
</s:form>
</sd:div>

If I replace "valueNotifyTopics='viewContactInfo'" with "onChange='dojo.event.topic.publish('viewContactInfo');'", the action "viewContactInfo" fails to be triggered. Strangely, the "onChange" method works successfully for other elements in different parts of my project.

Answer №1

After creating a new thread specifically for this query,

The solution has been successfully identified and shared in the response below:

How to effectively pass a hidden parameter to the action file

Trust this information proves beneficial!

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

How can you automate the execution of unit tests in Angular before pushing changes to Git?

There have been instances in Angular projects where the unit tests are triggered every time a build is carried out, as well as when running the git push command. In case any tests fail during either of these commands, the process halts until all unit tes ...

Sending a POST request using Node.js Express: A step-by-step guide

Looking for help on sending a post request from node.js Express with data passing and retrieval. Preferably a straightforward method like cURL in PHP. Can anyone assist? ...

Alter text within a string situated between two distinct characters

I have the following sentence with embedded links that I want to format: text = "Lorem ipsum dolor sit amet, [Link 1|www.example1.com] sadipscing elitr, sed diam nonumy [Link 2|www.example2.com] tempor invidunt ut labore et [Link 3|www.example3.com] m ...

How can I update the state with the value of a grouped TextField in React?

Currently working on a website using React, I have created a component with grouped Textfields. However, I am facing difficulty in setting the value of these Textfields to the state object. The required format for the state should be: state:{products:[{},{ ...

Ways to retrieve a grandchild element of a specific element using its tag name

I'm struggling to access elements that are nested within various levels of parent elements with and without IDs. The usual method getElementByTagName doesn't seem to be working for me, especially when the target element is three levels deep. Is t ...

Navigating race conditions within Node.js++]= can be challenging, but there are strategies

In the process of developing a MERN full stack application, I encountered a scenario where the frontend initiates an api call to "/createDeckOfCards" on my NodeJS backend. The main objective is to generate a new deck of cards upon clicking a button and the ...

When altering a single scope variable in AngularJS, the effect cascades to impact other scope variables as well

After uploading my code on fiddle, I noticed that changes made to the myAppObjects variable also affect another variable. Here is the link to the code: https://jsfiddle.net/owze1rcj/ Here is the HTML part of the code: <div ng-controller="MyCtrl"&g ...

The dynamic rendering of datasets is not supported in Material UI's <TableCell> component

I'm currently working on a table component that dynamically renders an item list based on a dataset. The Table component is made up of <TableHead/> and <TableBody/>. I am using the .map() method to dynamically assign values to the <Tabl ...

How should white space be managed in Bootstrap 4 cards when incorporating responsive column classes - wrap elements inside divs or apply classes directly?

In Bootstrap 4, when applying a responsive column class like "col-sm-8" directly to a "div" with the class "card", whitespace is added between the card border and content. This can be seen in the highlighted yellow area in the image below. https://i.sstat ...

Localization of date picker in material-table(Material UI)

Does anyone have experience with localizing the date picker in material-table (Material UI)? The date picker is specifically used for filtering in this scenario. import React from 'react'; import MaterialTable from 'material-table'; fu ...

Error message "e.nodename undefined when set to setTimeout" was encountered

I developed a unique piece of code for input boxes located at the top of different tables. By using a class='filt', the table can be filtered based on the inputs provided. However, most of the inputs consist of more than one letter, so I wanted t ...

Pressing the button updates the value in the input field, but the input field continues to

I need some assistance with my e-commerce platform. I am trying to implement a button that adds items to the shopping cart, but I'm encountering an issue where the value in nbrSeats (my list of values) changes in the data, yet the input field displays ...

Tips on accessing files saved in a one-to-many connection using Mongoose

I have multiple Schemas set up for Shops and Products. Each shop can have a variety of products, and I currently have 5 different shops with their own unique product listings. While I am able to save the products and find their corresponding IDs within eac ...

Tips for transferring form data between pages using ReactJS?

Custom Checkout Implementation This section pertains to the custom checkout implementation utilizing Javascript. The goal is to extract form fields from the CheckoutForm page and utilize them within this checkout.js file for database submission. This pre ...

Exploring the possibilities of implementing Undo and Redo features in freehand drawing with Reactjs on

After attempting to create a Freehand drawing using HTML5 canvas with React, my next step is to incorporate an undo and redo functionality when the corresponding buttons are clicked. I would greatly appreciate any assistance provided. function App(props) ...

Understanding how to parse an array of arrays in JavaScript can be a

Looking for a function that can extract a value from an array containing multiple arrays? Simply use getValueFromArray(array, [2, 4]) to get the 4th element of the 2d array within the main array. Check out the code snippet below: function getValueFromArr ...

Can you explain what is meant by an "out of DOM" element?

I'm feeling a bit lost when it comes to DOM nodes and all the terminology surrounding them. Initially, I believed that the DOM consisted solely of what I could see in my inspector - nothing more, nothing less. However, I've come across functions ...

The error message encountered with React Easy DatePicker is: "Uncaught ReferenceError: process is not defined."

I am attempting to integrate the stylish DatePicker from https://www.npmjs.com/package/sassy-datepicker?activeTab=readme Here is my implementation : import DatePicker from "sassy-datepicker"; function App() { const [date, setDate] = useSta ...

Help me figure out how to independently toggle submenus on my navbar by utilizing the Vue.js composition API

I am currently working on developing a navbar using the Vue.js composition API. My primary objective is to toggle the submenus when a user clicks on them. However, since I am iterating through an object to display the submenus, I am faced with the challeng ...

What is the best way to update the text on buttons once they've been clicked for a variety of buttons

I'm encountering an issue with multiple buttons where clicking on any button causes the text to change on the first button, rather than the one I actually clicked on. All buttons have the same id, and using different ids for each button seems impracti ...