[JS/DOM] Elementen leeg na innerHTML

[Verwijderd]

Hallo,

ik heb de search gebruikt en gegoogled, maar kan er niet veel over vinden.
Ik wil dynamisch door javascript elementen toevoegen aan mijn form.
De elementen staan in een div, daarom dacht ik dat ik ze mooi kon toevoegen als html. Dit werkt wel alleen zijn na het toevoegen van een element de waardes die zijn ingevuld weg. Dit is echter niet de bedoeling.

Ik vind het teveel code om helemaal om te zetten naar DOM en vind het ook niet geschik om van de voren eerst alle waardes te slaan om ze na het toevoegen weer in te vullen.

Weet iemand hier een oplossing voor?

[BtM909]

Zonder glazenbol en voorbeeld-code wordt het lastig om een antwoord te geven, denk je niet?

[Clay]

Dit werkt wel alleen zijn na het toevoegen van een element de waardes die zijn ingevuld weg.

Wat doe je dan precies? form.innerHTML += "< form meuk ... >"; ?

[Verwijderd]

Kan moeilijk de hele code posten.... is nogal een lap tekst en het gaat om het idee.

Ik voeg elementen toe een aan div, bijv <input type='file' name='f1'>. Dit doe ik doormiddel van een druk op een knop, dit voeg ik toe aan de innerHTML van de div.
Dit werkt wel, alleen zijn alle ingevulde waardes weg.

voorbeeldje

<div id="test">
<input type='file' name='f1'> {hier staat nog het een en ander achter}
<input type='file' name='f2'> {hier staat nog het een en ander achter}
<div>

er heb een knop die zoiets doet:
document.getElementById('test').innerHTML += "<input type='file' name='f2'> {hier staat nog het een en ander achter}";

als je daar op druk komt er netjes een element bij, alleen zijn de ingevulde waardes weg

[ Voor 58% gewijzigd door Verwijderd op 13-11-2004 16:11 ]

[BtM909]

Omdat je loopt te klooien met ' en " quotes

code:

document.getElementById('test').innerHTML += "<input type='file' name='f2'> {hier staat nog het een en ander achter}"

Zou in principe al moeten werken... Maar waarom doe je het niet op de DOM methode.. Veel overzichtelijker (dacht trouwens ook te menen dat het sneller is)

[Verwijderd]

quotes is alleen in het voorbeeld.

Het elementen toevoegen werkt gewoon, maar de ingevulde waardes zijn weg

[BtM909]

Verwijderd schreef op zaterdag 13 november 2004 @ 16:10:
quotes is alleen in het voorbeeld.

Het elementen toevoegen werkt gewoon, maar de ingevulde waardes zijn weg

Geef dan ff een voorbeeld Ik ga niet voor jouw plezier zelf iets in elkaar zetten om eventueel aan te tonen dat het werkt

[Verwijderd]

code:

<div id="test">
<input type='file' name='f1'> {hier staat nog het een en ander achter}
<input type='file' name='f2'> {hier staat nog het een en ander achter}
</div>

er heb een knop die zoiets doet:

<a href="#" onclick="add(); return false;">add</a>

<script>
function add() {
document.getElementById('test').innerHTML += "<input type='file' name='f2'> {hier staat nog het een en ander achter}";
}
</script>

btw uiters dirrty code... maar alleen als voorbeeld

wil eigelijk geen dom, wat dan krijg ik teveel regels document.createElement en element.setAttribute....

[ Voor 74% gewijzigd door Verwijderd op 13-11-2004 16:18 ]

[BtM909]

Je hebt het over de values in de input-tags

Logisch dat die weg zijn, want het 'form' wordt opnieuw geinitieerd. Als je die wilt behouden, dan moet je de waardes zelf opslaan... Weet ff niet of createElement wel die waardes behoud.

[Aram]

Je kunt aan een input veld van het type file geen waarde opgeven. Dit is een kwestie van security.

[Verwijderd]

Ik zeg al vanaf mijn 1e topic dat de waardes verloren gaan, als ik iets toevoeg.
Dan moet je niet verbaast kijken als je er zelf achterkomt.

De waardes vul ikzelf niet in, die worden door de gebruiker ingevoerd en als hij kiest voor nog meer in te willen voeren, klikt hij er een element bij. Maar dan is/was dus alles weg.

Als ik het via DOM oplos, blijven de waardes wel staan!! een klein voorbeeldje.
Alleen heb nu als +- 30 regels code voor alleen het element erin te zetten
Maar ja... het is dan niet anders.

Zit nu dan nog met een ander probleem:

code:

elelent.onclick = function() {remove(teller)};

LET OP!! voorbeeld code...

De teller geeft zeg maar het id weer van het te verwijderen element, in de functie wordt er iets van gemaakt van "dFoto0".
Alleen is teller een variabele te telkens ophoogd als ik een element toevoeg. Maar nu moet elke element statisch zijn eigen nummer als argument van de functie hebben. Terwijl die nu het nieuwe te vergeven nummer mee krijgt en die er er niet.
Hoe kan ik dit oplossen

[X-Lars]

A different approach: zet extra invoervelden in een div die initieel onzichtbaar is en door de gebruiker zichtbaar gemaakt kan worden (met javascript de style property veranderen). Zo gaan er ook geen waarden verloren. Misschien zou je het zo kunnen doen.