Event driven programming in PHP - Reconcile GUI events

Download the demo code

Events provide GUI developers with a way to respond to user actions. The user clicks on a button which raises an event, in turn executes our "subscribed" method(s).

Which is a bit of a tricky thing, especially when we consider the level of abstraction needed to make all of this desirable to use.

 
<html>
    <head>
        <script type="text/javascript">
 
        function doSomething()
        {
            alert("I am doing something");
        }
 
        </script>
    </head>
    <body>
    <input type="button" value="doSomething" onclick="doSomething()" />
    </body>
</html>

The goal is to create a mechanism to translate events from our GUI (javascript events) into something that can raise PHP (server side) events.

PHP will need to know which control triggered the event, and what type of event it was in order to raise the appropriate event.

With that in mind we attach a function called trigger, and pass the current control and event to that method.

 
<input type="button" name="button1" id="button1" value="Go" onclick="trigger(this, event)" />

The current control's id and event type, then gets assigned to a hidden control on the page, and posted to the server.

Consider that we need to create server side controls for our html controls, maintain the state of these controls (future article), and ultimately look at ways to secure requests. (much like what you'd expect from viewstates in ASP.net)

 
<html>	
    <head>
        <title></title>
        <script type="text/javascript">
 
        function trigger(sender, e)
        {
            document.getElementById('_sender').value = sender.id + "," + e.type;
            document.forms[0].submit();
        }
 
        </script>		
    </head>
    <body>
    <form method="POST">
        <input type="hidden" id="_sender" name="_sender" />			
        <? 				
            $btnDemo->Render();
        ?>			
    </form>
    </body>	
</html>

Have a look at the class below named "controls". Commonly there will be a lot of functionality we can reuse among controls, which we can place in a base class.

In this instance we're adding the method which will reconcile client events to server events.

What this method does is, it looks for a matching event within its current class. If it finds it, we assign it to a global eventTrigger, which will execute the subscribed events for that control.

 
abstract class controls
{
    public $id;
 
    protected function ReconcileEvents()
    {		
        if ($_POST['_sender'])
        {			
            $_sender = explode(',', $_POST['_sender']);
            if ($_sender[0] == $this->id)
            {				
                switch($_sender[1])
                {
                    case 'click': $GLOBALS['eventTrigger'] = &$this->onclick;
                                    $GLOBALS['eventSender'] = &$this;
                                    break;
                }
            }
        }
    }
}

Notice that I placed the ReconcileEvents method within the constructor of my the next class, which is a logical place, considering that we only want to raise the event once all controls are instantiated (unless you need some kind of pre event).

In the rendering method we assign the trigger function, control name etc.

 
class Button extends controls
{	
    public $text;
    public $onclick;
 
    public function Button($id)
    {
        $this->id = $id;
        $this->onclick = new Event();
        $this->ReconcileEvents();
    }
 
    public function Render()
    {
        echo '<input type="button" name="'.$this->id.'" id="'.$this->id.'" value="'.$this->text.'" onclick="trigger(this, event)" />';
    }	
}

Here we go, create a new instance of the button class, assign some properties, attach an onclick event.

 
$btnDemo = new Button("btnDemo");
$btnDemo->text = "Click Here";
$btnDemo->onclick->Subscribe("btnDemo_Click");
 
function btnDemo_Click($sender)
{
    $sender->text = "Thank you for clicking";
}

Once all our classes are instantiated, the following piece of code must be included.

 
if ($GLOBALS['eventTrigger'])
{
    $GLOBALS['eventTrigger']->Raise($GLOBALS['eventSender']);
}

Have a look at the class used for registering events.

Event class >>

Posted by - Christoff Truter
Created - 2008-07-28 12:48:09

No Entries Found