Include a class for CSS styling in EJS using Node.js

Attention: Please be aware of the environment in this Application. The following technologies are being used:

  1. Windows
  2. NPM, Express
  3. MySQL

This is the code in an ejs template called example.ejs

<% if (message) { %>
                <p class="alert " id="errorMessage">
                    <%= message %>
                </p>
            <% } %>

I am trying to add a class to the p element.

This is what I have attempted so far but it hasn't worked.

messages = "Password Successfully Changed";
jQuery('#errorMessage').addClass('successMessage');
res.render('profile',{page_title:"My Profile",data:rows,message: messages});

Answer №1

The solution has been discovered.

const data = {
  response : "Password Changed Successfully",
  messageType : "successMessage"
};
res.render('profile',{page_title:"My Profile",data:rows,message: data });

Next, on the template side.

<% if (globalMessage) { %>
    <p class="alert <%= globalMessage.messageType %>" id="errorMessage">
       <%= globalMessage.response %>
    </p>
<% } %>

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

Encountering an EPIPE error while using html-pdf in a meteor

Currently, I am encountering an issue with my Meteor app when rendering a PDF server-side using the html-pdf package. The application is deployed with mup. While everything works perfectly fine locally, a server log error occurs upon deployment: events.js ...

Tools for parsing command strings in NodeJS

Currently, I'm utilizing SailsJS for my application. Users will input commands through the front-end using NodeWebkit, which are then sent to the server via sockets. Once received, these commands are parsed in the back-end and a specific service/cont ...

Error encountered: No geographic indices found for executing a geoNear operation with Mongoose

Initially, I had divided the schemas but later nested them inside my overall document. Despite adding indexes and removing coordinates from location, there seems to be an issue with the nested points. Upon running get Indexes, it shows that there is an i ...

Exploring GraphQL.js: Diving into Argument Usage within Subfields

After successfully setting up a GraphQL database using GraphQL.js and Express, I have managed to fetch data from a hardcoded JSON-Object. The structure of my JSON-Object is as follows: exports.store = { "categories": { ... }, "customers": { ... }, "ven ...

Retrieve the directory path to the npm module folder that does not have a main file specified

What is the process for obtaining the path to the directory where an npm module is located? I attempted to use require.resolve, but encountered the following error: Error: Cannot find module 'bower-strapless'. (despite having already install ...

What could be causing my function to execute thrice?

I cannot seem to figure out why my tag cloud is causing the required function to run multiple times instead of just once when I click on a tag. This issue persists whether using jQuery or plain JavaScript. What am I missing? The code I have is very simple, ...

Hide the Modal Content using JavaScript initially, and only reveal it once the Onclick Button is activated. Upon clicking the button, the Modal should then be displayed to

While trying to complete this assignment, I initially attempted to search for JavaScript code that would work. Unfortunately, my first submission resulted in messing up the bootstrap code provided by the professors. They specifically requested us to use Ja ...

Design an arrangement using div elements and CSS styling

Creating a layout for a website can be challenging. I am using three div tags - container, left, and right. My goal is to have the left side fixed-width for navigation, while the right side displays dynamic content loaded from a database. However, I'm ...

Css technique for changing color on mouse hover

I currently have a social media bar on my website with icons for Facebook, Twitter, Google+, and RSS. Here is how it looks: When I hover over the icons, I want the circle around the image to change color to blue. However, every attempt I've made end ...

Use joi to validate the entire request object

In order to ensure the validity of request input before calling the controller logic, I developed a middleware for that purpose. Let's suppose we have a route for "getting user by id". const usersController = require('../controllers/users.js&ap ...

Retrieve a specific item from a JSON response using Node.js

When I receive a message from a WebSocket, the code snippet is triggered like this: ws.onmessage = (e) => { debugger if (e.data.startsWith('MESSAGE')) alert(JSON.stringify(e.data)) ImageReceived(e.data) c ...

Mongoose is unable to update arrays, so it will simply create a new array

Having trouble updating my collection without any errors. Can someone lend a hand? I've been at this for 3 hours now. const product_id = req.body.cartItems.product_id; const item = cart.cartItems.find(c => c.product_id == product_id); i ...

NodeJS executor fails to recognize Typescript's CommonJS Internal Modules

In the process of developing my NodeJS application, I am structuring it by creating internal modules to effectively manage my code logic. This allows me to reference these modules without specifying the full path every time. internal-module.ts export cla ...

What is the best way to obtain the ID following a fetch request?

I'm trying to target the ID specifically, but when I console log the data retrieved after making a fetch request, it contains more information than just the ID. I want to know how to extract and print only the ID from the response in the console. fetc ...

What could be the reason for Internet Explorer pulling styles from the media=print CSS?

The HTML below incorporates a DHTML behavior into a CSS class. Unfortunately, Internet Explorer (specifically version 8 in compatibility mode) does not read the top style exclusively; instead, it also recognizes the @media print. <!--[if IE]> < ...

Error in Angular: Unexpected '<' token

After setting up my angular and express app using the angular-cli and express command lines, I successfully built the angular app with the ng build command. However, when attempting to serve it with the express server, I encountered the following error in ...

Updating a package using the `npm update` command does not result in the package being updated

I have been attempting to upgrade the webpack-dev-server package from version 3.11.2 to the latest version, which is 4.7.3 based on my npm outdated command: root@fdaf6460fe1a:/home/ubuntu/myapp# npm outdated Package Current Wanted Latest L ...

Eliminating a specific index item from an array (MongoDB, NodeJS, React)

I am currently working on an application that includes a devices-array containing objects with device_name and device_id properties. My goal is to remove a specific device from this array based on user input. I have attempted to use methods like findIndex ...

Is there a way to utilize jQuery to redirect to the href included in the HTML attachment?

I am looking to add a redirection feature to my website using the href provided in the code by jQuery. This will be done after playing an animation for better user experience. $(document).ready(function(){ $("a").click(function(event){ event.prev ...

How can we use a :before tag element to create a hovering effect on an image that remains clickable?

My objective is to create an image that is wrapped in a link. The link will have a pseudo element :before that adds a black overlay on hover. I want the image to remain clickable, but no matter what I try, the pseudo element won't position correctly o ...