Revision 079a1480

/dev/null
1
/*
2
*	jQuery dynamicField plugin
3
*	Copyright 2009, Matt Quackenbush (http://www.quackfuzed.com/)
4
*
5
*	Find usage demos at http://www.quackfuzed.com/demos/jQuery/dynamicField/index.cfm)
6
*
7
*	Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
8
*	and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
9
*
10
*	Version: 1.0
11
*	Date:	 8/13/2009
12
*/
13
;(function($) {
14
	$.fn.dynamicField = function(options) {
15
		if ( $(this).attr("id") == undefined ) {
16
			alert("The dynamicField plugin could not be initialized.\n\nPlease check the selector.");
17
			return $;
18
		}
19

  
20
		var f = $(this);
21

  
22
		var settings = $.extend({
23
			maxFields: 5,
24
			removeImgSrc: "/static/cross.png",
25
			spacerImgSrc: "/static/spacer.gif",
26
			addTriggerClass: "add-field-trigger",
27
			removeImgClass: "remove-field-trigger",
28
			hideClass: "hide",
29
			cloneContainerId: f.attr("id").replace(/^(.+)([_-][0-9]+)$/,"$1"),
30
			rowContainerClass: f.attr("class"),
31
			labelText: f.children("label")
32
							.html(),
33
			baseName: f.children("input")
34
								.attr("name")
35
								.replace(/^(.+[_-])([0-9]+)$/,"$1"),
36
            baseNames: baseNames(),
37
			addContainerId: "add-" + f.children("input")
38
								.attr("name")
39
								.replace(/^(.+)([_-][0-9]+)$/,"$1")
40
								.replace(/_/g,"-") + "-container"
41
		},options);
42
		
43
		var getFields = function() {
44
			return $("div." + settings.rowContainerClass);
45
		};
46

  
47
        function baseNames() {
48
            var names = new Array();
49
            $.each(f.children("input"), function(index, child){
50
                var name = child.name.replace(/^(.+[_-])([0-9]+)$/,"$1")
51
                names.push(name);
52
            });
53
            return names;
54
        }
55
		
56
		// handle hide/show, etc
57
		var addRemoveBtnCk = function() {
58
			var fields = getFields();
59
			var len = fields.length;
60
			
61
			fields.each(function(i,elem) {
62
				$(elem)
63
					.children("img")
64
					.attr({
65
						"src":(len == 1) ? settings.spacerImgSrc : settings.removeImgSrc,
66
						"class":(len == 1) ? "" : settings.removeImgClass
67
					});
68
			});
69
			
70
			if ( len > (settings.maxFields-1) ) {
71
				$("div#" + settings.addContainerId).addClass(settings.hideClass);
72
			} else {
73
				$("div#" + settings.addContainerId).removeClass(settings.hideClass);
74
			}
75
		};
76
		
77
		// handle field removal
78
		$("img." + settings.removeImgClass).live("click",function() {
79
			// remove the selected row
80
			$(this).parent("div." + settings.rowContainerClass).remove();
81
			
82
			// rebrand the remaining fields sequentially
83
			getFields().each(function(i,elem) {
84
				var pos = new Number(i+1);
85
				var d = $(elem)
86
							.attr("id",settings.cloneContainerId + "-" + pos);
87
				
88
				d.children("label")
89
							.attr("for",settings.baseName + pos)
90
							.html((pos > 1) ? "" : settings.labelText);
91
				
92
				d.children("input")
93
							.attr({
94
								"id":settings.baseName + pos,
95
								"name":settings.baseName + pos
96
							});
97
			});
98
			
99
			addRemoveBtnCk();
100
		});
101

  
102
		// handle field add
103
		$("div#" + settings.addContainerId + " span." + settings.addTriggerClass).click(function() {
104
			var len = getFields().length;
105
			var pos = new Number(len+1);
106
			var newDiv = $("<div/>")
107
							.attr("id",settings.cloneContainerId + "-" + pos)
108
							.addClass(settings.rowContainerClass);
109
            
110
            $.each(settings.baseNames, function(index, name) {
111

  
112
                var input = $("<input/>").attr({
113
								"id":name + pos,
114
								"name":name + pos,
115
								"value":""
116
							});
117
                newDiv.append(input);
118
            });
119
            newDiv.append($("<img>").attr("src",settings.removeImgSrc));
120
            
121
			if ( len > 0 ) {
122
				$("div#" + settings.cloneContainerId + "-" + len).after(newDiv);
123
			} else {
124
				$("div#" + settings.addContainerId).before(newDiv);
125
			}
126
			
127
			addRemoveBtnCk();
128
		});
129
	};
130
})(jQuery);

Also available in: Unified diff