xlab-6 experiments

An AJAX calculator example for Prado v2.1x was done a few months ago. The same can now be done in Prado v3 using the latests code from the SVN trunk.

To begin, we create the template with 3 textboxes and a button. Save the template file as, say, Calculator.page

<com:TForm>
<com:TActiveTextBox ID="a" />
+
<com:TActiveTextBox ID="b" />
=
<com:TActiveTextBox ID="c" />
 
<com:TActiveButton ID="sum"
                OnClick="calculate_sum" Text="Calculate!" />
</com:TForm>

The corresponding Calculator.php file is very simple.

<?php
//include the active controls namespace
Prado::using('System.Web.UI.ActiveControls.*');
class Calculator extends TPage
{
    public function calculate_sum($sender, $param)
    {
         $a = floatval($this->a->Text);
         $b = floatval($this->b->Text);
         $this->c->Text = $a + $b;
    }
}
?>

That’s all there is to it, run the application from your browser. The calculator will function normally if javascript is disabled. We can also add some validators to ensure that both summand are entered before calcuating the sum. To do this, we simply add two validators and a summary to Calculator.page.

<com:TForm>
<com:TActiveTextBox ID="a" />
+
<com:TActiveTextBox ID="b" />
=
<com:TActiveTextBox ID="c" />
 
<com:TActiveButton ID="sum"
                OnClick="calculate_sum" Text="Calculate!" />
 
<com:TRequiredFieldValidator
                ControlToValidate="a"
                ErrorMessage="left summand is required."
                Display="None" />
<com:TRequiredFieldValidator
                ControlToValidate="b"
                ErrorMessage="right summand is requied."
                Display="None" />
 
<com:TValidationSummary
                ID="summary"
                HeaderText="Unable to calculate because" />
</com:TForm>

The resulting calculator example will utilize javascript if available and remain functional if javascript is unavailable.