https://github.com/zachalam/formsync
formsync.js is a ultra lightweight jQuery add on that allows a developer to asynchronously submit forms without understanding or writing javascript.
https://github.com/zachalam/formsync
Last synced: about 1 year ago
JSON representation
formsync.js is a ultra lightweight jQuery add on that allows a developer to asynchronously submit forms without understanding or writing javascript.
- Host: GitHub
- URL: https://github.com/zachalam/formsync
- Owner: zachalam
- Created: 2014-06-03T00:25:32.000Z (about 12 years ago)
- Default Branch: master
- Last Pushed: 2014-06-23T20:14:40.000Z (almost 12 years ago)
- Last Synced: 2025-02-05T18:39:19.785Z (over 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 211 KB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
formsync.js 1.0
-----------------------------
formsync.js is a ultra lightweight jQuery add-on that allows developers to asynchronously submit forms without understanding or writing a single line of javascript.
Installation
-----------------------------
Add jQuery then formsync to any HTML document.
```javascript
```
Building the Form: Frontend
-----------------------------
If you've written a HTML form in the past then there isn't anything new. Simply build your form as usual and add the "formsync" class to the **form** tag. For error reporting: add one div layer inside your form with a class of "error". This should be styled by you using an external stylesheet.
```HTML
```
That's all. You're ready to go!
Receiving Data: Backend
-----------------------------
Data from the form is sent to your server normally. No extra work is needed.
Assume we have an input called "first_name" sent using the GET method.
```HTML
```
The data contained in this input can then be accessed using your frameworks GET accessor.
```PHP
```
Sending Response: Backend
-----------------------------
The URL specified in the form action must always send back a JSON response. For simplicity formsync.js expects only one variable called "error" to be returned. In the case of a success "error" should be set to 0, NULL, or false.
Most frameworks have built in support for JSON, here is a sample case for "submit.php".
```php
"Invalid Email Address"));
?>
```
```php
false));
?>
```
formsync.js will automatically inject this error message into your error div. See "Success Actions" to learn how successful events are handled.
Form Attributes
-----------------------------
**formsync_method**:
Overrides the method (if any) specified in the form.
```HTML
```
**formsync_action**:
Overrides the action (if any) specified in the form.
```HTML
```
Success Actions
-----------------------------
**formsync_redirect**:
Redirect user to http://example.com if server returns no error on form submission.
```HTML
```
**formsync_show**:
Shows a specified selector by sliding it down into view.
```HTML
```
**formsync_alert**:
Uses the javascript alert function to display a message
```HTML
```
**formsync_callback**:
The name of a user written function to call after success
```HTML
```
**formsync_clear**:
Clear all input fields of data on success
```HTML
```
**formsync_hide**:
Hides entire form (by sliding up) including everything between "form" tags.
```HTML
```
Notices
----------------------------
"formsync" is a restricted keyword.
Do not use the text "formsync" to define variables or inputs outside the ones listed here.
Doing so may unintentionally cause loss of data.