[jQuery] Selectbox in form op andere waarde zetten

[Verwijderd]

In een webformulier check ik met jQuery of veldje1 (een gewoon inputveld) is ingevuld, en dan doe ik nog een query waar true of false uitkomt. Als ie true is kan ik het formulier verzenden, en als ie fout is dan komt er een melding met 'fix eerst nog je waarde'. Dat gaat dus goed allemaal. Dit is mijn jQuery functie.

code:

$( "#mijnform" ).validate({
  rules: {
    veldje1: {
      required: true,
      remote: "checkveldje1.php"
    }
  }
});

So far so good. Maar nu is er in het formulier ook nog een veldje2 (een selectbox). Zou ik die op een bepaalde waarde kunnen laten verspringen a.d.h.v. de uitkomst (true/false) van de remote query met bovenstaande jQuery functie? Of kan dit alleen met normaal javascript als ik bijvoorbeeld achter veldje2 een onChange neerzet? Ik ben al vanaf 22:00 uur aan het pielen hiermee, maar helaas nog zonder resultaat. Weet iemand raad?

[itsleon]

Ja je kan het me jQuery doen en is zelfs redelijk simpel.

Je select of beter gezegd je option hebben een value. Wanneer je met jQuery $(select).val(value van de option) doet heb je de select aangepast.

Als je er niet uitkomt moet je het maar laten weten.

[vpm]

http://lmgtfy.com/?q=jquery+select+change+value

Ik kan validate niet terugvinden in de jQuery API, dus ik ben w.d.b. even het spoor bijster, maar je kan met een simpele json response toch gewoon een soort validatie doen (e.g. data.status == true) - ofwel: dat kan met de validation plug-in ook wel...
Adhv die waarde kun je gewoon een trigger leggen naar je overige veld(en).

jQuery is all about events, dus nee, je hoeft hier geen normale js te gebruiken.

[ Voor 85% gewijzigd door vpm op 02-10-2014 12:09 ]

[Verwijderd]

Bedankt voor het op de juiste weg sturen. Ik moet nog wennen aan de terminologie, vandaar dat ik soms niet precies weet hoe ik moet zoeken. Deze plugin gebruik ik trouwens: http://jqueryvalidation.org/

Hmmm, als ik voor mijn selectbox met name en id = "veldje2" met mogelijke waarden "ja" en "nee" het volgende hard in jQuery probeer om te zetten:
$( "#veldje2" ).val("ja");
dan gebeurt er niets met mijn selectbox. Hij verspringt niet van "nee" naar "ja".

Ik denk dat er nog een extra functie bij moet om veldje2 om te zetten, afhankelijk van de uitkomst van de php-file. Dan mag hij veldje2 omzetten van ja naar nee of omgedraaid. Ik denk dat het dan zoiets moet worden:

code:

$( "#mijnform" ).validate({
  rules: {
    veldje1: {
      required: true,
      remote: "checkveldje1.php"
    }
  }
});

en dan zoiets: if (checkveldje1.php == true) change $( "#veldje2" ).val("ja");

Lastig allemaal, voor mij dan. In PHP kan ik me aardig redden, maar js of jquery vind ik nog steeds een beetje abacadabra. Voor de 2e functie zal ik nog de juiste syntax moeten vinden... Any help?

[ Voor 19% gewijzigd door Verwijderd op 02-10-2014 14:56 ]

[itsleon]

Hierbij voorbeeld voor de select veranderen naar een andere value

http://jsfiddle.net/quyj3r6y/

Daarbij wat moet de validatie precies doen? alleen kijken of het veld is ingevuld of kijkt het nog naar andere dingen?

[Verwijderd]

Dank je!

Ik snap niet waarom hij het bij mij niet deed, want als ik in jouw javascript alles weghaal behalve:
$("select").val("Nee");
Dan doet ie het wel gewoon, hij zet hem na runnen meteen op Nee, ook al was Ja selected.

Mijn validatie kijkt in een tabel of de records aan een behaalde voorwaarden voldoen, bijvoorbeeld in een bepaalde categorie zitten. De selectbox 'veldje2' met alleen Ja/Nee, die is in dit voorbeeld dan een beetje overbodig. (Die check heb je dan eigenlijk al gedaan en aan de achterkant doe je hem weer). Dit was de meest eenvoudige vorm waartoe ik het kon terugbrengen voor mijn vraag, maar ik ga het in uitgebreidere vorm nog wel nodig hebben, vandaar.

Ik zou alleen nog willen weten hoe ik de van remote:checkveldje1.php de waarde in een variabele kan stoppen. Dan kan ik met IF (die waarde is true) $("select").val("Nee"); uitvoeren of niet.
Volgens mij moet ik dat doen met load(). Ik zit nu http://api.jquery.com/load/ te bestuderen, ik denk zoiets:

if ( $( "#veldje1" ).load( "checkveldje1.php" ) = true ) $("select").val("Ja");

[itsleon]

Nu ben ik niet thuis in de validatie plugin die je gebruikt maar wat je kan doen omdat je veld1 server side wil controleren is het volgende.

Je zou een ajax call moeten doen naar checkveldje1.php. Ik zou daarvoor .ajax functie gebruiken.

Je krijg dan ongeveer dit

code:

var request = $.ajax({
  url: "checkveldje1.php",
  type: "POST",
  data: $(#veldje1).val(),
  dataType: "html"
});
 
request.done(function( data ) {
  if(data == een waarde){
   $('select').val("Ja")
}else{
$('select').val("Nee")
}
});

Je zou de ajax call kunnen uitvoeren op de keyup of blur event van veldje1

[DJMaze]

Als JavaScript uit staat, hoe werkt het formulier dan?

[Verwijderd]

Dan kunnen ze de boom in, DJMaze!
Ik check uiteraard aan de achterkant ook nog alles en dan krijgen ze een foutmelding dat ze terug moeten.
Die foutmelding zullen ze dan niet altijd wegkrijgen, want ik vul soms ook selectboxen met ajax aan de hand van een waarde die in een andere selectbox is gekozen. Dus als die 2e checkbox leeg blijft omdat bij hun javascript uit staat, dan houdt het op. Is ook niet de doelgroep, de mensen die javascript uit zetten.

Dankje itsleon, ziet er goed uit, ik ga het meteen proberen!

[ Voor 45% gewijzigd door Verwijderd op 03-10-2014 15:32 ]

[itsleon]

DJMaze schreef op vrijdag 03 oktober 2014 @ 14:22:
Als JavaScript uit staat, hoe werkt het formulier dan?

Ik gok dat zo 99.9% van de web gebruikers nog geen eens weten dat ze het kunnen uitzetten.
Denk ook dat een zeer groot aantal website's niet zullen werken.

[RobIII]

itsleon schreef op vrijdag 03 oktober 2014 @ 15:26:
[...]


Ik gok dat zo 99.9% van de web gebruikers nog geen eens weten dat ze het kunnen uitzetten.

Ik zou de NoScript/Ghostery/ScriptBlock/etc. users niet graag de kost geven

[itsleon]

RobIII schreef op vrijdag 03 oktober 2014 @ 15:37:
[...]

Ik zou de NoScript/Ghostery/ScriptBlock/etc. users niet graag de kost geven

Ik gok nog steeds dat het aantal bezoekers van je website zeer laag zal zijn die bovenstaande plugins zullen gebruiken (Ligt natuurlijk wel aan je doelgroep). Daarbij neem ik aan dat personen die de plugins gebruiken ook wel zo verstanding zijn om javascript aan te zetten wanneer ze merken dat een website niet optimaal werkt zonder.

[NMe]

itsleon schreef op vrijdag 03 oktober 2014 @ 15:55:
[...]

Ik gok nog steeds dat het aantal bezoekers van je website zeer laag zal zijn die bovenstaande plugins zullen gebruiken (Ligt natuurlijk wel aan je doelgroep). Daarbij neem ik aan dat personen die de plugins gebruiken ook wel zo verstanding zijn om javascript aan te zetten wanneer ze merken dat een website niet optimaal werkt zonder.

Je maakt hier héél gevaarlijke aannames voor een webdeveloper....

Een formulier hoort, tenzij je doelgroep heel beperkt is (bijvoorbeeld bij een intranettoepassing), altijd te werken zonder javascript. Daarvoor heb je progressive enhancement of graceful degradation. Als je een formulier maakt dat breed toegankelijk moet zijn op het web dat javascript nodig heeft om te werken, dan doe je iets niet goed.

[itsleon]

NMe schreef op vrijdag 03 oktober 2014 @ 15:59:
[...]

Je maakt hier héél gevaarlijke aannames voor een webdeveloper....

Een formulier hoort, tenzij je doelgroep heel beperkt is (bijvoorbeeld bij een intranettoepassing), altijd te werken zonder javascript. Daarvoor heb je progressive enhancement of graceful degradation. Als je een formulier maakt dat breed toegankelijk moet zijn op het web dat javascript nodig heeft om te werken, dan doe je iets niet goed.

De TS maakt gebruik van clientside validatie en zet aan de hand van waardes een x aantal velden op een andere waarde en controleert het zover ik kan zien altijd nog aan de server kant (zie checkveldje1.php).
Wat er dus zou gebeuren wanneer javascript uit staat is dat er geen velden zijn die automatisch van waarde veranderen.
Het formulier blijft dus nog steeds werken en er is niks aan de hand.

Daarbij is het maar net wat de klant wilt. Als de klant wilt dat zijn website nog steeds goed blijft werken zonder javascript kan dit inhouden dat het hem meer geld gaat kosten.

Daarbij mag je van een auto verwachten dat je nog steeds van A naar B kan komen zonder de motor te starten?

[DJMaze]

itsleon schreef op vrijdag 03 oktober 2014 @ 16:19:
Daarbij is het maar net wat de klant wilt. Als de klant wilt dat zijn website nog steeds goed blijft werken zonder javascript kan dit inhouden dat het hem meer geld gaat kosten.

Dat is volgens mij de omgekeerde wereld.
Aangezien je ook serverside controleert, is het ontwikkelen van een formulier zonder JavaScript sneller.
Je hoeft immers niks in JavaScript te programmeren, dat is alleen "extra".

Veld controles in HTML5 is er al clientside en behoeft dus ook geen JavaScript, tenzij je oude systemen wilt ondersteunen.

[Verwijderd]

DJMaze schreef op zaterdag 04 oktober 2014 @ 14:21:
[...]

Dat is volgens mij de omgekeerde wereld.
Aangezien je ook serverside controleert, is het ontwikkelen van een formulier zonder JavaScript sneller.
Je hoeft immers niks in JavaScript te programmeren, dat is alleen "extra".

Veld controles in HTML5 is er al clientside en behoeft dus ook geen JavaScript, tenzij je oude systemen wilt ondersteunen.

Zoals ik al zei, ik gebruik bijvoorbeeld de keuze van een selectbox om met een query de selectbox van een andere pulldown te vullen. Dit is een fijnere en snellere ervaring voor de gebruiker. Anders moet ik daar weer een tussenpagina voor maken. Daarnaast reken ik een ander stel inputvelden van belang zijnde waarden uit met javascript. Ook dit heeft toegevoegde waarde voor de gebruiker. Dat ik dit aan de achterkant nogmaals doe doet er niet toe. Gebruikers die javascript uitzetten is niet de doelgroep. Is gewoon niet aan de orde in dit geval. Daarnaast is dit een javascript/ajax topic dus hierover verder steggelen heeft niet zoveel zin, je punt is reeds gemaakt.

[R4gnax]

DJMaze schreef op zaterdag 04 oktober 2014 @ 14:21:
Veld controles in HTML5 is er al clientside en behoeft dus ook geen JavaScript, tenzij je oude systemen wilt ondersteunen.

Of tenzij je iets moet of wilt ondersteunen wat de basale HTML5 validaties ontstijgt. En dat gebeurt nog al snel.

[NMe]

itsleon schreef op vrijdag 03 oktober 2014 @ 16:19:
[...]

Daarbij is het maar net wat de klant wilt. Als de klant wilt dat zijn website nog steeds goed blijft werken zonder javascript kan dit inhouden dat het hem meer geld gaat kosten.

Omgekeerde wereld. Je product hoort altijd te werken voor de aangegeven doelgroep en enkel in overleg met de klant kun je dingen weglaten.

Daarbij mag je van een auto verwachten dat je nog steeds van A naar B kan komen zonder de motor te starten?

Nee, maar die vergelijking is dan ook krom. Je mag wél van een auto verwachten dat hij je van A naar B brengt als je cruise control stuk is. Ja, dat rijdt wat vervelender op de snelweg maar uiteindelijk kom je wel waar je zijn moet. Javascript en progressive enhancement zijn niet anders dan dat.

[incaz]

itsleon schreef op vrijdag 03 oktober 2014 @ 16:19:
Daarbij is het maar net wat de klant wilt. Als de klant wilt dat zijn website nog steeds goed blijft werken zonder javascript kan dit inhouden dat het hem meer geld gaat kosten.

En dat vertel je ze netjes vooraf? Zelf vind ik het eigenlijk wel logisch namelijk dat websites werken zonder javascript. Websites zonder html, da's al ingewikkelder...

(Overigens, nou heb ik javascript niet altijd uitstaan, maar over het algemeen doe ik back -> volgende resultaat als een site niet werkt met mijn plugins. En kom ik pas weer terug als ik het echt nodig heb en elders niet kan vinden. Dus het kan uitmaken.)