Ik heb het gebruikers mogelijk gemaakt om dynamisch invoervelden te laten toevoegen. Hieronder staat hoe ik dat heb gedaan en daaronder staat wat voor probleem ik daarbij ondervind.
Hieronder staan de belangrijkste JS-statements om een inputveld toe te voegen. Denk de for-loop en dergelijke er even bij:
Dit is de code om een veld weer te verwijderen:
Het probleem:
Als een gebruiker een veld leeg laat of op een andere manier foute invoer levert, dan wordt de gebruiker terug gestuurd via javascript:history.back(1). Het probleem is dat veranderingen niet meer te zien zijn als de gebruiker terug gaat. Alleen de veranderingen in de velden die er in de beginsituatie ook al waren. Een veld dat dynamisch is toegevoegd is niet meer te zien.
Dit is de basis code die met php wordt gegenereerd (2 velden zijn zichtbaar):
Dynamisch met behulp van javascript zou de code er dan zo uit kunnen zien (drie velden zijn zichtbaar):
Na het controleren van de input (in php) wordt de gebruiker weer bij foute invoer teruggestuurd. Ik zou graag zien dat de situatie dan is zoals in de laatste html-code. Helaas is dat niet zo en is de html-code zoals in het eerste geval.
Weet iemand hoe ik dit kan oplossen? Is er een javascript oplossing waarmee ik bijvoorbeeld de cache kan aanpassen?
(Het probleem zou opgelost kunnen worden door de controle van userinput in javascript te doen. Voor mijn site doen we echter alles in php. De IE-bug heb ik al opgelost dmv de volgende header in php:
)
Hieronder staan de belangrijkste JS-statements om een inputveld toe te voegen. Denk de for-loop en dergelijke er even bij:
JavaScript:
1
2
| div[ index ].style.display = "block"; childs[ i ].disabled = false; |
Dit is de code om een veld weer te verwijderen:
JavaScript:
1
2
| div[ index ].style.display = "none"; childs[ i ].disabled = true; |
Het probleem:
Als een gebruiker een veld leeg laat of op een andere manier foute invoer levert, dan wordt de gebruiker terug gestuurd via javascript:history.back(1). Het probleem is dat veranderingen niet meer te zien zijn als de gebruiker terug gaat. Alleen de veranderingen in de velden die er in de beginsituatie ook al waren. Een veld dat dynamisch is toegevoegd is niet meer te zien.
Dit is de basis code die met php wordt gegenereerd (2 velden zijn zichtbaar):
HTML:
1
2
3
4
5
6
| <div class="questions" style="display: block" > <input name="questions[]" type="text" value="{question}" > </div> <div class="questions" style="display: block" > <input name="questions[]" type="text" value="{question}" > </div> <div class="questions" style="display: none" > <input name="questions[]" type="text" value="{question}" disabled> </div> |
Dynamisch met behulp van javascript zou de code er dan zo uit kunnen zien (drie velden zijn zichtbaar):
HTML:
1
2
3
4
5
6
| <div class="questions" style="display: block" > <input name="questions[]" type="text" value="{question}" > </div> <div class="questions" style="display: block" > <input name="questions[]" type="text" value="{question}" > </div> <div class="questions" style="display: block" > <input name="questions[]" type="text" value="{question}" > </div> |
Na het controleren van de input (in php) wordt de gebruiker weer bij foute invoer teruggestuurd. Ik zou graag zien dat de situatie dan is zoals in de laatste html-code. Helaas is dat niet zo en is de html-code zoals in het eerste geval.
Weet iemand hoe ik dit kan oplossen? Is er een javascript oplossing waarmee ik bijvoorbeeld de cache kan aanpassen?
(Het probleem zou opgelost kunnen worden door de controle van userinput in javascript te doen. Voor mijn site doen we echter alles in php. De IE-bug heb ik al opgelost dmv de volgende header in php:
PHP:
1
2
| //soluting to IE bug, refreshing forms header("Cache-control: private"); |
)
[ Voor 12% gewijzigd door Verwijderd op 04-01-2005 10:37 ]