Ik probeer m'n eerste schreden met ajax te zetten.
Nu heb ik de tutorial alhier meermalen doorgenomen, weken zitten puzzelen, en heb al aardig resultaat geboekt, vind ik zelf.

Op deze site heb ik een invoerveld waar je een id in kan vullen, waarna bij verlaten van het veld de bijbehorende naam verschijnt.

Het is de bedoeling dat gebruikers hiermee hun groep kunnen aangeven.

Probleem is dat nadat een nieuw veld is toegevoegd, de voorgaande velden wel gewijzigd kunnen worden (mag ook) maar de namen worden niet meer bijgwerkt.

Ook is het niet handig dat de waarde die eerder is ingevoerd wordt meegenomen naar het nieuwe veld.

Kan iemand mij richting geven waar ik het zoeken moet?
Voor iedere veld is steeds het id: naamid en de name: naamid en voor de naam velden geldt hetzelfde. (id="naam" en name="naam").
Ik denk dat het daar ergens mis gaat, een id mag zo-ie-zo maar 1x voorkomen in een pagina. Van de name zou je evt. een array kunnen maken (name="naamid[]").
van name heb ik arrays gemaakt. Bedankt.

De waarde van id moet ik waarschijnlijk in onderstaand stukje Javascript regelen?


var cnt = 1;
function AddField(copy,paste,baseid){
   if(document.getElementById(copy)){

      cnt++;
      var type = document.getElementById(copy).nodeName; // get the tag name of the source copy.
		
      var but = document.createElement('input');
      var br = document.createElement('br');
		
      but.type = 'button';
      but.value = 'x';
      but.className = 'button';
      but.onclick = function(){ this.parentNode.parentNode.removeChild(this.parentNode); };
		
      var destination = document.getElementById(paste);
      var source      = document.getElementById(copy).cloneNode(true);
		
      var newentry = document.createElement(type);
		
      newentry.appendChild(source);
      newentry.value='';
      newentry.appendChild(but);
      newentry.appendChild(br);
 
      newid = baseid+cnt;
      newentry.setAttribute("id", newid)
		
      destination.appendChild(newentry);
   }
}


Hoe kan moet ik dit aanpassen om de id een uniek nummertje mee te geven?
Waar komt de variabele 'cnt' vandaan?
@Jos

-- edit --
zie nu dat je het ID al instelt, dus mogelijk zegt mijn hele reactie niets :-)
maar misschien heb je er toch wat aan...
-- edit --

met newentry.setAttribute("id", "dit is dan het id") kun je het ID instellen van een entry. Ik heb even niet heel erg in je script gezocht, maar als ik zo hoor dat velden na afloop niet meer te wijzigen zijn, maar eerst wel, dan zit het in de manier waarop je het veld aanspreekt. Dit doe je volgens mij met getElementById, dus dan moet het ID echt uniek zijn.

Wat je zou kunnen doen is een functie schrijven die een uniek nummer genereert die nog niet in gebruik is.

Bijvoorbeeld zoiets:

	function randomGetal () {
    	num = Math.random();
    	num = num*(10000000-0);
    	num = Math.round(num);
		return num;
	}
	
	function generateUniqueID () {
    	var id = randomGetal();

    	while (document.getElementById(id) !== null) {
    		id = randomGetal();
    	}
    	return id;
	}



Dit geeft dan een id die bestaat uit een nummer, maar je kunt hier ook andere dingen voor verzinnen natuurlijk :p
Die staat gedeclareerd boven de functie AddField, Jan.

@Rens
Je verhaal is helemaal niet overbodig hoor. Ik ben me inmiddels wel bewust dat ik aan de id moet sleutelen, maar er staan meerdere id's in het te kopieren stukje html.

Het is jammer dat ik in de broncode niet kan zien wat er precies gebeurt is na het toevoegen van een nieuw invulveld.

Kan ik in plaats van random id niet gewoon een tellertje gebruiken?

Je kan best random/ordered Id's genereren, maar dan moet je wel zorgen
dat het NIET met een getal begint :-)

<?
var collectie = document.getElementsByTagName('input'), i = tags.length;
while(i--) {
collectie[i].id = 'elementNr' + i;
collectie[i].onclick = function() {
alert(this.id);
}
}

?>
Hier(Maxthon icm IE7) werkt hij gewoon zoals hoort...

[edit]Oeps, verkeerd gelezen...

[edit]Na lang te kijken lijkt het erop dat je de id's van de text velden nooit verandert, maar alleen die van de span, hierdoor update hij er maar één...[/edit][/edit]
Oké... weer een stapje dichterbij... ik geef idd niet mee aan welk element hij de nieuwe id moet toekennen.
Hoe kan ik dat oplossen?
Wat ik zei is niet helemaal waar - wat fout is is dat de ids van de text velden op deze manier allemaal hetzelfde zijn...
Dan klopt het toch wel wat je zei??

Ik kan me zo voorstellen dat ik met de code newentry.setAttribute een id instel voor het te kopiëren deel, in mijn geval dus de complete span. Heb ik dat goed?
Maar ik moet eigenlijk in plaats daarvan een nieuwe id instellen voor zowel het inputveld waar de code ingetoetst wordt, als voor het inputveld waar de via ajax opgezochte naam in wordt weergegeven... toch?

corrigeer me maar als ik het tot nu tot fout begrepen heb...

Reageren