hey,
I have a set of images which trigger, respectfully, a set of hidden radio buttons in a search. The code goes like this:
jQuery(".radio-trigger").click(function() {
var triggerIndex = jQuery(this).index();
var targetIndex = jQuery(".form-check").eq(triggerIndex);
targetIndex.find("input").trigger('click');
});
the correct radio is being triggered, but once the view results are updated, somehow the first radio button is being automatically triggered again, which messes up the results. Where am I wrong?
You can see this happening here: lien caché
cheers
Ido
Hello,
I assume we are talking about these hidden radio inputs:
- תמורתיות
- פרסונליות
I have tried it in the URL you mentioned above:
Click one of images, for example: גלוקליות
It works fine, I see the radio input "פרסונליות" is checked, see screenshot radios.JPG
Is there any missing? please provide detail steps to duplicate the same problem, thanks
try going to the link again but don't change any filter values other than pressing the images (so that you can see all radio button appearing - there are 6). then play around and see that if you press, for example, the fourth image - what happens.
thx Luo!
Since it is a custom JS codes problem, please provide your website credentials in below private message box, I need to test and debug it in a live website, thanks
Thanks for the details, I have done below modifications in your website:
Edit JS Code "Search":
lien caché
replace line 7 from:
jQuery(".radio-trigger").click(function() {
With:
jQuery(".radio-trigger").click(function(e) {
e.preventDefault();
So click the images won't be able to trigger Views AJAX search, but change the radio input values will trigger Views AJAX search, it is only an example for your reference.
More help:
lien caché
hey
thx - but issue persists. try clicking on the 3rd icon two times, for example
cheers
ido
I have checked again in your website:
1) Deactivate custom JS Code "Search":
lien caché
2) Edit the post view "tracks1"
lien caché
in section "Search and Pagination", click "JS Editor", change the JS codes, add a line:
console.log(triggerIndex);
3) Test it in front-end:
lien caché
Click the 3rd image, and check it in my Chrome browser, I see two results:
It should output only one result: 3, it conducts the problem.
Then I have checked the source HTML codes of above problem URL:
view-source:lien caché
There are 12 HTML elements are using CSS class name "radio-trigger", as I understand from your JS codes, there should be only 6 HTML elements using this CSS class name, I suggest you remove the CSS class name from other those unused HTML elements.
My issue is resolved now. Thank you!