Setting image tooltip in repeater to empty string, resets when you go to next page or change filter

Ask the community
, ,
1

Question:
How do I keep the tool tip of an image from a repeater to stay an empty string?

Product:
Wix Editor.

What are you trying to achieve:
As you change the page or change the filter the tool tip should remain as an empty string and not come up when you hover over it.

What have you already tried:
I’ve manage to change the tool tip value to ‘empty string’ when you first load the page, but as soon as you go to the next page of data or change filter it causes the tool tip revert back to old value of the image. I use the console log to check the tool tip name and it’s still set to ‘empty string’, but that not what’s being displayed.

Additional information:
If you wish to check out the issue, head to www.careerview.com.au/network and hover of the profile images after you change the page for more profiles.

2

I don’t see any tooltips or alt image text on hover on that site. Can you share the code you’re using to update the repeater?

3

I use a function to make the repeater.


$w.onReady(function () {

    $w("#repeater").onItemReady(($w, itemData, index) => {
        makeRepeater()
    })

});


export function dataset1_currentIndexChanged() {
    makeRepeater()
}


function makeRepeater(){

$w("#repeater").forEachItem(($item, itemData, index) => {

    $item('#image').tooltip = "Click to see more.";

});

}

Hope that might help.

4

Thanks for the speedy reply. The tooltips only starts to show if you click on the next page of data/ repeater or if you use the search to change the filter.

My code looks similar to dan25947 from below. I’ll send a copy of my code around 5pm (GMT+8)

5

Thanks for the response, my code looks very similar to yours expect for ‘dataset1_currentIndexChanged’

I think I tried to execute ‘makeRepeater’ when the repeater or the page changes, but that didn’t help. I’ll try the above later tonight and see if that works.

6

@anthony I’ve included snippet of the repeater part. I know it getting called as I’ve logged it in the console and the other data updates as expected. As soon as you load the next page of data or use the search feature the tooltip reverts back to normal.

function updateDataProfile () 
{
	repeater.forEachItem(($item, itemData, index) => 
	{
		$item('#text23').text = "Career: " + itemData.jobTitle;
		$item('#text22').text = "Age: " + itemData.age;
		$item('#image1').tooltip = "Tool Tip name";

		console.log("Name of tooltip: " + $item('#image1').tooltip);


		if(!itemData.podcastSnipper)
		{
			$item('#podcastShortClip').hide();
		}
		else
		{
			$item('#podcastShortClip').show();
		}

		if(itemData.statusButton === "Coming Soon")
		{
			$item("#button6").disable();
		} 
	});	

	console.log("Name of tooltip: " + $w('#image1').tooltip);
	

	$w('#searchInput').onKeyPress(async(event) => {
		if(event.key === "Enter") {
			searchFilter();
		}
	})
}
7

Update:

I’ve noticed when I use the console log and change through each page, the log would output the last tooltip name of the image from previous page.

I did come up with a solution. It’s more expensive but not really noticeable.

export function image1_mouseIn(event) {
	$w('#image1').tooltip = "";
}

I’ll leave this post up for another day, if there any other suggestions.

1 Like
8

You may want to try replacing this with onItemReady() instead. forEachItem() might sometimes execute before the repeater is populated with items.

Of course your current solution also works.