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