Requirements

• jQuery >= 1.10

Plugins

.populateForm(values)

Populate a form from a object. Each key for each input. The key name for the field name.

var frmValues = {"var1": "value1", "var2": "value2"}; $("#myForm").populateForm(frmValues);

.checkInput(nameCheckbox, values)

We have a checkbox array:

<label><input type="checkbox" name="myCheckbox[]" value="1"> Option 1</label> <label><input type="checkbox" name="myCheckbox[]" value="2"> Option 2</label> <label><input type="checkbox" name="myCheckbox[]" value="3"> Option 3</label>

Check input checkbox with name "myCheckbox" and values "1", "3" (Option 1 and Option 3)

$('#myForm').checkInput('myCheckbox', ["1", "3"]);

.checkAll(nameCheckbox, value)

We have a checkbox array:

<label><input type="checkbox" name="myCheckbox[]" value="1"> Option 1</label> <label><input type="checkbox" name="myCheckbox[]" value="2"> Option 2</label> <label><input type="checkbox" name="myCheckbox[]" value="3"> Option 3</label>

Check all input checkbox with name "myCheckbox"

$('#myForm').checkAll('myCheckbox', true); // for unchecked: Set false the last parameter

Check/Uncheck using another input checkbox

<!-- We need a master checkbox --> <label><input type="checkbox" id="masterCheckbox"> Check All</label>

$('#myForm').checkAll('myCheckbox', $("#masterCheckbox")); // And here connect the master checkbox

.chainedSelect(action, jqSelect2, options)

Chain input select and populate select with result ajax.

$('#select1').chainedSelect('http://yourdomain.com/app/post.php', $('#select2'));

The $('#select2') will be populate with the response.

The response must be an array json like this:

["Option 1", "Option 2", "Option 3", ...] 

or like this:

[{"value": "1", "text": "Option 1"}, {"value": "2", "text": "Option 2"}, ...] 

or like this:

[{"1": "Option 2"}, {"2": "Option 2"}, {"3": "Option 3"}, ...] 

In the last case use the option parameter 'keyAsValue'

$('#select1').chainedSelect('http://yourdomain.com/app/post.php', $('#select2'), {keyAsValue: true});

Options

Return

• jQuery Return the second select, then we can use the return with a third select.

.submitAjax(options)

Perform an asynchronous HTTP (Ajax) request from a form.

<form action="user/save" method="post" id="myForm"> <input type="text" name="username" value=""> <input type="text" name="email" value="456"> <button type="submit" class="btn btn-primary">Submit</button> </form>

$('#myForm').submit(function(e){     e.preventDefault();     $(this).submitAjax(); });

.clickSubmit(options)

Submit all data attributes from a clickable element (anchor, button, etc.)

<a href="#" data-id="1121" class="send" data-action="http://localhost/another_app/save">Send</a> <a href="#" data-id="1122" class="send">Send</a> <a href="#" data-id="1123" class="send">Send</a>

$('.send').clickSubmit({action: 'http://localhost/app/save'});

.clickAjax(options)

Send an Ajax Post Request with all data attributes from a clickable element.

<a href="#" data-id="1121" class="send" data-action="http://localhost/another_app/save">Send</a> <a href="#" data-id="1122" class="send">Send</a> <a href="#" data-id="1123" class="send">Send</a>

var sendAjax = $('.send').clickAjax({action: 'http://localhost/app/save'}); sendAjax.done(function(r){     console.log('Response: '+r); });