Passing an input value into JavaScript.

Hi there,

Currently, I’m storing a user value from an input field into a session wix-storage variable, and pass the value to the next page.

import { session } from ‘wix-storage’ ;
import wixLocation from ‘wix-location’ ;

$w . onReady ( function () {
});

export function save_zip_quote ( event ) {
let UserName = $w ( “#zip” ). value
session . setItem ( “UserName” , UserName )
wixLocation . to ( “https://secondURL” )

}

I can easily retrieve the value on the second page.

import { session } from ‘wix-storage’ ;

$w . onReady ( function () {
let value = session . getItem ( “UserName” )
$w ( “#text29” ). text = value
});

To prove that the value is passed I showed it as text.

What I would like to do, is to use that value to replace a value on a javascript I have installed in an iFrame on the second page.

How can I include the save value into the JavaScript?

Thanks!

See the article Sending a Message from Page Code to an HTML Element .

Thanks Yisrael!

Another question that I haven’t figure it out yet is how to place the script in a way that I still have control.

Currently, I have tried to place the javascript as custom embeds but when publishing the page, the javascript doesn’t show the results to display. The only way I have found that it works is if I place the code inside the body of custom code under settings.

If I place it there it shows it content but it breaks the design. It shows on the top of the navigation and I cannot move it or place it anywhere else.

When looking at the code from the browser I see the javascript there.


What I’m trying to accomplish is to get the user zip code input, from a previous page, that I have been able to save in the session and replace the value “zip” from the javascript from the value saved in the session, while being able to place the results inside the design of the page.

Any suggestions?

Thank you!!

@faznar The article that I linked to shows how to send messages to and from an HtmlComponent . This will not work for custom embeds (in the header/body/footer).

You can also use a Custom Element which allows much greater flexibility.