Man, wat een nest is js. Uit noodzaak ben ik begonnen met dit te leren. Het lukt wel hier en daar, maar ik zit vast bij een bepaalde opdracht. Het projectje omvat dus formuliervalidatie waarbij de user directe feedback krijgt. Ik zit met 2 problemen, die ik zal proberen zo goed mogelijk uit te leggen. Maar eerst, de link: http://cmdstud.khlim.be/~gveugen/ICT/ToelatingsproefFormulier/formulierGlennVeugen.html
Bekijk hem eens, dan zie je ook wat de bedoeling is. De serverside validatie gaat het me niet om, die wordt gedaan, maar daar moet ik niets aan veranderen. De bedoeling is dat we mbv javascript al direct aangeven waar iets fout zit, zodat de user niet moet wachten op de php validatie, en alle velden opnieuw moet invullen. Als vakje ingevuld is, bg groen, niet ingevuld, bg rood. So far so good.
Maar dan probleem 1 (klein probleem): bij de controle van het email adres. In FF werkt dit principe feilloos. Maar in IE6 krijg ik problemen. Voor de gemakkelijkheid de code even:
Als het email adres foutief is opgesteld dan treed functie insertErrorCell() in werking. Als het goed is dan komt removeErrorCell(). Kijk maar eens in FF wat ik bedoel. In IE zou dit ook moeten komen, daar wordt inderdaad een table row toegevoegd. Maar de stijl wordt niet toegepast, en de innerHTML blijkt het niet te doen. Ook wordt de table row niet verwijderd als de informatie correct blijkt te zijn. Ik kan natuurlijk kijken welke browser men gebruikt, en dan die errormsg al dan niet laten writen. Maar is er misschien een andere manier, of is er iets fout aan mijn methode?Code:function validateMail(name, type){ var field = document.getElementById(name); if(field.value.length == 0){ field.style.backgroundColor = "#f8c3b1"; field.style.borderColor = "#f39b7d"; field.style.borderStyle = "solid"; //rood inputfield } else { var apos= field.value.indexOf("@"); var dotpos= field.value.lastIndexOf("."); if (apos<1||dotpos-apos<2) { field.style.backgroundColor = "#f8c3b1"; field.style.borderColor = "#f39b7d"; field.style.borderStyle = "solid"; //rood inputfield if(document.getElementById("errormsg")) removeErrorCell();//controleer of er al een foutmelding gegeven wordt, indien ja, eerst vorige verwijderen, dubbele meldingen voorkomen insertErrorCell(); //voeg een nieuwe rij toe met foutmelding mailstructuur } else { removeErrorCell();//verwijder rij ůmet foutmelding mailstructuur field.style.backgroundColor = "#cef7c9"; field.style.borderColor = "#a9f1a0"; field.style.borderStyle = "solid"; //groen ipuntfield } } } function insertErrorCell(){ var row = document.getElementById('myTable').insertRow(7); row.innerHTML = "<td colspan='2' id='errormsg'>De structuur van uw email adres is foutief. Vul een email adres in met de volgende structuur: [email protected].</td>"; } function removeErrorCell(){ document.getElementById('myTable').deleteRow(7); }
================================================== ===============
Probleem 2.
Ok. Dit is een kwestie van kennis. Ik wil dat die radiobuttons gecontroleerd worden of ze gechecked worden. Ik heb al talloze scripts bestudeerd op het net, maar geen resultaat. Zoals je ziet zijn er meerdere radiosets, en ik wil dit kunnen valideren met 1 functie. Dit zou ook real time moeten gebeuren. Controleren of radiobuttons gechecked zijn is geen probleem, kom daar dan ook niet mee af :p. Ik wil dat er live feedback gegeven wordt als men de radios al dan niet checkt (vinkje en kruisje ofzo). Om dan op de onBlur een functie te gaan aanroepen is geen optie, want dan controleer ik 2 keer of de radios zijn gechecked, of is dit toch een optie? Het is een twijfelgeval, omdat het echt realtime moet gebeuren. Ook zou ik dit in 1 functie willen steken, dus niet dat ik voor ieder radiofield een nieuwe functie moet schrijven. Ook hier ondervond ik problemen, want als ik het volgende doe:
het gaat dus om die name. Dat werkt blijkbaar dus niet. Als dat al ging kwam ik zelf al een stuk verder. Wie o wie kan mij helpen en kan ik eeuwige dankbaarheid en vriendschap schenken? :pCode:function checkRadio(name){ var radiogroup = document.getElementById(name); for (i = 0; i< document.form1.name.length; ++i)
Je red me hiermee echt uit de nood, alvast bedankt om het te bekijken
- [Javascript] Formulier validatie probleem
-
11-04-2007, 04:03 #1
- Berichten
- 891
- Lid sinds
- 18 Jaar
[Javascript] Formulier validatie probleem
-
In de schijnwerper
Logo nodig? Nu 75,- ( ook andere grafische opdrachten )Freelance / WerkErvaren SEO Linkbuilder voor €17,50/uur - Boost Uw Online Zichtbaarheid!Freelance / Werk[NIEUW] VPS aanbod Webmedia - Nijmegen B.V.HostingLinkbuilding uitbesteden - 25 jaar ervaring - Zie behaalde resultatenAdvertentieruimte -
14-04-2007, 00:38 #2
- Berichten
- 891
- Lid sinds
- 18 Jaar
Probleem met de radiobuttons is opgelost, met IE blijft nog bestaan.
-
14-04-2007, 09:25 #364BitsWebhosting.EU
- Berichten
- 2.092
- Lid sinds
- 17 Jaar
Ow, hmm... ik dacht dat ik een paar dagen geleden dit al gepost had...
In IE zul je na het inserten van de row ook nog de td's moeten aanmaken. ( met insertCell() bv ). FF is daar iets gemakkelijker mee, IE echter niet.
http://www.mredkj.com/tutorials/tableaddrow.html
-
14-04-2007, 14:26 #4
- Berichten
- 891
- Lid sinds
- 18 Jaar
Het probleem is dan het volgende, ik zit met een tabel met per rij 2 td's, ik zou dus eigenlijk een insertCell() met colspan 2 moeten inserten. Is dit mogelijk?
Plaats een
- + Advertentie
- + Onderwerp
Marktplaats
Webmasterforum
- Websites algemeen
- Sitechecks
- Marketing
- Domeinen algemeen
- Waardebepaling
- CMS
- Wordpress
- Joomla
- Magento
- Google algemeen
- SEO
- Analytics
- Adsense
- Adwords
- HTML / XHTML
- CSS
- Programmeren
- PHP
- Javascript
- JQuery
- MySQL
- Ondernemen algemeen
- Belastingen
- Juridisch
- Grafisch ontwerp
- Hosting Algemeen
- Hardware Info
- Offtopic