Not to tote my own horn to much, but I have something very simmilar
working in prototype, and I'll refactor it into jQuery sometime soon
after new year. The difference being that each cloned line will get a
remove button as well.
Here's the current code, if you speak prototype
Andreas
var AddRemove = new Class.create();
AddRemove.prototype = {
initialize: function(element) {
this.formArray = [];
this.pristine = element.cloneNode(true);
var name = this.pristine.down('input').name;
this.firstName = name.substr(0, name.indexOf('(')+1);
this.lastName = name.substr(name.indexOf(')'), name.length);
this.initBehaviour(element);
},
initBehaviour: function(start) {
var trigger = Builder.node('img', {src: '../images/icons/
add.png', className: 'icon', style: 'cursor: pointer;', title: 'Lägg
till ny rad'});
this.formArray.push(start);
this.reindex();
start.appendChild(trigger);
trigger.onclick = function() {
var copy = this.pristine.cloneNode(true);
if (start.nextSibling) {
start.parentNode.insertBefore(copy, start.nextSibling);
} else {
start.parentNode.appendChild(copy);
}
new Effect.Highlight(copy, {duration: 0.5});
trigger.src = '../images/icons/forbidden.png';
trigger.title = 'Ta bort rad';
trigger.onclick = function() {
this.formArray = this.formArray.without(start);
new Effect.Fade(start, {duration: 0.5});
this.reindex();
}.bind(this);
this.initBehaviour(copy);
}.bind(this);
},
reindex: function() {
this.formArray.each(function(el, index) {
el.down('input').name = this.firstName+parseInt(index+1)
+this.lastName;
}.bind(this));
}
};
> The goal is that the user would fill the first field then click the
> "+"
> button. Then the following would occur:
>
> 1) Clone current LI tag
> 2) Append it to itself.
> 3) Clear the value from the form field
> 4) Increment the name value of the form element, ing_01, ing_02, etc.
> 5) Lastly, remove the plus button from the elemet just previous to
> the new
> one.
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
