Hello Forum,
I have been searching for a way to connect a text box in my repeater to the associated URL link within my dataset. I found a couple of previous posts on this topic, but none of the example codes/solutions have worked for me thus far.
Within the repeater "#repeater1", I have text box "#text13" that I wish to activate an on-click event. When clicked, I want this to direct the user to the associated URL in a new tab. The URL is contained in the repeater's associated dataset with its column labeled "website." The "website" column is defined to contain URLs (not text, boolean, etc.).
I have used the following code:
import wixLocation from 'wix-location'; $w.onReady(function () { $w('#repeater1').onItemReady((selector, itemData, index) => { $w('#text13').onClick(() => { wixLocation.to(itemData.website); }); }); });
When I play with this in preview mode, the arrow changes as I hover over the text as if I can click it as a hyperlink. However, clicking the text does not result in any event. To be sure I was not simply setting up bad links, I used the user interface to link a repeater image to the same URL column, and that works fine. The code, it seems, is not allowing me to open up the desired webpage.
I would really appreciate your help with this issue!
Hello Russia-dima,
So I found one part of the problem. In my function declaration, I had "item" not "$item." Changing this, I now have the URL being returned as a string (confirmed by the console log). However, the darn wixLocation.to(myURL) isn't taking me to the link...hmmm. Everything else seems to be in order, so I'll have to dig on this a bit. Any thoughts on the issue are welcome! Thanks again for all of your insight through this.
import wixLocation from 'wix-location'; $w.onReady(function () { $w('#repeater1').onItemReady(($item, itemData, index) =>{ $item('#text13').onClick(() => { let myURL = itemData.website console.log(myURL) console.log(typeof myURL) wixLocation.to(myURL); }); }); });
Hello All,
Thank you for your kind responses. I took Code Queen's advice and changed the $w('#text13').onClick to $item('#text13').onClick.
However, this throws the error "$item is not defined). I feel like item has already been defined at the beginning of the function for the repeater, so I'm confused as to why it's giving the error.
This error does not occur when I have $w, however, using the console log (thanks russian-dima!) each time I click on a linked text, I see that it cycles through all of the URLs in the repeater, but does not take me to any of the addresses.
My full code (with the $item variation) is as follows:
import wixLocation from 'wix-location'; $w.onReady(function () { $w('#repeater1').onItemReady((item, itemData, index) =>{ $item('#text13').onClick(() => { let myURL = itemData.website console.log(myURL) console.log(typeof myURL) wixLocation.to(myURL); }); }); });
Instead of
$w('#text13').onClick
try
$item('#text13').onClick
Or instead of text, use a button and connect it directly to the url field.
Try this one, also take attention onto the given CONSOLE-LOGS.
Look into the CONSOLE, to see the results.
import wixLocation from 'wix-location'; $w.onReady(function () { $w('#repeater1').onItemReady((item, itemData, index) =>{ $w('#text13').onClick(() => { let myURL = itemData.website console.log(myURL) console.log(typeof myURL) wixLocation.to(myURL); }); }); });
myURL ---> musst be a string-URL --> ("https://www.google.de") for example.