[js] aggiungere field

[Trinità76]

Salve,
ho trovato questo script dal sito riportato qui sotto, però funziona solo con un field.
A me servirebbe al click di un bottone, duplicare 3 textfield alla volta.
Se provo a farlo con questa funzione, sul contatore dei field esce NaN per cui non funziona.

// Add more fields dynamically.
// http://binnyva.blogspot.com/2006/01/...ration-in.html
// -------------------------------------------------------------------------
function addField(area,field,limit) {
	if(!document.getElementById) return; // Prevent older browsers from getting any further.
	var field_area = document.getElementById(area);
	var all_inputs = field_area.getElementsByTagName("input"); // Get all the input fields in the given area.
	// Find the count of the last element of the list. It will be in the format '<field><number>'. If the 
	// field given in the argument is 'friend_' the last id will be 'friend_4'.
	var last_item = all_inputs.length - 1;
	var last = all_inputs[last_item].id;
	var count = Number(last.split("_")[1]) + 1;
	// If the maximum number of elements have been reached, exit the function.
	// If the given limit is lower than 0, infinite number of fields can be created.
	if(count > limit && limit > 0) return;
	if(document.createElement) { // W3C Dom method.
		var li = document.createElement("li");
		var input = document.createElement("input");
		input.id = field+count;
		input.name = field+count;
		input.type = "text"; // Type of field - can be any valid input type like text,file,checkbox etc.
		li.appendChild(input);
		field_area.appendChild(li);
	} else { // Older Method
		field_area.innerHTML += "[*]<input name='"+(field+count)+"' id='"+(field+count)+"' type='text' />";
	}
}

I field da duplicare ad evento click dovrebbero essere questi

<input name="g_variable_n_0" id="g_variable_n_0" class="inputbox" value="0" type="text" style="width:30px;margin-right:10px;" /> 
nome: <input name="g_variable_var_0" id="g_variable_var_0" class="inputbox" value="" type="text" style="width:300px;margin-right:10px;" /> 
prezzo: <input name="g_variable_price_0" id="g_variable_price_0" class="inputbox" value="" type="text" style="width:60px;margin-right:10px;" /></p>

Come è possibile ovviare?
Scusate ma di Js non sono per niente bravo, ma riesco a malapena a modificare dei parametri perciò non saprei come modificare in maniera sostanziale questa funzione.
Se qualcuno ha qualcos'altro di già pronto posti pure il link.

Grazie in anticipo

ps> anche con questo thread
http://forum.html.it/forum/showthrea...hreadid=848168
ho lo stesso problema: duplicare un field ok, duplicarne 3 non va...

[Trinità76]

up

[cavicchiandrea]

leggi qui

[Trinità76]

Originariamente inviato da cavicchiandrea
leggi qui

Grazie, do un occhiata

[Trinità76]

Ho modificato lo script che mi hai segnalato secondo le mie esigenze e l'ho trasformato in questo:

var numfield=1;
function accoda(){
	if(document.createElement && document.getElementById && document.getElementsByTagName) {
		// crea elementi
		var oTr=document.createElement("TR");
		var oTd1=document.createElement("TD");
		var oTd2=document.createElement("TD");
		var oP=document.createElement("P");
		var oFieldA=document.createElement("INPUT");
		var oFieldB=document.createElement("INPUT");
		var oFieldC=document.createElement("INPUT"); 
		var oButt=document.createElement("INPUT");
		var oText1=document.createTextNode("");
		var oText2=document.createTextNode("nome: ");
		var oText3=document.createTextNode("prezzo: ");

		// setta attributi
  		oFieldA.setAttribute("type","text");
		oFieldA.setAttribute("name","g_variable_n_"+numfield);
		oFieldA.setAttribute("class","inputbox");
		oFieldA.setAttribute("value","0");
		oFieldA.setAttribute("style","width:30px;margin-right:10px;");
		oFieldB.setAttribute("type","text");
		oFieldB.setAttribute("name","g_variable_var_"+numfield);
		oFieldB.setAttribute("class","inputbox");
		oFieldB.setAttribute("style","width:300px;margin-right:10px;");
		oFieldC.setAttribute("type","text");
		oFieldC.setAttribute("name","g_variable_price_"+numfield);
		oFieldC.setAttribute("class","inputbox");
		oFieldC.setAttribute("style","width:60px;margin-right:10px;");
		oButt.setAttribute("type","button");
		oButt.setAttribute("value","rimuovi");

		// setta gestore evento
		if(oButt.attachEvent) oButt.attachEvent('onclick',function(e){rimuovi(e);})
		else if(oButt.addEventListener) oButt.addEventListener('click',function(e){rimuovi(e);},false)

		// appendi al relativo padre
		oTd1.appendChild(oP);
		oP.appendChild(oText1);
		oP.appendChild(oFieldA);
		oP.appendChild(oText2);
		oP.appendChild(oFieldB);
		oP.appendChild(oText3);
		oP.appendChild(oFieldC);
		oP.appendChild(oButt);
		oTr.appendChild(oTd1);
		oTr.appendChild(oTd2);
		document.getElementById('gvariable').getElementsByTagName('TBODY')[0].appendChild(oTr);

		// incrementa variabile globale
		numfield++
	}
}
function rimuovi(e){
	if(document.removeChild && document.getElementById && document.getElementsByTagName) {
		if(!e) e=window.event;
		var srg=(e.target)?e.target:e.srcElement;

		// risali al tr del td che contiene l' elemento che ha scatenato l' evento
		while(srg.tagName!="TR"){srg=(srg.parentNode)?srg.parentNode:srg.parentElement}

		// riferimento al tbody
		var tb=document.getElementById('gvariable').getElementsByTagName('TBODY')[0];
		
		// rimuovi
		tb.removeChild(srg);
	}
}

Funziona bene... l'unica cosa che non ho capito è come scrivere in un hidden field il contatore dei box aggiunti che corrisponde nel mio caso alla variabile numfield

[Trinità76]

up

[Trinità76]

up
com'è possibile aumentare la variabile hidden con quella del contatore?