Display dynamically created JavaScript variable in Rails code

I have been working on incorporating links into a google map feature on my website. Each link is supposed to connect to a different venue within the site. To achieve this, I have been using JavaScript and following tutorials provided by Google API.

The variable 'place' is dynamically generated by JavaScript, and I want it to represent the name of the link. However, when I use the following notation:

contentString = '<%=link_to '+place.name+'%>';

it displays the result as: +place.name+ (which is underlined as it is recognized as a link).

I know that there must be a simple mistake in my approach, but I am unable to identify it. Any assistance or guidance would be highly appreciated.

javascriptruby-on-railsgoogle-maps-api-3

Answer №1

Unfortunately, it is not possible to access JavaScript variables from Rails views during compilation. One workaround could be using JavaScript to modify the link text, but this may not suit your needs. It might be best to construct your string without relying on Rails helpers.

contentString = '<a href="/another/path">' + location.name + '</a>'

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

The functionality of updating input values via jQuery AJAX in HTML response is currently not functioning as expected

Hello, I need some assistance. I'm encountering difficulty with jQuery in modifying HTML values that are dynamically inserted through an AJAX response. Here is the link to the JSFiddle. Below is the HTML on the page: <button id="test">test&l ...

javascriptjqueryhtmlajax

Is it possible for object destructuring in Javascript to include dynamic non-rest keys using ...rest?

Suppose we have an object: const obj = { key1: "value1", key2: "value2", key3: "value3", key4: "value4" }; My goal is to filter out specific keys from this object to create a smaller one. I am aware of the following ...

javascriptarraystypescriptdynamicdestructuring

Verify a unique cross-field rule for comparing two time strings, customized by Vee

I am currently facing an issue with validating two time strings in my buefy form using vue. The goal is to ensure that the second time input does not exceed a one-hour difference from the first time input. Both time fields have granularity down to millisec ...

javascriptvue.jsvee-validate

How can I pass an array from HTML to Node.js and subsequently store it in MongoDB?

Looking to combine the values of longitude and latitude into one array for input, then store it in the database. While there are plenty of examples on handling arrays, most of them are based on PHP. Check out the following code snippet: HTML <html> ...

javascriptjqueryhtmlnode.jsmongodb

Continue iterating using (forEach, map,...) until the object (children) has no more elements

I need to disable the active status for all elements within my object structure. Here is an example of my object: const obj = { name: 'obj1' , ative: true , children: [ { name: 'obj2' , ative: true , children: ...

javascripttypescriptjavascript-objects

Creating custom methods or functions within imported models in Sequelize: A guide

As a newcomer to the world of Node.js, I am embarking on my initial project involving node development. While my background primarily revolves around utilizing Laravel for various projects, I am well-versed in the concepts of MVC (Model View Controller). I ...

javascriptnode.jsormsequelize.js

Single input results in array output

I have a pair of items in this array list. $.each(data.recalls,function(i) { var recall = data.recalls[i].nnaId; var description = data.recalls[i].remedyDescription; console.log(recall); console.log(description); $('textarea[name= ...

javascripthtmlarrays

What is the method to determine the number of unauthorized individuals who accessed a specific URL in a Node.js environment?

Currently, I am working with ExpressJs and MongoDB. My goal is to display the number of unique unauthorized users who have accessed a particular event page. What would be the best approach for implementing this request counter? Should I track IP addre ...

javascriptnode.jsmongodbmongooseexpress

Locate the index position of an element in one array based on a corresponding element in a

I am seeking a way to determine the index and group that an item belongs to within a parent json group. Is there a method for achieving this? I am willing to modify the json format if necessary. I made an attempt using JSON.stringify(), but it seems to be ...

javascriptarraysjsonindexingfind

Node React authentication

Struggling with implementing authentication in React Router. I am using componentDidMount to check if the user is logged in by calling an endpoint. If not, it should redirect to login, otherwise proceed to the desired component. However, this setup doesn&a ...

javascriptnode.jsreactjsexpressreact-router

Sequence of successive jQuery requests

Currently, I have a series of ajax calls that must be executed sequentially, without the possibility of being performed in parallel. The function performSeriesofCalls essentially makes ajax calls in the specific order of Call1 -> Call2 -> Call3 -> ...

javascriptjqueryajaxdeferred

Delivering XML in response to a webmethod call

While working with an ajax PageMethod to call an asp.net webmethod, I encountered an issue when trying to pass a significant amount of XML back to a callback javascript function. Currently, I am converting the XML into a string and passing it in that form ...

javascriptajaxxmlvb.netwebmethod

Tips for using a .map() function in conjunction with a promise

I am faced with a challenge where I have an array and for each element in the array, I need to retrieve some data based on that element and then append it to the respective element in the array. For illustration purposes, I will create a simulated fetch o ...

javascriptpromisees6-promisemap-function

Enhance the appearance of Ionic popups

Can someone help me with resizing a pop up? I've been struggling to get it right. This is the popup template in question: <ion-view> <ion-content scroll="false" class=""> test </ion-content> < ...

javascriptangularjsionic-frameworkpopup

Error in Next.js Image Component: Missing SRC

Encountering an error with the next.js image component, specifically related to a missing "src" property. Error: Image is missing required "src" property. Make sure you pass "src" in props to the `next/image` component. Received: {} Th ...

javascriptnext.js

Why doesn't jQuery ajax work when sourcing the URL from a variable but works with a hard-coded URL?

During my experimentation with setting and getting the URL for a jQuery Ajax (post) call, I realized the value of dynamically setting the destination URL for the request. Here's how I attempted to achieve this: To set the URL to 'store.php' ...

javascriptphpjqueryajax

Animating objects in ThreeJS to traverse multiple positions smoothly with linear interpolation (lerp)

I am exploring ways to animate a sphere's movement along a predefined sequence of vertices. I have successfully managed to animate the sphere from one point to another using the code below: function animate() { requestAnimationFrame(animate) spher ...

javascriptanimationthree.js

Submit a collection of images and an object to the server using ReactJS

I'm currently working with Reactjs on the frontend. In order to set the profile picture to state, I've implemented the following code: handleImageChange = (event) => { event.preventDefault(); var file = event.target.files[ ...

javascriptreactjsaxiosfetch

Deciphering the LocalDate and nested object array in an AJAX response

Seeking assistance, looking for solutions to two problems. Firstly, how can I display LocalDate in an ajax response? And secondly, how do I iterate over a list of Custom objects received in the ajax response? I am passing a List of Custom Objects and Loca ...

javascriptjqueryjsonajaxlist

The eternal dilemma: async with axios or simply axios, which will you choose?

Is there a difference between these two useEffect functions? useEffect(()=>{ async function fetchData(){ await axios .get(path, config) .then(resp=>console.log(resp)) .catch(error=>console.log(error)) } fetchData(); },[ ...

javascriptreactjsasync-awaitaxios