Set Link Button to Open in a New Tab
1. Add the newTab
class to the Link Button and set the Page Link to the current page.
Note: Setting the Page Link to the current page will 'disable' the default link settings. You will then add a custom link using the code below.
2. Add the following code into the JavaScript tab of the page. Replace /sample/page
with the link of the page you are opening and component_xx
with your component number.
JavaScript Code:
TB.render('component_XX',function(data){
$(".newTab").click(function() {
window.open('/sample/page', '_blank');
});
});
Find the Component Number
You can find your component number by hovering over the info icon at the top of the component in the builder.
Multiple Link Buttons
The attribute target="_blank"
can only be applied to <a href
links, not button links, so the only way to use a single script to target all of the buttons on a page would be to create custom HTML buttons in an HTML module and give them the same class. (You can replace newTab
with any class name you choose.)
Then you could use the following JavaScript code:
$(document).ready(function() {
$('a.newTab').click(function(){
window.open(this.href);
return false;
});
});
Original Community Post:
https://community.tadabase.io/t/link-button-target-new-window/2131/6