kaung199 / htmltagcomponent
HTML tag comopnent with validation using bootstrap class for Laravel Application
Installs: 42
Dependents: 0
Suggesters: 0
Security: 0
Stars: 6
Watchers: 1
Forks: 1
Open Issues: 0
Language:Blade
README
HTML Tag Components Package for Laravel
HTML Tag Component Package with validation using bootstrap class for Laravel.
Installation & setup
You can install the package via composer:
composer require kaung199/htmltagcomponent
Usage
Usages Form Components
The form components can be used with the forms
prefix.
Form
<x-forms::form-tag :attrs="[ 'class' => 'example-form', 'id' => 'example-form-id', 'action' => 'example-route', 'method' => 'post', 'formName' => 'example-form', ]"> <!-- The form content here--> </x-forms::form-tag>
These attributes are special:
- method
( Required )
- action
( Required )
- class (nullable)
- id (nullable)
- formName (nullable)
Submit Button
<x-forms::submit-button :attrs="[ 'label' => 'Example Label', 'name' => 'example-name', 'form' => 'example-form', 'class' => 'example-class', 'id' => 'id' ]"/>
These attributes are special:
- label
( Required )
- name (nullable)
- form (nullable)
- class (nullable)
- id (nullable)
Button
<x-forms::button :attrs="[ 'label' => 'Example Lable', 'id' => 'example-id', 'class' => 'example-class', 'name' => 'example-name', 'readOnly' => 'readonly', 'disabled' => 'disabled' ]"/>
These attributes are special:
- label
( Required )
- id (nullable)
- class (nullable)
- name (nullable)
- readOnly (nullable)
- disabled (nullable)
Text Input
<x-forms::text-input :attrs="[ 'name' => 'example-name', 'id' => 'example-id', 'class' => 'example-class', 'value' => 'example-value', 'placeholder' => 'Example Placeholder', 'label' => 'Example Label', 'required' => 'yes' ]" />
These attributes are special:
- name
( Required )
- id (nullable)
- class (nullable)
- value (nullable)
- placeholder (nullable)
- label (nullable)
- required (nullable)
Number Input
<x-forms::number-input :attrs="[ 'name' => 'example-name', 'id' => 'example-id', 'class' => 'example-class', 'value' => 'example-value', 'placeholder' => 'Example Placeholder', 'label' => 'Example Label', 'required' => 'yes' ]" />
These attributes are special:
- name
( Required )
- id (nullable)
- class (nullable)
- value (nullable)
- placeholder (nullable)
- label (nullable)
- required (nullable)
Password Input
<x-forms::password-input :attrs="[ 'name' => 'example-name', 'id' => 'example-id', 'class' => 'example-class', 'value' => 'example-value', 'placeholder' => 'Example Placeholder', 'label' => 'Example Label', 'required' => 'yes' ]" />
These attributes are special:
- name
( Required )
- id (nullable)
- class (nullable)
- value (nullable)
- placeholder (nullable)
- label (nullable)
- required (nullable)
Hidden Input
<x-forms::hidden-input :attrs="[ 'name' => 'example-name', 'id' => 'example-id', 'class' => 'example-class', 'value' => 'example-value', ]" />
These attributes are special:
- name
( Required )
- id (nullable)
- class (nullable)
- value (nullable)
Text Area
<x-forms::textarea :attrs="[ 'name' => 'example-name', 'id' => 'example-id', 'class' => 'example-class', 'value' => 'example-value', 'placeholder' => 'Example Placeholder', 'label' => 'Example Label', 'required' => 'yes' ]" />
These attributes are special:
- name
( Required )
- id (nullable)
- class (nullable)
- value (nullable)
- placeholder (nullable)
- label (nullable)
- required (nullable)
Select Option (Key => Value)
<x-forms::select-with-key-value :attrs="[ 'name' => 'Example Name', 'selected' => 'example-selected-old-value', 'class' => 'example-class', 'placeholder' => 'Example Placeholder', 'label' => 'Example Label', 'required' => 'yes', 'readOnly' => 'readonly', 'disabled' => 'disabled', 'list' => [] ]"/>
These attributes are special:
- name
( Required )
- multiple (nullable)
- selected (nullable)
- class (nullable)
- placeholder (nullable)
- label (nullable)
- required (nullable)
- readOnly (nullable)
- disabled (nullable)
- list
( Required )
Select Option (Value => Value)
<x-forms::select-with-value-value :attrs="[ 'name' => 'Example Name', 'selected' => 'example-selected-old-value', 'class' => 'example-class', 'placeholder' => 'Example Placeholder', 'label' => 'Example Label', 'required' => 'yes', 'readOnly' => 'readonly', 'disabled' => 'disabled', 'list' => [] ]"/>
These attributes are special:
- name
( Required )
- multiple (nullable)
- selected (nullable)
- class (nullable)
- placeholder (nullable)
- label (nullable)
- required (nullable)
- readOnly (nullable)
- disabled (nullable)
- list
( Required )
File
<x-forms::file-input :attrs="[ 'name' => 'ExampleFileName[]', 'id' => 'example_file_id', 'label' => 'Example Label', 'fileType' => 'image or pdf or docx', 'class' => 'example-class', 'uploadableFileCount' => 1, 'required' => 'yes', 'placeholder' => '' ]" />
These attributes are special:
- JQuery Required
- name
( Required )
- id
( Required )
- label (nullable)
- fileType (nullable)
- class (nullable)
- uploadableFileCount
( Required )
- required (nullable)
- placeholder (nullable)