HTML FORMS

The HTML <form> tag represents a document section that contains interactive controls to submit information to a web server.

All built-in HTML form objects implement atleast HtmlForm interface. This interface defines the basic form implementation. Whereas Form is also container for HTML components like Input.

Building HTML forms using FormController and Input components

FormController is the base interface for all functional form content and Input inherits it. Functional form content

All of the following components declare an Input input control for a HtmlForm form.

Basic input components

Framework has many build-in form components that implement basic HTML form elements.

• The Input interface and implementing classes for spesific input types like:
  • HiddenInput implements a <input type="hidden"> element
  • NumberInput implements a <input type="number"> element
  • SliderInput implements a <input type="range"> element
  • TimeInput implements a <input type="time"> element
  • DateTimeInput implements a <input type="datetime-local"> element
  • ColorInput implements a <input type="color"> element
  • TextualInput and subtypes like:
    • TextInput implements a <input type="text"> element
    • EmailInput implements a <input type="email"> element
    • SearchInput implements a <input type="search"> element
    • PasswordInput implements a <input type="password"> element
  • The abstract Choicebox input has two implementations
    • The Checkbox implements a <input type="checkbox"> element
    • The Radiobox implements a <input type="radio"> element
• The Textarea implements a <textarea> element
• The Select implements a <select> element
  • This component consists of the Option components. Option components can be grouped using Optgroup components,

Button components

The Button interface defines buttons for HTML forms.

Note: A <button> can contain text (and other tags. That is not possible with buttons created with the <input> tag.

• Clickable buttons:
  • PushButton is is a clickable button
  • InputButton implements a <input type="button"> element
• Submit buttons; Submitter interface defines a submit button for HTML forms and it has two implementations
  • SubmitButton is a submit button (submits form-data) <button type=submit>
  • SubmitInput is a submit button (submits form-data)
• Reset buttons: Resetter interface defines a button that resets the form-data to its initial values
  Note: Reset buttons are rarely useful, and are instead more likely to frustrate users.
  • ResetButton is based on <button> tag
  • ResetInput implements a <input type="reset"> element

Output components

The Progress Indicator element

The Progress component implements the <progress> HTML element.

The Progress component displays an indicator showing the completion progress of a task as a progress bar. This component is often used in conjunction with JavaScript to display the progress of a task, but it is not suitable for representing a gauge (e.g. disk space usage or relevance of a query result).

The Meter element (a gauge)

The Meter component implements the <meter> HTML element.

The Meter component represents either a scalar value within a known range or a fractional value. This component should not be used to indicate progress (as in a progress bar).

Sliders and range sliders

All sliders in this namespace implement Sphp\Html\Forms\Inputs\RangeInputInterface interface. These components specify numeric values which must be no less than a given value, and no more than another given value.

A Slider object implements single sliders, whereas RangeSlider component implements double (range) sliders.

These components implement Ion.RangeSlider client side slider element for object oriented PHP. The original Ion.RangeSlider is a jQuery range slider with CSS3 skin support.