Can I Make dmx-on:click Open a New Page?

Hey @Teodor

I’m sure the answer to this is simple…

On my web site I have a row… and I want an action such that whenever someone clicks within the row, it opens another page. So like the behaviour of <a href="new_page.html">, but actioned with a dmx-on:click.

How can I do that?

1 Like

If you have the browser component on your page you will be able to active its GOTO event with dmx-on:click

That’s the one… Thank you @Sorry_Duh! :slight_smile:

2 Likes

yes but goto doesn’t let it open in a new browser tab, how to do that?

This will help you out

If you do not want to show the link, then hide it using CSS as in

a.mylink {
    margin-left: -10000px;
}

You can’t do that with a click event, you will need to use an <a> tag and set the target as _blank.

Here is some html code that does the trick:

<div class="row bg-light position-relative">
    <div class="col-md-6 position-static p-4 pl-md-0">
        <h5 class="mt-0">Columns with stretched link</h5>
        <p>Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.</p>
        <a href="https://wappler.io/" class="stretched-link" style="margin-left: -1000px;" target="_blank">Go somewhere</a>
    </div>
</div>
1 Like

Hello @ben , with attribute a I know it works I want to do this with GO TO do you understand?

You can't. That method uses pushState to replace the url in the browser history of the current tab and then issues a DOM update through App Connect therefore loading the target URL.

To open a new tab on click simply use normal javascript like onclick="window.open('https://google.com', '_blank')". It is possible that it will not work in all browsers since popups are standard being blocked.

Window.open() - Web APIs | MDN (mozilla.org)

2 Likes

You can also call the click() method of the anchor element if you already have it present in the page but you need to dynamically call it from another place. You could even create a hidden anchor tag with a target attribute _blank and programatically click it.

onclick="document.getElementById('anchor_id').click()"

2 Likes