Cookies op Tweakers

Tweakers maakt gebruik van cookies, onder andere om de website te analyseren, het gebruiksgemak te vergroten en advertenties te tonen. Door gebruik te maken van deze website, of door op 'Ga verder' te klikken, geef je toestemming voor het gebruik van cookies. Wil je meer informatie over cookies en hoe ze worden gebruikt, bekijk dan ons cookiebeleid.

Meer informatie

  • markvt
  • Registratie: maart 2001
  • Laatst online: 18-01 14:22
Ik ben een formulier aan het bouwen en loop tegen het volgende aan.

Voorbeeld van het input veld:
code:
1
2
3
<html><head><title></title></head><body><form>
<input type="number" min="1" max="10">
</form></body></html>

fiddle: http://jsfiddle.net/e0nhkzh7/

So far so good, echter ik weet de min/max waarde nog niet op het moment dat de input op het scherm geplaatst is. Dit kan ik pas later bepalen.

Nu zet ik de waarde van min en max via een jquery script:
http://jsfiddle.net/np0zjv4p/
Dan controleert hij de waarde wanneer je op submit klikt.

Nu heb ik echter geen submitknop maar een andere button die een javascript uitvoert dat wat checks uitvoert en dan het formulier submit.

De validatie op het veld wordt dan overgeslagen
http://jsfiddle.net/cnmkrz2u/1/

Dit probleem komt omdat we eigen checks hebben en een jquery plugin die validatie toepast bij de submit van het formulier. De eigen checks worden door het javascript uitgevoerd en de jquery plugin doet dit onsubmit.

Nu is het volgens mij de enige optie om hiervoor de onsubmit van het formulier zelf te gebruiken. Maar wellicht is er een andere optie die ik over het hoofd heb gezien?

www.van-tilburg.info -=- meka (sega emulator) - Proud MEDION fanclub member - KOPPIG VOLHOUDEN !


  • azerty
  • Registratie: maart 2009
  • Laatst online: 23:18

azerty

McFly

En waarom kun je dat veld ook niet met je eigen javascript controleren?

  • markvt
  • Registratie: maart 2001
  • Laatst online: 18-01 14:22
Dan ben ik de jquery validatie plugin nogmaals aan het maken, die heeft wel functionaliteit om min/max te controleren echter kan die maar 1x aangemaakt worden en kan je later geen regels toevoegen die gecontroleerd moeten worden.

Mogelijk kan ik ook die validatie plugin vervangen door een andere waar je wel later extra validatie regels aan kunt toevoegen.

www.van-tilburg.info -=- meka (sega emulator) - Proud MEDION fanclub member - KOPPIG VOLHOUDEN !


  • GeertJam
  • Registratie: juli 2008
  • Laatst online: 11-01 15:47
Kijk hier eens (Geaccepteerd antwoord):

http://stackoverflow.com/...ing-html5-form-validation

GeertJam wijzigde deze reactie 24-02-2015 13:10 (11%)

Eury#2434


  • azerty
  • Registratie: maart 2009
  • Laatst online: 23:18

azerty

McFly

quote:
markvt schreef op dinsdag 24 februari 2015 @ 12:45:
Dan ben ik de jquery validatie plugin nogmaals aan het maken, die heeft wel functionaliteit om min/max te controleren echter kan die maar 1x aangemaakt worden en kan je later geen regels toevoegen die gecontroleerd moeten worden.
Volgens dit SO antwoord zou het wel mogelijk moeten zijn om de regels te wijzigen (snel opzoekwerk):

http://stackoverflow.com/...hanging-rules-dynamically

  • markvt
  • Registratie: maart 2001
  • Laatst online: 18-01 14:22
Als ik deze code toevoeg kan ik het toevoegen aan mijn eigen validatie:
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$('input').blur(function(event) {
        if (event.target.validity)
        {
            if (event.target.checkValidity())
            {
                $(event.target).removeClass("erroneous");
//              validForm=true;
            }
            else
            {
                $(event.target).addClass("erroneous");
//              validForm=false;
            }
        }
    });

Nu alleen nog iets knutselen dat ook met IE9 om wil gaan 8)

www.van-tilburg.info -=- meka (sega emulator) - Proud MEDION fanclub member - KOPPIG VOLHOUDEN !


  • NMe
  • Registratie: februari 2004
  • Nu online

NMe

Admin DevschuurŽ

Quia Ego Sic Dico.

Waar hoort mijn topic? staat er niet voor niks.

PRG>>WEB

'E's fighting in there!' he stuttered, grabbing the captain's arm.
'All by himself?' said the captain.
'No, with everyone!' shouted Nobby, hopping from one foot to the other.


  • R4gnax
  • Registratie: maart 2009
  • Laatst online: 23-10-2017
quote:
markvt schreef op dinsdag 24 februari 2015 @ 12:45:
Dan ben ik de jquery validatie plugin nogmaals aan het maken, die heeft wel functionaliteit om min/max te controleren echter kan die maar 1x aangemaakt worden en kan je later geen regels toevoegen die gecontroleerd moeten worden.

Mogelijk kan ik ook die validatie plugin vervangen door een andere waar je wel later extra validatie regels aan kunt toevoegen.
Mede dankzij dit soort problemen ben ik zelf compleet van input validatie afgestapt. Tegenwoordig cross-bind ik input data aan een in-memory observable data model en daar zet ik validatie op.

Werkt een flink stuk prettiger, moet ik zeggen. De buy-in factor is natuurlijk wel een stuk hoger, maar de meeste websites binnen het segment waar mijn werkgever in zit hebben toch al dermate veel scripting nodig dat we al op een MV* oplossing zitten.

  • markvt
  • Registratie: maart 2001
  • Laatst online: 18-01 14:22
Als je alleen de stijl wilt wijzigen als de waarde niet valid is kan er natuurlijk ook gebruikt worden van de :invalid op de input.
Cascading Stylesheet:
1
input:invalid{border:2px solid orange;}

www.van-tilburg.info -=- meka (sega emulator) - Proud MEDION fanclub member - KOPPIG VOLHOUDEN !

Pagina: 1


Apple iPhone X Google Pixel 2 XL LG W7 Samsung Galaxy S9 Google Pixel 2 Far Cry 5 Microsoft Xbox One X Apple iPhone 8

© 1998 - 2018 de Persgroep Online Services B.V. Tweakers vormt samen met o.a. Autotrack en Hardware.Info de Persgroep Online Services B.V. Hosting door True

*