I use Alpine to fetch API. A button allows users to copy the text and I'd like to add the onclick attribute.
HTML code:
<div x-data="{ code: 'SALE10' }"> <button x-clipboard="code" @click="$tooltip('Copied')" onclick="setTimeout('window.open(\')', 900);">Copy this</button> </div> in which, I use the clipboard x-clipboard to target and copy code. I use the Alpine tooltip to show the notification after clicking. Then, open a new tab . The site.url will return a URL, and I also tried:
:onclick="setTimeout('window.open(\'site.url\')', 900); Please let me know how to make it works. In general, I'd like to create a button that a user will click to copy the code and the link will be opened automatically. Any better recommendation? Thanks much for your answer!
1 Answer
With Alpine.js the @click attribute is literally the onclick. You can provide multiple statements there:
<div x-data="{ url: ' }"> <button x-clipboard="url" @click="$tooltip('Copied'); setTimeout(() => {window.open(url)}, 900)">Copy this</button> </div> 
