SartajPHP ( PHP Framework )


Design User Interface

Design User Interface

Create Component Object with Runat:-

Controls are used to create user interface. SartajPHP use Control class to create Controls. You can simple HTML text component or convert that component into SartajPHP control with just add runat="server" attribute in this. Components give the power of reusability, clean code and powerfull User Interface without writing any code. So it is also increase your productivity.

<input id="txtname" runat="server" type="text"  funsetStyler="1" funsetMsgName="Name" funsetRequired="" />

Copy paste any HTML code into front file or temp file and use runat attribute. So now you have SartajPHP Control and it is also provide more attribute to controls output of control. You can also access this control from your PHP application and control its output. For Example:-

<?php

class index extends /Sphp/tools/BasicApp{
       private $temp1 = null;
        public function onstart(){
             $this->temp1 = new TempFile($this->mypath . '/forms/form1.front');
            $txtname = $this->temp1->getComponent('txtname');
           // or direct call
           $this->temp1->getComponent('txtname')->element->appendAttribute('class',' fixed');
          // or shortcut way
         $this->temp1->txtname->style = 'color: white');
        }
}

 

Way of Call Control Class Method From Temp File:-

This is way of communication from temp file to component object. Use Fun or Fur or Fui prefix after prefix write name of method like:- funsetStyler='1'. It will call setStyler method of TextBox class and pass 1 as argumet. For Multi arguments use ,| as separater. 

Fun Prefix:- Call method on init event of control but if arguments is php expression then it will call method on render event.

Fui Prefix:- Call method on init event of control.

Fur Prefix:- Call method on render event of control.

So you can manage behaviour of control with these prefix. Golden rule is, call The method on render event which generate any HTML,js,css output or add any js,css file links.  Call the method at init event which is required to setting up Control. fun work fine in most cases.

call at init funSetStyler='1' and call at render funsetStyler="##{1}#"

<input id="flea1" type="file" fuisetFileTypesAllowed="image/pjpeg,image/jpeg,image/gif,image/png" 
fuisetFileSavePath="a.png"  
placeholder="Image" fuisetForm="form2" runat="server" 
fuisetFileMaxLen="2000000" fuisetFileMinLen="10000" />

In above example file component use fui prefix to settings up required values to evaluates validations on submit. setFileTypesAllowed check uploaded file and also with javascript in browser before upload. So validation work on both side, server and client side.

Use Custom Tags with Runas Attribute on HTML Tag:- 

You can use custom tag in Temp File but when it sends to browser it converts to HTML standard tag. You can sepecify standard HTML tag name in runas attribute.  If tag is control then HTML tag name may be over write by  control object.

<detail runas="p" class="text-center">We are team of talented designers making websites with Bootstrap</detail>

 

Add Beutiful Design Theme with Runcb Attribute on Any Tag:-

This will call Tag library on tag and helps to make design easy without remember complex html css layout. Following example create border on h2 tag

<h2 runcb="true" sphp-cb-border="4,|white">Welcome to Our Website</h2>

sphp-cb-***  code block name to call. The code blocks help to reduce the html codes in template and create a nice design of website. You can check file res/Slib/comp/sphpcodeblock.php to see available basic code blocks and then extend this file withing your project with create new file under temp/sphpcodeblock.php You need to create this file to use runcb attribute. This feature is usefull to create and update design of website without changing any code of website.

For more example Read Code Blocks Page:- https://www.sartajphp.com/pages-use_of_code_blocks.html