aggiunta dinamicamente di una riga con combobox

**Cypher86** · 10-01-2009, 10:29

ok funziona

function addLotto(id){
var tbody = document.getElementById
(id).getElementsByTagName("TBODY")[0];
var lotto=document.getElementById("lotto1");
var newRiga=lotto.cloneNode(true);

tbody.appendChild(newRiga);

numLotti=numLotti+1;

}

dove numLotti è una variabile globale che si incrementa ad ogni click

solo che adesso ad ogni click dovrei campiare il nome degli attributi.
ho provato con replacechild ma con scarsi risultati

potete aiutarmi?

**Xinod** · 10-01-2009, 14:17

farei una cosa del genere

...
var newRiga=lotto.cloneNode(true);
numLotti=numLotti+1;
updateAttributes(newRiga,'name',numLotti);
tbody.appendChild(newRiga);
...

dove

codice:

function updateAttributes(node,attr,newNum){
	if(node.hasChildNodes){
		for(var k=0;k<node.childNodes.length;k++){
			updateAttributes(node.childNodes[k],attr,newNum);
		}
	}
	if(node[attr]){
		node.setAttribute(attr,node[attr].replace(/[0-9]+/,newNum));
	}
}

occhio che anche se "lotto1" fosse l' unico id presente nella riga clonata si ritroverebbe duplicato e questo non e' corretto, quindi dovresti, prima di appendere, richiamare anche un
updateAttributes(newRiga,'id',numLotti);

ciao

**Cypher86** · 11-01-2009, 10:39

scusa ma nn ho capito il tuo commento finale
cosi va bene?

questa è la struttura html
////////////////////////////////////////////////////////////////////////
echo "<tr id=lotto1><input type=\"hidden\" name=\"id_lotto1\" id=\"id_lotto1\" value=\"0\">
<input type=\"hidden\" name=\"pr_vendita1\" id=\"pr_vendita1\" value=\"0\">
<td id=\"num_lotto1\">1.</td>
<td><input type=\"text\" size=\"12\" id=\"prezzo_base1\" name=\"prezzo_base1\" $disabled></td>
<td><input type=\"text\" size=\"12\" id=\"rilancio1\" name=\"rilancio1\" $disabled></td>
<td>";
echo comboComune("lotto1","0", $disabled);
echo "</td>
<td><input type=\"text\" id=\"indirizzo_lotto1\" name=\"indirizzo_lotto1\" $disabled></td>
<td><textarea name=\"descrizione1\" cols=40 rows=3 $disabled></textarea></td>
<td><input type=\"radio\" name=\"vendita_lotto1\" value=\"0\" checked $disabled>No <input type=\"radio\" name=\"vendita_lotto1\" value=\"1\" $disabled>Si <input type=button value=Prezzo onclick=\"javascript:autoPopup(1,event);\"></td>";
//////////////////////////////////////////////////////////////////////////////
questa è la funzione ke mi hai dato tu modificata
//////////////////////////////////////////////////////////////////////////////
function addLotto(id){
var tbody = document.getElementById
(id).getElementsByTagName("TBODY")[0];
var lotto=document.getElementById("lotto1");
var newRiga=lotto.cloneNode(true);
numLotti=numLotti+1;

updateAttributes(newRiga,'id_lotto'+(numLotti-1),'id_lotto'+numLotti);
updateAttributes(newRiga,'pr_vendita'+(numLotti-1),'pr_vendita'+numLotti);
updateAttributes(newRiga,'num_lotto'+(numLotti-1),'num_lotto'+numLotti);
updateAttributes(newRiga,'prezzo_base'+(numLotti-1),'prezzo_base'+numLotti);
updateAttributes(newRiga,'rilancio'+(numLotti-1),'rilancio'+numLotti);
updateAttributes(newRiga,'comunelotto'+(numLotti-1),'lotto'+numLotti);
updateAttributes(newRiga,'indirizzo_lotto'+(numLot ti-1),'indirizzo_lotto'+numLotti);
updateAttributes(newRiga,'descrizione'+(numLotti-1),'descrizione'+numLotti);
updateAttributes(newRiga,'vendita_lotto'+(numLotti-1),'vendita_lotto'+numLotti);

tbody.appendChild(newRiga);

}
//////////////////////////////////////////////////////////////////////////////////////////////////
cosi va bene?

inoltre come vedi dalla struttura della tabella html
<td id=\"num_lotto1\">1.</td>
come faccio a cambiare 1. con 2,3,4,.......?

**Xinod** · 11-01-2009, 16:17

prossimamente racchiudi il codice in blocchi [ code]...[ /code] o [ php]...[ /php] (ovviamente senza spazio)
e posta solo l' xhtml-tipo risultante da processi lato server
(io capisco php ma altri potrebbero non capire, comunque distrae e non aiuta a determinare se li' si generino errori sul versante client)

in quello che ho postato io non devi sostituire 'name' o 'id' con ogni name o ogni id che vuoi cambiare, se lasci 'name' il numero presente nel name di qualsiasi elemento all' interno della parte clonata verra' sostituito dal numero che passi come newNum

se richiami
updateAttributes(newRiga,'id',numLotti); dove numLotti e' 5

l' id="id_lotto1" nella parte clonata diventa id="id_lotto5"
cosi' come
id="pr_vendita1" nella parte clonata diventa id="pr_vendita5"

ti ricordo che, a maggior ragione quando poi lavori col DOM, non puoi fare porcherie tipo
<tr><input><td>
un tr contiene td o th, qualsiasi altro elemento fuori da td o th e' in posizione errata
(e prima o poi genera quello che non vuoi: sorprese)

inoltre come vedi dalla struttura della tabella html
<td id=\"num_lotto1\">1.</td>
come faccio a cambiare 1. con 2,3,4,.......?

o appendi e dopo cambi

codice:

...
tbody.appendChild(newRiga);
document.getElementById('num_Lotto'+numLotti).getElementsByTagName('b')[0].firstChild.nodeValue=numLotti+'.';

oppure, prima di appendere

codice:

newRiga.getElementsByTagName('b')[0].firstChild.nodeValue=numLotti+'.';

ciao

**Cypher86** · 11-01-2009, 20:45

codice:

if($aggiorna and $lotto){
				$z=1;
				while ($row_lotto=mysql_fetch_array($result_lotto)){
					echo "<tr id=lotto$z><input type=\"hidden\" name=\"lotto$row_lotto[numero]\" value=\"$row_lotto[numero]\">
					<td>$row_lotto[numero]</td>
					<td><input type=\"text\" size=\"12\" id=\"prezzo_base$row_lotto[numero]\" name=\"prezzo_base$row_lotto[numero]\" value=\"$row_lotto[pr_base]\" $disabled></td>
					<td><input type=\"text\" size=\"12\" id=\"rilancio$row_lotto[numero]\" name=\"rilancio$row_lotto[numero]\" value=\"$row_lotto[pr_rilancio]\"  $disabled></td>
					<td>";
					echo comboComune("lotto$z",$row_lotto['comune'],$disabled);
					echo "</td>
						<td><input type=\"text\" id=\"indirizzo_lotto$row_lotto[numero]\" name=\"indirizzo_lotto$row_lotto[numero]\" value=\"$row_lotto[via]\" $disabled></td>
						<td><textarea name=\"descrizione$row_lotto[numero]\" cols=40 rows=3 $disabled>$row_lotto[descrizione]</textarea></td>
						<td><input type=\"radio\" name=\"vendita_lotto$row_lotto[numero]\" value=\"0\" checked $disabled>No <input type=\"radio\" name=\"vendita_lotto$z\" value=\"1\"";
					if ($row_lotto['venduto']==1) 
						echo "checked";
					echo " $disabled>Si <input type=button value=Prezzo onclick=\"javascript:autoPopup($z,event);\"></td>";
					$z++;
					}
				}
			else{
				echo "<tr id=lotto1><input type=\"hidden\" name=\"id_lotto1\" id=\"id_lotto1\" value=\"0\">
						<input type=\"hidden\" name=\"pr_vendita1\" id=\"pr_vendita1\" value=\"0\">
						<td id=\"num_lotto1\">1.</td>
						<td><input type=\"text\" size=\"12\" id=\"prezzo_base1\" name=\"prezzo_base1\" $disabled></td>
						<td><input type=\"text\" size=\"12\" id=\"rilancio1\" name=\"rilancio1\" $disabled></td>
						<td>";
				echo comboComune("lotto1","0", $disabled);
				echo "</td>
						<td><input type=\"text\" id=\"indirizzo_lotto1\" name=\"indirizzo_lotto1\" $disabled></td>
						<td><textarea name=\"descrizione1\" cols=40 rows=3 $disabled></textarea></td>
						<td><input type=\"radio\" name=\"vendita_lotto1\" value=\"0\" checked $disabled>No <input type=\"radio\" name=\"vendita_lotto1\" value=\"1\" $disabled>Si <input type=button  value=Prezzo onclick=\"javascript:autoPopup(1,event);\"></td>";
				}

codice:

function addLotto(id){
	var tbody = document.getElementById
	(id).getElementsByTagName("TBODY")[0];
	var lotto=document.getElementById("lotto1");
	var newRiga=lotto.cloneNode(true);
	numLotti++;
	//alert(numLotti);
	
	updateAttributes(newRiga,'id',numLotti);
	
	newRiga.getElementsByTagName('b')[0].firstChild.nodeValue=numLotti+'.';
	
	tbody.appendChild(newRiga);

}

function updateAttributes(node,attr,newNum){
	if(node.hasChildNodes){
		for(var k=0;k<node.childNodes.length;k++){
			updateAttributes(node.childNodes[k],attr,newNum);
		}
	}
	if(node[attr]){
		node.setAttribute(attr,node[attr].replace(/[0-9]+/,newNum));
	}
}

ok cosi dovrebbe essere giusto confermi???

cmq 6 un grande

grazie mille

**Cypher86** · 12-01-2009, 20:45

ok sembrerebbe funzionare

una cosa sola.....(alquanto strana)

nnmi cambia il nome,id dell'attributo riferito al radiobutton come mai???

**Cypher86** · 21-01-2009, 18:48

tutto funziona...........

solo una cosa

come faccio a fare si ke i value ti tutti gli attributi della nuova riga siano "" eccetto alcuni???

inoltre

se io ho da modificare un value di un attributo il cui id pero cambia dinamicamente come faccio?? document.getElementById('form_riferimento').nomeAt tributo+variabile.value=getEsec();

metto di seguito il codice

codice:

function addEsec(id){
    var tbody = document.getElementById
	(id).getElementsByTagName("TBODY")[0];
	var esecutato=document.getElementById("numEsec"+esec);
	var newRiga=esecutato.cloneNode(true);
	esec++;
	
	updateAttributes(newRiga,'id',esec);
	updateAttributes(newRiga,'name',esec);

//qui vorrei che i value degli attributi vengano reimpostati alcuni "" altri diversamente
	
	tbody.appendChild(newRiga);
	
	document.getElementById('form_esecuzione').contatore_esec.value=getEsec();
	
		
	
}

**Xinod** · 22-01-2009, 19:57

Originariamente inviato da Cypher86
come faccio a fare si ke i value ti tutti gli attributi della nuova riga siano "" eccetto alcuni???

spiega bene, parliamo di value di campi testo e/o option selezionate nelle select duplicate?
in base a cosa alcuni value restano uguali ed altri debbono azzerarsi?

se io ho da modificare un value di un attributo il cui id pero cambia dinamicamente come faccio?? document.getElementById('form_riferimento').nomeAt tributo+variabile.value=getEsec();

parliamo di id dell' elemento, univoco per documento, quindi vi accedi direttamente tramite
document.getElementById('id_elemento').nomeAttribu to.value=getEsec();

**Cypher86** · 23-01-2009, 13:48

Originariamente inviato da Xinod
spiega bene, parliamo di value di campi testo e/o option selezionate nelle select duplicate?
in base a cosa alcuni value restano uguali ed altri debbono azzerarsi?

parliamo di id dell' elemento, univoco per documento, quindi vi accedi direttamente tramite
document.getElementById('id_elemento').nomeAttribu to.value=getEsec();

parliamo di value di campi testo, hidden, radio, select, textarea

di conseguenza ho modificato la function che mi hai dato tu in questo modo

codice:

function updateAttributes(node,attr,newNum){
	if(node.hasChildNodes){
		for(var k=0;k<node.childNodes.length;k++){
			updateAttributes(node.childNodes[k],attr,newNum);
		}
	}
	if(node[attr]){
		node.setAttribute(attr,node[attr].replace(/[0-9]+/,newNum));
		node.setAttribute('value','');//questa riga la modifica
	}
}

solo che mi sa che nn è molto elegante visto che per esempio i campi hidden contengono degli id per verificare se un record è opresente in db (quindi esegue un update) oppure no (quindi fa un insert) e lo stesso per i select e i radio.

come posso quindi fare un casa piu intelligente???

**Xinod** · 23-01-2009, 16:25

butto giu' un' idea che dovrebbe funzionare nella tua situazione,
ma anche qui potrebbero esservi casi che non ho ancora ben considerato

lasciando la funzione updateAttributes come te l' avevo postata io

codice:

function resetValue(ref,tagName,exclusions){
	var els=ref.getElementsByTagName(tagName);
	for(var k=0,l=els.length;k<l;k++){
		var doNotReset=false;
		if(exclusions){
			for(var a in exclusions){
				if(els[k][a]==exclusions[a]) doNotReset=true;
			}
		}
		if(!doNotReset){
			if(tagName=='select') els[k].selectedIndex=0;
			else if(els[k].type=='radio' || els[k].type=='checkbox') els[k].checked=false;
			else els[k].value='';
		}		
	}
}

codice:

	updateAttributes(newRiga,'id',esec);
	updateAttributes(newRiga,'name',esec);
	resetValue(newRiga,'select');
	resetValue(newRiga,'input');
	resetValue(newRiga,'textarea');
		
	tbody.appendChild(newRiga);

cosi' azzeri i valori (nel caso di select viene selezionata la prima option), ma puoi specificare piccole eccezioni, per esempio:
- hai un input type="button" di cui non vuoi cambiare il value, ma vuoi azzerare il value di tutti gli altri input
resetValue(newRiga,'input',{'type':'button'});
- complicando un minimo lo scenario, oltre alla condizione di sopra, vuoi che non vengano azzerati i value di elementi con class="nonAzzerare"
resetValue(newRiga,'input',{'type':'button','class Name':'nonAzzerare'});

Discussione: aggiunta dinamicamente di una riga con combobox

Strumenti discussione

Ricerca discussione

Visualizza

Permessi di invio