Enrico Brugnoni asked 1 year ago
*See attachment
I need to modify the events of what happens when you click on the name of the image uploaded under a field, now once clicked it opens up a new tab and redirects the user to it, i need it to open a new tab and stay in the page.
I tried a multitude of approaches, i created the javascript code and inserted as a snippet,
also tried following this: https://formidableforms.com/knowledgebase/javascript-examples/And inserting it as a script in the \"after fields\" in the html part
Here is the javascript code used:.console.log(\"Diagnostic script started\");document.addEventListener(\'DOMContentLoaded\', function() { console.log(\"DOM loaded\"); var links = document.querySelectorAll(\'[data-dz-name] a\'); console.log(\"Number of links found:\", links.length); links.forEach(function(link) { link.addEventListener(\'click\', function(event) { console.log(\"Link clicked (bubbling phase)\"); event.preventDefault(); var newTab = window.open(link.href, \'_blank\'); window.focus(); }); // Add an event listener in the capturing phase link.addEventListener(\'click\', function(event) { console.log(\"Link clicked (capturing phase)\"); }, true); });});
The code is being run, seen from the console, but when using inspect element, the element always remains the same>
I tried a multitude of different codes and different approaches, but nothing worked, how can i change this?
Victor Font answered 1 year ago
Victor Font
replied 1 year ago Neither the thumbnail image nor the text are links. The thumbnail is an image and the text is just hard coded text. You would have to use jQuery to convert them to links so you can realize your requirements.
Enrico Brugnoni
replied 1 year ago in both cases this failed to show you the code since it's just printing the link itself, the following is what i am referring to when i say "the link", the one that is pressed in the attachment image
<blockquote><span data-dz-name=""><a href="https://relegiskey.com/wp-content/uploads/formidable/2/upload_field.jpeg" target="_blank" rel="noopener">upload_field.jpeg</a></span></blockquote>
This shows that within the with the data-dz-name attribute, there is an anchor (<a>) tag, which is a link. This means that when users click on the text "upload_field.jpeg", they are clicking on a link.
*I added a new attachment to the original question so that you can better understant what i am saying
In the code i also added 2 debugging lines, one that tells me the number of links present, and the other tells me when a link is pressed, and they both work, suggesting the links are already there, but, no matter what i try, i just can't modify their behaviour.
Rob LeVine
replied 1 year ago Provide a link t o your website and a clear set of steps to reproduce the issue.
Enrico Brugnoni
replied 1 year ago Sure!
1 - Enter the website: https://relegiskey.com/login/
2 - log in with these credentials:
email: [email protected]
pass: Test1234
3 - Once logged in, you will see all the form entries displayed (one in this case)
4 - Press on "modifica" (Button in blue in the view, the last one), to view the full entry and modify it
5 - Once inside, you can see a lot of upload field, in some of them there are some uploaded files, for example the file "logo_agenzia" under the "Carta di identità" field, this is where the issue arises
6 - Different people would need to click on those files to see its contents, once you click on the name of the file (So you press on "logo_agenzia") a new tab is opened with the image, i would need the tab to open but the user to remain in the same page, so in the one where he is visualizing the full entry.
Is there any way of modifying such behaviour? If you need any more informations do not heasistate to ask, thanks a lot in andvance!
Rob LeVine
replied 1 year ago Thanks for the steps. Based on my research, you can no longer use javascript to open up a new tab without the focus being switched to it. Each user on his/her own browser can make it act that way, but it's no longer an option for a programmer to do that.
See the following for discussions and Fiddles that show the solution no longer works:
https://stackoverflow.com/questions/10812628/open-a-new-tab-in-the-background
https://stackoverflow.com/questions/7522565/how-to-stay-on-current-window-when-the-link-opens-in-new-tab
See the following for how to have an individual user make the change:
https://support.mozilla.org/en-US/questions/1327563
I'm wondering if you're not better off changing the link to a rollover popup that shows the image in its own box.
Enrico Brugnoni
replied 1 year ago Thank you for your research and you answer Rob! i will try to do such a thing, thanks again and have a good day!!
Victor Font answered 1 year ago
Enrico Brugnoni
replied 1 year ago I see, looking at the code it seems like its working different for me and you since i do have a link there, thank you anyway for yor time Victor, i really appreciate it!
Please login or Register to submit your answer
![https://relegiskey.com/wp-content/uploads/formidable/2/upload_field.jpeg"](https://relegiskey.com/wp-content/uploads/formidable/2/upload_field.jpeg"){kind=link}