[Resolved] Using Javascript inside a Toolset View loop

[Author]

Posts

[alistairW-2]

Tell us what you are trying to do?

I have a toolset search view that displays products and their links. I need each link to be appended (end of url) with some text (that is used in the product page to run an automatic google search). I am testing using javascript to append this text to the end of each product link in the view loop. The code does get appended correctly to the first product in the view but then every subsequent product it does not appear. I thought adding this within the loop would replicate it for each product. I have tried attaching the javascript to the container the view is in but that does not work either.
(I am a beginner at both HTML and JS)

Is there any documentation that you are following?
I used this page (hidden link) as a basis for the javascript

This is the HTML item within the loop:
<script src="hidden link"></script><div id="mine">
<a id="mine" class="mysearch21" href="[wpv-post-url ] [mysearchq]">
[wpv-conditional if="....

...</a>

Within the Toolset Loop I have the following in the LOOP Custom JS and CSS<>:

$(document).ready(function() {
var trail = 'my extra text';
var original = $("#mine").find('a').attr('href');
$("#mine").find('a').attr('href', original + trail);
});

WHy is the loop not repeating the javascript?

What is the link to your site?
this page shows the issue hidden link

[Minesh Supporter Languages: English (English ) Timezone: Asia/Kolkata (GMT+05:30)]

Hello. Thank you for contacting the Toolset support.

I'm not sure why you are adding the custom JS to view's loop area as you should add the custom JS to the JS section offered by Views.

More info:
- https://toolset.com/course-lesson/adding-custom-javascript-to-views-templates-and-archives/

[alistairW-2]

Hey Minesh
Sorry my mistake the JS is in the JS section offered by Views and as I say it only applies the JS and hence text to the first product in the loop. Image attached.

[Minesh Supporter Languages: English (English ) Timezone: Asia/Kolkata (GMT+05:30)]

I see you have added the script based on the element ID attribute and element ID should be unique. To apply the JS to all the elements you should have used class name.

For example - what if you try to use the following JS code:

jQuery(document).ready(function($) {
var trail = 'my extra text';
var original = $("div#mine").find('a').attr('href');
jQuery(".mysearch21").each(function(){
var original =  jQuery(this).attr('href');
jQuery(this).attr('href', original + trail);
});
});

Can you please try the above code - does that works? if no:
- I will require problem URL where you added the view and admin access details.

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I have set the next reply to private which means only you and I have access to it.