https://github.com/thomasdev-de/jquery-form
A jQuery plugin for forms
https://github.com/thomasdev-de/jquery-form
ajax bootstrap form form-validation javascript jquery jquery-plugin
Last synced: 10 months ago
JSON representation
A jQuery plugin for forms
- Host: GitHub
- URL: https://github.com/thomasdev-de/jquery-form
- Owner: ThomasDev-de
- Created: 2022-04-28T21:22:26.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-06-23T16:07:52.000Z (over 1 year ago)
- Last Synced: 2024-12-18T01:06:45.879Z (about 1 year ago)
- Topics: ajax, bootstrap, form, form-validation, javascript, jquery, jquery-plugin
- Homepage:
- Size: 34.2 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# jquery-form
A jQuery plugin for forms
## REQUIREMENTS
- bootstrap >= 5.0
- jQuery >= 3.6
## USAGE
```html
$('#form_example').form(options);
```
## OPTIONS
```js
const DEFAULTS = {
autocomplete: false, // Sets all input fields to autocomplete off
resetOnModalHidden: true, // If the form element is in a modal, it will be reset after the modal is hidden
onBeforeSend: function(form, xhr){},
onSuccess: function(form, response){},
onError: function(form, errors){},
onComplete: function(form, response){},
onCleared: function(form){},
onReset: function(event, form){},
onInit: function(form){},
}
```
## EVENTS
```javascript
$(document)
.on('success', '#form_example', function (event, $form, responseJSON) {
// do something
})
.on('error', '#form_example', function (event, $form, responseJSON, xhr) {
// do something
})
.on('beforeSend', '#form_example', function (event, xhr, $form, aborted) {
// do something
})
.on('complete', '#form_example', function (event, $form, responseJSON) {
// do something
})
.on('cleared', '#form_example', function (event, $form) {
// do something
})
.on('resetting', '#form_example', function (event, $form) {
// do something
})
.on('init', '#form_example', function (event, $form) {
// do something
})
.on('error', '#form_example [name="name"]', function (e, $inputElement, message) {
// do something
})
.on('any', '#form_example', function (e, eventName) {
// do something
});
```
## Methods
```javascript
const form = $('form').form('setErrors', {email: 'not valid', password: 'is required'});
```
## ERROR HANDLING
The plugin expects error messages as JSON object.
The key must match the input name field, and the value should contain the error message.
Example:
```json
{
"first_name": "This field must not be empty",
"email": "This is not a valid email address",
"password_repeat": "The password repetition does not match"
}
```
If the errors are returned properly, the plugin will bring up the error messages in the correct place
and the input fields will be marked as invalid.