Hallo
ik hoop dat jullie mij kunnen helpen. Ik heb een jquery script dat werkt. Dit script zorgt ervoor dat op basis van een dropdown de eerst volgende dropdown wordt getoont.
Alleen nu komt het gedeelte dat ik niet voor elkaar krijg, op het moment dat er een post plaats vind en ik keur deze af dan moet moeten bijde select opties er weer komen te staan dit gebeurd niet. Ik moet eerst weer opnieuw mijn eerste selectie maken. Dit moet ook bij het ophalen van de gegevens vanuit de database maar dit zal het zelfde zijn.
Dus kort gezegd er moet php in mijn script komen zodat mijn tweede select optie zichtbaar komt. Pagina wordt altijd opnieuw geladen bij submit
mijn code is als volgt:
Javascript Code:
Alvast bedankt!
Eerlijk gezegd snap ik niets van je vraag. De code heeft het nergens over een 'post'?
Jij weet wat de website doet dus voor jou klinkt het misschien heel logisch maar een online voorbeeld zou erg handig zijn.
Probeer alles wat duidelijker te formuleren want we kunnen zo niet bedenken wat je nou wilt.
Post een volledige code anders kunnen we niet helpen :-)
De eerste opmerking die ik nu al zie is waarom gebruik je geen switch statement?
Verder is het zijn er nog wel een aantal dingen te verbeteren maar daarvoor heb ik eerst een volledige code nodig
Code:switch( $(this).val() ) { case 'locatie1': $("#zaal1").slideDown("fast"); $("#zaal2,#zaal3).slideUp("fast"); break; default: $("#zaal1,#zaal2,#zaal3").slideUp("fast"); break; }
Hierbij mij gehele code met het aanroepen van database enzo. Hierin heb ik wel het aanroepen van het jquery eruit gelaten dit gebeurd op een andere plaats. Hoop dat dit voldoende is om mij te helpen. Bedankt voor de tip van switch, heb ik nog niet in de onderstaande code zitten.
Code:<?php if ($_POST['submit'] == "Update activiteit") { $idactiviteit = $_POST['idactiviteit']; } else { $idactiviteit = $_POST['idactiviteit']; } $title = __('activiteit bewerken'); function add_js() { ?> <script type="text/javascript"> $(function() { $( "#datepicker" ).datepicker( {showButtonPanel: true, minDate: -0 } ); }); </script> <script type="text/javascript"> $(document).ready(function(){ $("#plaats1").slideUp("fast"); $("#plaats2").slideUp("fast"); $("#plaats3").slideUp("fast"); $("#locatie").change(function(){ if($(this).val() == "Selecteer" ) { $("#zaal1").slideUp("fast"); //Slide Down Effect $("#zaal2").slideUp("fast"); $("#zaal3").slideUp("fast"); } else if ($(this).val() == "locatie1" ) { $("#zaal1").slideDown("fast"); //Slide Down Effect $("#zaal2").slideUp("fast"); $("#zaal3").slideUp("fast"); } else if ($(this).val() == "locatie2" ){ $("#zaal1").slideUp("fast") $("#zaal2").slideDown("fast"); //Slide Up Effect $("#zaal3").slideUp("fast"); } else if ($(this).val() == "locatie3" ){ $("#zaal1").slideUp("fast") $("#zaal2").slideUp("fast"); //Slide Up Effect $("#zaal3").slideDown("fast"); } }); }) </script> <?php } add_action('admin_head', 'add_js'); if (isset($_POST['submit']) == 'Update activiteit') { $activiteit = mysql_real_escape_string($_POST['activiteit']); $locatie = mysql_real_escape_string($_POST['locatie']); $aantalmensen = mysql_real_escape_string($_POST['aantalmensen']); $begintijd = mysql_real_escape_string($_POST['begintijden']); $eindtijd = mysql_real_escape_string($_POST['eindtijden']); $datum = mysql_real_escape_string($_POST['datumactiviteit']); $zaal1 = mysql_real_escape_string($_POST['zaal1']); $zaal2 = mysql_real_escape_string($_POST['zaal2']); $zaal3 = mysql_real_escape_string($_POST['zaal3']); if ($zaal1 != "Selecteer") { $zaal = $zaal1; } elseif ($zaal2 != "Selecteer") { $zaal = $zaal2; } elseif ($zaal3 != "Selecteer") { $zaal = $zaal3; } else { $zaal = ""; } $query = "UPDATE table1 SET activiteit_naam='$activiteit', activiteit_locatie='$locatie', activiteit_zaal='$zaal', activiteit_aantalbezoekers='$aantalmensen', activiteit_begintijd='$begintijd', activiteit_eindtijd='$eindtijd', activiteit_datum='$datum' WHERE id_activiteit='$idactiviteit'"; $result = mysql_query($query); } //print "<pre>"; //print print_r($_POST); //print "</pre>"; $query = "SELECT * FROM table1 WHERE id_activiteit='$idactiviteit' "; $result = mysql_query($query); $row = mysql_fetch_array($result); $locatie = $row['activiteit_locatie']; $naam = $row['activiteit_naam']; $aantalmensen = $row['activiteit_aantalbezoekers']; $begintijd = $row['activiteit_begintijd']; $eindtijd = $row['activiteit_eindtijd']; $datum = $row['activiteit_datum']; $zaal = $row['activiteit_zaal']; $begintijd = substr($row['activiteit_begintijd'], 0, 5); $eindtijd = substr($row['activiteit_eindtijd'], 0, 5); ?> <div class="wrap"> <?php screen_icon(); ?> <h2><?php echo esc_html($title); ?></h2> <form method="post" action="activiteitupdaten.php"> <?php settings_fields('activiteitupdaten'); ?> <table class="form-table"> <tr valign="top"> <th scope="row"><label for="activiteit"><?php _e('Naam activiteit') ?><span class="description"><?php _e('(required)'); ?></span></label></th> <td><input name="activiteit" type="text" id="activiteit" value="<?php echo $naam; ?>" class="regular-text" /></td> </tr> <tr valign="top"> <th scope="row"><label for="locatie"><?php _e('Locatie') ?><span class="description"><?php _e('(required)'); ?></span></label></th> <td><select name="locatie" id="locatie"><option>Selecteer</option><option <?php if ($locatie == 'locatie1') echo 'selected'; ?> >Locatie1</option><option <?php if ($locatie == 'locatie2') echo 'selected'; ?>>Locatie2</option><option <?php if ($locatie == 'locatie3') echo 'selected'; ?>>Locatie3</option></select> <span class="description"><?php _e('Selecteer de locatie.') ?></span></td> </tr> <tr valign="top"> <th scope="row"><label for="zaal"><?php _e('Zaal') ?><span class="description"><?php _e('(required)'); ?></span></label></th> <td> <div id="zaal1"><select name="zaal1" ><option value="Selecteer"<?php if ($zaal == "Selecteer") echo "selected"; ?>>Selecteer</option><option value="groot"<?php if ($zaal == "groot") echo "selected"; ?>>Groot</option></select></div> <div id="zaal2"><select name="zaal2" ><option value="Selecteer" <?php if ($zaal == "Selecteer") echo "selected"; ?>>Selecteer</option><option value="naamzaal" <?php if ($zaal == "naamzaal") echo "selected"; ?>>Naam zaal</option></select></div> <div id="zaal3"><select name="zaal3" ><option value="Selecteer" <?php if ($zaal == "Selecteer") echo "selected"; ?>>Selecteer</option><option value="kleinezaal" <?php if ($zaal == "kleinezaal") echo "selected"; ?>>Kleinezaal</option></select></div> </td> </tr> <tr valign="top"> <th scope="row"><label for="aantalmensen"><?php _e('Aantal bezoekers') ?></label></th> <td><input name="aantalmensen" type="text" id="aantalmensen" value="<?php echo $aantalmensen; ?>" class="regular-text" /></td> </tr> <tr valign="top"> <th scope="row"><label for="tijden"><?php _e('Tijd activiteit') ?><span class="description"><?php _e('(required)'); ?></span></label></th> <td>Van <select name="begintijden" id="begintijden"> <?php echo "<option value='$begintijd'>$begintijd</option>"; for ($x = 730; $x < 1815; $x = ($x + 15)) { if ($x < 1000) { $val = '0' . $x; }else $val = $x; $thistime = substr($val, 0, 2) . ":" . substr($val, 2, 2); echo "<option value='" . $thistime . "'>" . $thistime . "</option>"; if (substr($val, 2, 2) == '45') { $x = ($x + 40); }//end if }//end for ?> </select> t/m <select name="eindtijden" id="eindtijden"> <?php echo "<option value='$eindtijd'>$eindtijd</option>"; for ($x = 730; $x < 1815; $x = ($x + 15)) { if ($x < 1000) { $val = '0' . $x; }else $val = $x; $thistime = substr($val, 0, 2) . ":" . substr($val, 2, 2); echo "<option value='" . $thistime . "'>" . $thistime . "</option>"; if (substr($val, 2, 2) == '45') { $x = ($x + 40); }//end if }//end for ?> </select> </tr> <tr valign="top"> <th scope="row"><label for="dag"><?php _e('Dag') ?><span class="description"><?php _e('(required)'); ?></span></label></th> <td> <input id="datepicker" name="datumactiviteit" type="text" value="<?php echo $datum; ?>"> </td> </tr> </table> <input type="hidden" name="idactiviteit" value="<?php echo $idactiviteit; ?>" /> <p class="submit"><input type="submit" name="submit" id="submit" class="button-primary" value="update activiteit" /></p> </form> </div>
Laatst aangepast door klaaspeter : 2 mei 2012 om 14:51 Reden: kleine aanpassing
Aan de syntax zie ik dat het WordPress is...
Alleen laat hij de JS niet zin in de bron of functioneert de JS gewoon niet zoals het hoort?
Hier iedergeval een stukje geoptimaliseerde code (niet getest)
PHP Code:
Klopt is ook wordpress maar dat maakt niet uit.
Bedankt voor de code ga er vanavond mee aan de gang en super dat je zoveel opmerkingen erbij hebt geplaatst dan kan ik het beter begrijpen!
De selectie optie deden het wel. Alleen bij invoer. dus als ik begon met een nieuwe selectie. Op het moment dat ik een activiteit uit de database deed aanroepen kreeg ik niet de select optie te zien van de zalen omdat hij locatie als niet geselecteerd zag dus daarom mijn vraag hoe krijg ik php in jquery.
Dus als deze code werkt ben ik je zeer dankbaar heb hier namelijk al lang aan lopen te vervelen maar kwam er gewoon niet uit.
Alvast bedankt!
Ik heb het getest. Het probleem is op het moment van het laden van de pagina.
Mijn eerste optie wordt locatie word getoond (dit gebeurd op basis van mijn database) alleen de zaal wordt komt niet tevoorschijn jammer genoeg
Op het moment dat ik een andere locatie selecteer werkt die wel...
Dus het probleem zit hem ergens bij het laden maar ik snap gewoon niks van javascript... Hoop dat je me nog verder opweg kan helpen
In dat geval zou ik dit proberen... (onderin staat de code)
Hele kleine aanpassing maar zal moeten werken
Om JS te leren zou je de codeacedemy kunnen volgen... dit is heel uitgebreid en gaat echt de diepte in.
Want in JS is het heel belangrijk dat je goed weet wanneer er iets in de DOM gezet word en niet ivm cpu preformance
http://www.codecademy.com/
Code:<script type="text/javascript"> $(document).ready(function() { var zalen = $('#zalen'); //slaat de ID zalen op in de DOM var locatie = $('#locatie'); //slaat de locatie op in de DOM var curr_locatie = '<?php echo $locatie; ?>'; //slaat de huidige locatie op in de DOM //zoeken in #zalen naar alle div met de klasse zaal zalen.find('div.zaal').each(function() { //if ( $(this).attr('id') != curr_locatie ) //{ $(this).hide(); //} }); //de on() functie is sneller change(), click() etc. //roepen namelijk allemaal de on() functie aan locatie.on('change', function() { var value = $(this).val(); //zoekenin #zalen naar alle divs met de klasse zaal //deze naar boven sliden stop() zorgt dat alle animaties die bezig zijn in het element stoppen zalen.find('div.zaal').stop().slideUp(200); //switch de waarde //de delay(200) is ervoor om te zorgen dat de animatie van de slideUp niet raar doet switch (value) { default: case 'locatie1': zalen.find('div#zaal1').delay(200).slideDown(200); break; case 'locatie2': zalen.find('div#zaal2').delay(200).slideDown(200); break; case 'locatie3': zalen.find('div#zaal3').delay(200).slideDown(200); break; } }); //de change() functie aanroepen. omdat er geen functie aan zit //word de change() die wel een functie heeft aangeroepen omdat deze in de DOM zit. //als dit niet werkt uncomment het deel in de each() functie locatie.change(); }); </script>
Hey bedankt voor die website!!!!
Dat is super en op een leuke manier iets leren super bedankt! Doe vanavond naar de code kijken
Code werkt super bedankt!
Berichtenregels
Quote
