SCZF Tutorial - Hello World!

This tutorial will show how to create a button that shows the message "Hello World!" when clicked. The complete source-code is available at the end of the page.

1) Make sure that you already installed SCZF

If you have not installed SCZF yet, check the Installation page.

2) Create a new action and view

On your controller, create a new action and the respective view for it. We are only going to modify the view, so you can leave the controller's action empty.

3) Include scripts

On your view file, add the following code:

<?php
// Include SmartClient scripts
echo $this->ScGeneral()->includeScripts( 'js/isomorphic/' );

This is a function that automatically include the SmartClient scripts, just make sure to set the correct path.

4) Create button

Add the following code into the script:

// JavaScript function
$action = "function () { isc.warn( 'Hello World!' ); }";

echo $this->ScButtons()->create( 'Click me' , $action );

?>

In this part of the script, we are creating a new button with the following attributes:

Title: Click me
Action: function () { isc.warn( 'Hello World!' ); }

5) Test it

Access your controller's action at your browser and check if everything works as expected.

6) Full source code

Here it is the full source code of the view used on this tutorial:

<?php
// Include SmartClient scripts
echo $this->ScGeneral()->includeScripts();

// JavaScript function
$action = "function () { isc.warn( 'Hello World!' ); }";

echo $this->ScButtons()->create( 'Click me' , $action );

?>