Iterate through the input values using a for loop and output the value of each individual input

I am working on an express app where I need to loop through data in my EJS file to create 5 hidden input fields, each with a unique value.

However, I am struggling to extract the values of these inputs using JavaScript. Despite trying multiple methods, I have not been successful.

Here is a snippet of my code:

HTML:

<% course.content.forEach(function(content, i) { %>
  <input class="editCourseContent" type="hidden" value="<%= course.content[i] %>">
<% }); %>

JavaScript:

hiddenInputEdit = document.getElementsByClassName('editCourseContent');

includeEditTags();

function includeEditTags(){
  for(var i = 0; i < hiddenInputEdit.length; i++){
    alert(hiddenInputEdit[i].value);
  }
}

Answer №1

When working without jquery, the val() method will not function. Therefore, modify hiddenInputEdit[i].val() to hiddenInputEdit[i].value

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

Enhance Odoo Conversations (mail)

I've been attempting to customize the Odoo discussions, but have hit a roadblock. Here is my goal: https://i.sstatic.net/1lJnc.png I am adding messages using the "New Message" button to an Odoo module (in class mro.order). The messages are appearing ...

Creating an AJAX function to display a popup window for users who are already registered - here's how!

I am currently working on a dropwizard-java project. Whenever users click the subscribe button, it displays a thank you message for subscribing and then checks if the user is already registered. I would like to have a pop-up window immediately show whethe ...

Exploring the process of gathering information using Node.js' http.request

I am currently facing a challenge where I need to call a REST API URL in one method and then use the response from that call to form a subsequent query to another URL, let's say git, to fetch some information. Despite browsing through several examples ...

What is the best method for having Grunt monitor Compass changes without interrupting an Express server?

I have a good grasp on how to set up grunt to watch for changes in sass files and compile them, as well as starting an express server. However, I'm struggling to find a way to keep the express server running while also watching for changes in the sass ...

The local server for handling HTTP requests has ceased to operate

Recently, I set up the NPM package along with the http server within the "server" directory. Initially, everything was functioning smoothly; however, the server abruptly ceased operating. Upon attempting to launch the local http server, an error message a ...

Error - Headers already sent cannot be modified

In my Express app, I have a route that sets a cookie after a session is written to the database. However, when the session is successfully written to the database, the route uses res.render to redirect the user to /login, triggering the "can't set hea ...

Express-JWT and Auth0 encountered an absence of authorization token

Currently, I am in the process of integrating Auth0 into a MERN Stack application. The expected flow is as follows: When the user clicks the login button, it triggers Auth0Lock.show() The user enters their credentials and clicks the submit button The API ...

Effective technique for connecting client-side JavaScript with server-side node.js

I am striving to create a compact website featuring field auto-completion, drawing suggestions from the server's database (utilizing Node.js + MySQL). What approaches can I take to establish client-server communication as the user inputs data into a ...

"Concurrency issues arise when using multiple AJAX calls in jQuery, causing confusion with

This piece of JavaScript code involves a series of AJAX calls to my FastCGI module in order to retrieve certain values. However, there seems to be an issue where the value intended for display in "div2" is ending up in "div1", and vice versa, ultimately ca ...

What is the most efficient method for transferring session data from a Client component to a server component in NEXT.js version 13 and beyond?

Currently, I am working on a web application that requires passing session?.user?.email from the useSession() function in next-auth/react to a server-side component. This server-side component will then execute a fetch request to /api/users/email/ to deter ...

Move the menu button to the right of the title slide, beyond the edge of the card

Having an issue with the MuiCardHeader component. <CardHeader disableTypography avatar={renderAvatar()} action={ <IconButton onClick={toggleMenu}> <img src={MoreIcon} alt=""/> </IconButton ...

ERROR: Module 'jquery' not found in path 'C:....' when using Gulp and Browserify

Encountering an error: Error: Module 'jquery' not found in path 'F:...\newstyle\assets\lib\helper\html\img\js' at C:\Users...\AppData\Roaming\npm\node_modules&bs ...

Attempting to create a school project involving pizza, but encountering some technical difficulties

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>pizza ...

Troubleshooting when routers.get and app.use are not functioning properly within Express

After using express-generator to set up a new express project, I wanted to implement a subrouting system where "localhost/" leads to the index page, "localhost/projects" displays the projects page, and "localhost/projects/randomCircles" shows circles. Nod ...

Exploring the connections among nodes in a Force-Directed Graph using D3.js JavaScript

I am currently working on a complex graph that consists of around 150 nodes using D3 Javascript. The concept behind it is quite intriguing: Each node is interconnected with 100 other nodes. Out of these 100 nodes, 49 are further linked to another set of ...

The CustomValidator ClientValidationFunction will only activate on the second or subsequent submission if CheckBoxList is checked

I am encountering an issue with a user control that is dynamically added to pages on DNN. The user control is built on a customized version of CheckBoxList and includes a CustomValidator with ClientValidationFunction set to a javascript function. It works ...

Displaying an array of data using ng-repeat, only showing records where the value is found within a field of another object

Within my project, I am working with two types of objects: 'ing' containing fields 'id' and 'field', and 'fObj' containing a field named 'contain'. Using ng-repeat, I am trying to display only those ' ...

experiencing difficulties in retrieving the outcome from a sweetalert2 popup

function confirmation() { swal.fire({ title: "Are you absolutely certain?", text: "You are about to permanently delete important files", type: "warning", showCancelButton: true, show ...

Converting a string to a JSON array with Jackson in RESTful APIs

As I delve into the world of JSON and REST, I find myself testing a REST API that returns strings in the following format: [{ "Supervisor_UniqueName": "adavis", "Active": "true", "DefaultCurrency_UniqueName": "USD", "arches_type": "x-zensa ...

Stopping React component click event from bubbling up to document

How do I prevent a click event in a React component from bubbling up to the document? There seems to be an issue that needs fixing! Let's see if we can resolve it on our own. I have a box component with a click event listener, and some link compone ...