Build Your Form Here

<?php

    Class Category_Field extends Crystal {

        public function field($values = null) {

            $fields = [						// Start Form
                        [
                          'label' => 'Row 1',
                          'cols' =>	[		// Start Column
                            [	// Attribute Column
                              'class' => 'col-md-12',
                              'label' => 'Row Title',
                              'fields' => [		

                                // Start to insert FIELDS here 
                                        
                              ]			// End Field
                            ],			// End Attribute Column

                                // Add a new COL here
                            
                          ]				// End Column
                        ],				// End Row

                              // Add a new ROW here
                        
                      ];				// End Form

            return $fields;
        }
    }

Rows Array

[
  'label' => 'Riga 1',
  'cols' =>
  	[
      [
        'class' => 'col-md-4',
        'label' => 'Cliente',
        'fields' => [
				
          			// Start to insert FIELDS here
        ]
      ],
      				// Add a new COL here
    ]
],

Columns Array

[
  'class' => 'col-md-2',
  'label' => 'Column Title',
  'fields' => [
      // Start to insert FIELDS here 
  ]
], 

‘class’ -> Customize class value using bootstrap references
‘label’ -> Add a Column’s title or leave blank

Fields Array Example

'input_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'text',
  'validate' => [		// Validation
    'type'     => 'text',
    'required' => true,
    'min'      => 3,
    'max'      => 10
  ],
  'style'	=>	[		// css References
    'margin-top'	=>	'10px',
    'font-size'		=>	'30px',
    'text-transform'=>	'uppercase'
  ],
],

Fields Validation

'validate' => [		// Validation
  'type'     => 'text',
  'required' => true,
  'min'      => 3,
  'max'      => 10
],

CSS Reference

'style'    => [
  'margin-top'	=>	'10px',
  'font-size'	=>	'30px',
  'text-transform'	=>	'uppercase'
],

Input Text

'text_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'text',
  'validate' => [		
    'type'     => 'text',
    'required' => true,
    'min'      => 3,
    'max'      => 10
  ],
],

Text Area

'textarea_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'textarea',
  'class'    => '',
  'value'    => 'textarea',
  'attrs'    => [],
  'validate' => [
    'type'     => 'text',
    'required' => true,
    'min'      => 3,
    'max'      => 1000
  ],
],

Text Editor

'texteditor_name' => [   //   INSERITA
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'editor',
  'class'    => '',
  'value'    => 'editor',
  'attrs'    => [],
  'validate' => [
    'type'     => 'text',
    'required' => true,
    'min'      => 3,
    'max'      => 1000
  ],
],

Select

'select_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'select',
  'class'    => '',
  'value'    => '',
  'elems'    => [
    'key-1-1' => 'value 1.1',
    'key-1-2' => 'value 1.2',
    'key-1-3' => 'value 1.3',
    'key-2-1' => 'value 2.1',
    'key-2-2' => 'value 2.2',
    'key-2-3' => 'value 2.3',
    'key-3-1' => 'value 3.1',
    'key-3-2' => 'value 3.2',
    'key-3-3' => 'value 3.3',
  ],
],

Multi Select

'multiselect_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'multi-select',
  'placeholder' => 'placeholder_value',
  'required' => true,
  'class'    => '',
  'value'    => '',
  'elems'    => [
    'group_1'  => [
      'key-1-1' => 'value 1.1',
      'key-1-2' => 'value 1.2',
      'key-1-3' => 'value 1.3',
    ],
    'group_2'  => [
      'key-2-1' => 'value 2.1',
      'key-2-2' => 'value 2.2',
      'key-2-3' => 'value 2.3',
    ],
    'gruppo 3'  => [
      'key-3-1' => 'value 3.1',
      'key-3-2' => 'value 3.2',
      'key-3-3' => 'value 3.3',
    ],
  ],
],

Checkbox

'checkbox_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'checkbox',
  'class'    => '',
  'value'    => 0,
  'attrs'    => [],
  'style'    => '',
  'validate' => [
    'type'     => 'bool',
    'required' => true
  ],
],

Autocomplete Input

'autocomplete_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'autocomplete',
  'value'    => 'milano',
  'lists'    => ['torino', 'genova', 'milano', 'venezia', 'pomezia', 'firenze', 'roma'],
  'validate' => [
    'type'     => 'text',
    'required' => true,
    'min'      => 3,
    'max'      => 20
  ],
],

Url

'url_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'text',
  'validate' => [
    'type'     => 'url',
    'required' => true,
    'min'      => 3,
    'max'      => 20
  ],
],

Password

'password_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'password',
  'class'    => '',
  'value'    => '',
  'attrs'    => [
    'data-length'  => 8,
    'data-charset' =>	'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890',
  ],
  'validate' => [
    'type'     => 'text',
    'required' => true,
    'min'      => 8,
    'max'      => 8
  ],
],

Random Code

'random_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'random',
  'value'    => 'random value',
  'attrs'    => [
    'data-length' => 5,
    'data-charset' => '01',
  ],
  'validate' => [
    'type'     => 'text',
    'required' => true,
    'min'      => 5,
    'max'      => 5
  ],
],

Numeric Int

'int_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'numeric',
  'class'    => 'integer positive',
  'attrs'    => [
    'data-decimal' => 2
  ],
  'validate' => [
    'type'     => 'int',
    'required' => true,
    'min'      => 3,
    'max'      => 1000
  ],
],

Numeric Float

'float_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'numeric',
  'class'    => 'decimal positive',
  'attrs'    => [
    'data-decimal' => 2
  ],
  'validate' => [
    'type'     => 'float',
    'required' => true,
    'min'      => 0.99,
    'max'      => 999.99,
    'decimal'  => 2,
  ],
],

Date Picker

'date_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'date',
  'value'    => '10-11-2012',
  'validate' => [
    'type'     => 'date',
    'required' => true,
    'format'   => 'Y-m-d'
  ],
],

Color Picker

'color_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'type'     => 'color',
  'value'    => '#F00',
  'validate' => [
    'type'     => 'color',
    'required' => true
  ],
],

Files Upload

'filesupload_name' => [
  'label'    => 'label_value',
  'suggest'  => 'suggest_value',
  'required' => true,
  'type'     => 'files',
  'class'    => '',
  'attrs'    => [
    'data-fileuploader-limit'      => 5,
    'data-fileuploader-maxSize'    => 5,
    'data-fileuploader-extensions' => 'png, jpg',
    'data-delete-url'              => $this->config->get('base_url') . 'sponsor/delete_file'
  ],
],

Button

'button_name' => [
  [
    'label'  => 'label_value',
    'action' => 'action_value'
  ],
],
To Top