I am trying to navigate to another page on my site and I cant seem to get navigation to work when the element is in a repeater. If you take a look at the screen shot, I have these elements I handle the click action and the only place it works is on the iconButton1 thats not in the repeater. I have also manually set the link on the buttonView button and iconButton and no matter what I do, i cannot get the wixLocation.to() to work in the repeater button. What I am trying to do is to navigate to the Customer page and pass a query parameter to it so I can filter the results based on that.
top of page
Important forum update
This forum is migrating to one unified Wix community forum starting July 26th, and will be read-only during the process.
Wishlist Page is the official platform for requesting new features. You can vote, comment, and track the status of the requested features.
bottom of page
Hi Derick:
OK you have a couple of problems which you need to fix.
1. You set the link value in the $w('#repCustomers').onItemReady() function to '/Customer?id='+itemData.id and you also set the onClick event handler which calls wixLocation.to('/Customer').
2. You are linking to a page uppercase C - Customer however the page name is lowercase c - customer.
The button in the repeater does get called but because there is an error in the page name it doesn't redirect.
The solution to your problem is to use lowercase customer in your link assignment ike this:
$w("#buttonView").link = "/customer?id=" + itemData._id;
and delete the buttonView_click(event) handler function.
OR
If you want to keep the buttonView_click(event) handler then you need to do a couple of things.
a) You need to get the scope selector for the repeater item that the button clicked is in. You do this as follows:
let scopeSelector = $w.at(event.context);
b) You need to get the id for the current item. Normally if you were mapping the fields using a data set this would all be accessible from the dataset. Luckily in your case you have the id as a field in the repeater '#custId'. So you need to get the custId value and then rebuild the location string as follows:
let custId = scopeSelector('#custId'); let targetUrl = 'customer?id='+custId; wixLocation.to(targetUrl);
So remove the statement $w("#buttonView").link = "/customer?id=" + itemData._id.
and use the following click function
export function buttonView_click(event) { console.log("buttonView_click"); let scopeSelector = $w.at(event.context); let custId = scopeSelector('#custId'); let targetUrl = 'customer?id='+custId; wixLocation.to(targetUrl); }
Hope this makes sense and gets you past the current hurdle ;-)
By the way you should get used to checking the URL of target pages for the wixLocation.to() function in the page SEO settings
Steve
here is the URL https://dev0768.wixsite.com/dcsoftware/licensing
Derick:
What is the URL of the page you are having problems with? With that we can see what is happening and debug the published code and give you a response.
I have an example of a Shop ratings page that uses a button on a repeater which fires and loads a ratings update box as expected. I can only imagine that you have some error in wiring up your elements?
Here's the example page and its code:
https://stcroppe.wixsite.com/steveonsoftware/example-code/wix-stores-product-rating
Steve
Actually, I had a link defined in the iconButton1 button. I removed that now none of them works. I also removed the event from buttonView_click event and handler and used the UI to set the same link from both the buttonView and iconButton1 buttons and only the one outside of the repeater works
Derick:
I think your problem might be the console.log statement. Your other two functions log a specific string. The failing function tris to log an object (event). This will fail. If you want to log the event object you should use console.log(JSON.stringify(event));
Steve