axllent / silverstripe-bootstrap-forms
An extension to add CSS classes to Silverstripe forms to play nicer with Twitter Bootstrap
Installs: 42 242
Dependents: 4
Suggesters: 1
Security: 0
Stars: 4
Watchers: 4
Forks: 5
Open Issues: 0
Type:silverstripe-vendormodule
Requires
- silverstripe/framework: ^4.0 || ^5.0
This package is auto-updated.
Last update: 2024-10-29 03:12:54 UTC
README
An extension to add CSS classes to Silverstripe forms to "play nicer" with Twitter Bootstrap, mostly by adding the
form-control
bootstrap CSS classes to form elements (input, dropdown, submit etc).
This is designed to be a plug-and-play extension, without requiring you to change your existing forms on your website. This includes all forms such as login forms, password reset forms, as well as any other form you have created.
It extends FormField
to try provide a transparent "manipulation" of the rendered form fields, adding some bootstrap CSS
to the rendered fields. It does not produce bootstrap-specific html for your forms.
FormField
unfortunately only has a $this->extend('onBeforeRender', $this);
in Field
that allows manipulation of the
field itself, and not the parent field_holder. This allows only a very limited amount of flexibility, and prevents an
extension from changing the field_holder.
Form submit buttons get a btn btn-primary
class added, and any other buttons get a btn btn-default
class added.
Forms will still need some additional CSS styling (to set spacing) as the form's field_holders cannot be modified to the limitations mentioned above.
Features
It adds the form-control
CSS class to all front-end:
- TextField (and extended classes)
- TextAreaField
- DropdownField
It renders CheckboxSetField & OptionsetField with different field templates (see templates/Forms).
It does not:
- Modify field holders (
onBeforeRender()
does not allow that) - Support FieldGroup (you'll need to use CSS to do that)
- Apply bootstrap-specific CSS classes to form messages
Requirements
- Silverstripe ^4 || ^5
Installation
Install via Composer
You can install it via composer with composer require axllent/silverstripe-bootstrap-forms
Basic usage
Simply install (and flush), add the checkbox CSS to your styles and you're good to go.