View Source TailwindLiveComponents.TextInput (tailwind_live_components v0.6.2)
Link to this section Summary
Functions
Renders the date input with masking
Renders the address input with Google Places API autocomplete
Renders the tel input with masking
Renders the text input
Renders the textarea
Renders the zip input with masking
Link to this section Functions
Renders the date input with masking
options
Options
form
- The form identifierfield
- The field namelabel
- The text for the generated<label>
elementrequired
- Optional flag idicating field is requiredvalue
- The current value for the inputautocomplete
- Optional autocomplete attributedetail
- Optional detail shown below the inputplaceholder
- Optional placeholdererror
- Option error messagetheme
- Optional theme to use for Tailwind classes
Renders the address input with Google Places API autocomplete
Requires setup of Google Places API: https://developers.google.com/maps/documentation/javascript/places-autocomplete
options
Options
form
- The form identifierfield
- The field namevalue
- The current value for the inputapi_key
- Google Places API Keylatitude
- The latitude for the center point of the Places searchlongitude
- The longitude for the center point of the Places searchcountry_code
- The country code to restrict Google Place search to (default is 'us')label
- The text for the generated<label>
elementrequired
- Optional flag idicating field is requireddetail
- Optional detail shown below the inputplaceholder
- Optional placeholderaddress_field_id
- Optional input id of the address fieldcity_field_id
- Optional input id of the city fieldstate_field_id
- Optional input id of the state fielderror
- Option error messagetheme
- Optional theme to use for Tailwind classes
Renders the tel input with masking
<.tel_input form={f} field={:phone} label="Tel Input" value="555234" />
options
Options
form
- The form identifierfield
- The field namelabel
- The text for the generated<label>
elementrequired
- Optional flag idicating field is requiredvalue
- The current value for the inputautocomplete
- Optional autocomplete attributedetail
- Optional detail shown below the inputplaceholder
- Optional placeholdererror
- Option error messagetheme
- Optional theme to use for Tailwind classes
Renders the text input
<.text_input form={f} field={:fruit} placeholder="Fruit" label="Fruit" error="test error message" />
options
Options
form
- The form identifierfield
- The field namelabel
- The text for the generated<label>
elementrequired
- Optional flag idicating field is requiredvalue
- The current value for the inputautocomplete
- Optional autocomplete attributedetail
- Optional detail shown below the inputplaceholder
- Optional placeholdererror
- Optional error messagetheme
- Optional theme to use for Tailwind classes
Renders the textarea
<.textarea form={f} field={:fruit} placeholder="Select Fruit" label="Textarea" value="This is a test text area" />
options
Options
form
- The form identifierfield
- The field namelabel
- The text for the generated<label>
elementrequired
- Optional flag idicating field is requiredvalue
- The current value for the inputautocomplete
- Optional autocomplete attributedetail
- Optional detail shown below the inputplaceholder
- Optional placeholdererror
- Optional error messagetheme
- Optional theme to use for Tailwind classes
Renders the zip input with masking
options
Options
form
- The form identifierfield
- The field namevalue
- The current value for the inputautocomplete
- Optional autocomplete attributelabel
- The text for the generated<label>
elementrequired
- Optional flag idicating field is requireddetail
- Optional detail shown below the inputplaceholder
- Optional placeholdererror
- Option error messagetheme
- Optional theme to use for Tailwind classes