Skip to content

a jQuery plugin for handling form field dependencies

Notifications You must be signed in to change notification settings

plastbox/dependsOn

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 
 
 

Repository files navigation

dependsOn

A jQuery plugin to facilitate the handling of form field dependencies.

$( subject ).dependsOn( dependencySet, [options] );

Examples

Demo

Usage

Include jQuery (requires v1.7 or higher)

<script type="text/javascript" src="jquery/jquery-1.7.2.min.js"></script>

Include dependsOn

<script type="text/javascript" src="dependsOn-1.0.0.min.js"></script>

Add form components

<form id="myForm">
	<label for="myCheck">Check Me</label>
	<input type="checkbox" id="myCheck">
 
	<label for="myText">Input</label>
	<input type="text" id="myText" value="">
</form>

Activate plugin

$('#myText').dependsOn({
	// The selector for the depenency
	'#myCheck': {
		// The dependency qualifiers
		enabled: true,
		checked: true
	}
});

Qualifiers

  • enabled: (Boolean) If true, then dependency must not have the "disabled" attribute.
  • checked: (Boolean) If true, then dependency must not have the "checked" attribute. Used for checkboxes only.
  • values: (Array) Dependency value must equal one of the provided values.
  • not: (Array) Dependency value must not equal any of the provided values.
  • match: (RegEx) Dependency value must match the regular expression.
  • contains: (Array) One of the provided values must be contained in an array of dependency values. Used for select fields with the "multiple" attribute.
  • email: (Boolean) If true, dependency value must match an email address.
  • url: (Boolean) If true, Dependency value must match an URL.
  • Custom: (Function) Custom function which return true or false.

Options

  • disable: (Boolean) Add "disabled" attribute to the subject's form field. Default: true
  • hide: (Boolean) Hide the subject on disable and reveal the subject on enable. Default: true
  • duration: (Number) The time in milliseconds for the fade transition. Used only if hide is set to true. Default: 200
  • onEnable: (Function) The callback function to execute when the subject has been enabled. Default: Empty Function
  • onDisable: (Function) The callback function to execute when the subject has been disabled. Default: Empty Function
  • valueOnEnable: (String) The value to set the subject to when enabled.
  • valueOnDisable: (String) The value to set the subject to when disabled.
  • checkOnEnable: (Boolean) If true, "checked" attribute will be added to subject when enabled. If false, "checked" attribute will be removed from subject when enabled. For checkboxes and radio buttons.
  • checkOnDisable: (Boolean) If true, "checked" attribute will be added to subject when disabled. If false, "checked" attribute will be removed from subject when disabled. For checkboxes and radio buttons.
  • valueTarget: (String) jQuery selector for the object to you want to target for editing the value. Use if you want to alter the value of something other than the subject.
  • toggleClass: (String) The class you wish to be appended to the subject when enabled. The class will be removed when the subject is disabled.

TODO

  • Add a range qualifier that will check if the input value is within a numerical range. Might accept an array with three values similar to the arguments for the Python range function.
  • Trigger the "change" event when the subject values are altered.

About

a jQuery plugin for handling form field dependencies

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%