How do I ingest the URL into a HTML-Component based Textbox?

Ask the community
,
1

Hi There,

I have a sign up page with some information and a HTML-component block, which hosts the sign up form. I’d like to parse the url from the landing page (ie. ww.example.com) into the html-code block and then pre-fill it into one of the available text-boxes.

What I have done so far is the following:

  1. I have imported to the main page the wixLocation package, called the URL and sent it to the html-component (called “html1”):
    (based on this Resources Page: wix-location-frontend - Velo API Reference - Wix.com)
import wixLocation from 'wix-location';
$w.onReady(function () {
 //TODO: write your page related code here...
 let compUrl = wixLocation.baseUrl;
 $w('#html1').postMessage(compUrl);
});
  1. In the HTML-Component, I try to receive the message with the URL, the page is sending, and include it into the text box “URL Textbox”, which is part of the HTML code (I am using the name attribute, not the ID attribute).
    (based on this Resources Page: Velo: Working with the HTML iframe Element | Help Center | Wix.com)
    This is what I have so far:
<script type="text/javascript"> 
	window.onmessage = (event) => {
    		if (event.data) {
       	let receivedData = event.data;
		$w("#URL_textbox").value = receivedData
		}
	};

All that said, when I test the page, the URL will not be populated into the text box as a default.
Do you have any ideas/tips?

2

pushing this on top of the pile with the hope that someone can help me out. Thanks!

3

Hi Dirk,

Regarding the HTML component (iFrame), you can’t edit it via code.
For the second question, you have to define a text box above the script code and assign the receivedData to it .

Hope this helps!
Mustafa