wire:click

CBWIRE simplifies invoking component actions using the wire:click directive. This directive allows actions to be executed when a user clicks on a specified element.

Example: SendEmail Component

Take, for example, the SendEmail component:

// wires/SendEmail.cfc
component extends="cbwire.models.Component"{
    
    data = {
        "sent": false
    };
    
    function sendEmail(){
        // Email sending logic
        data.sent = true;
    }
    
    function renderIt(){
        return template( "wires.sendemail" );
    }
}

<!--- wires/sendemail.cfm --->
<button type="button" wire:click="sendEmail">Send Email</button>

By adding wire:click="sendEmail" to a button, the sendEmail() method is triggered upon click.

Links

To use wire:click effectively on link elements, it's crucial to add .prevent to the directive. This stops the default browser from navigating to the link target and altering the page's URL. For example:

<a href="#" wire:click.prevent="...">

You can a wire:click to any HTML element.