2010-07-28 2 views
3

Je souhaite qu'un formulaire soit rechargé et présélectionné avec la sélection effectuée. Voici le formulaire HTML je:Recharger la page avec le paramètre déclenché par l'événement de changement de liste déroulante JavaScript

<form name='vehicleform'> 

<select name='vehiclelist'> 
    <option value=''>Select</option> 
    <option value='bus'>Bus</option> 
    <option value='bike'>Bike</option> 
    <option value='car'>Car</option> 
</select> 

<input type='text' name='current'></input> 

</form> 

Lorsque l'utilisateur ouvre la page pour la première fois sera vide liste déroulante sera par défaut et la zone de texte (en cours) sur l'option Sélectionnez. Lorsque l'utilisateur sélectionne une option dans la liste déroulante, la page doit être rechargée et cet élément déroulant doit être sélectionné et la valeur de cette liste déroulante doit figurer dans le champ de saisie de texte.

Quelle est la fonction JavaScript dont j'ai besoin pour y arriver?

Répondre

5

Comme ceci:

<select name='soemname' id="myid" onchange="document.location.href = 'page.php?var=' + this.value"> 
    <option value=''>Select</option> 
    <option value='bus'>Bus</option> 
    <option value='bike'>Bike</option> 
    <option value='car'>Car</option> 
</select> 

<script type="text/javascript"> 
    document.getElementById('myid').value = "<?php echo $_GET['var'];?>"; 
</script> 
3

sAc's answer vous indique comment vous pouvez utiliser l'événement onchange pour modifier le location.href propriété. Cela fonctionnera, mais il n'est pas accessible aux utilisateurs avec JS désactivé. Je voudrais définir une URL dans l'attribut action du formulaire et avoir l'élément select soumettre le formulaire dans l'événement onchange. De cette façon, les utilisateurs avec JavaScript peuvent encore appuyer sur la touche de retour pour recharger la page avec le même effet:

<?php $sel = isset($_GET['vehiclelist']) ? $_GET['vehiclelist'] : ""; ?> 
<form name='vehicleform' action="thispage.php"> 

<select name='vehiclelist' onchange="this.parentNode.submit();"> 
    <option value='' >Select</option> 
    <option value='bus' <?php echo $sel == "bus" ? "selected" : "";?>>Bus</option> 
    <option value='bike' <?php echo $sel == "bike" ? "selected" : "";?>>Bike</option> 
    <option value='car' <?php echo $sel == "car" ? "selected" : "";?>>Car</option> 
</select> 

<input type='text' name='current' value="<?php echo htmlspecialchars($_GET['var']); ?>"></input> 

</form> 

Le résultat final est une fonctionnalité qui est accessible aux utilisateurs avec JavaScript désactivé aussi.

+2

@Andy E: Je savais mais j'étais trop paresseux pour écrire le code php :( – Sarfraz

+0

@sAc: ha, je peux rapporter à cela :) –

+0

En fait, je dois soumettre ce formulaire séparément pour stocker la valeur textbox (actuelle) dans la base de données en utilisant un bouton de soumission (manqué en question). Par conséquent, je dois appeler un autre script sur submit de ce formulaire pour stocker la valeur textbox dans la base de données. Je pense que js est seulement une option dans ce cas? – NAVEED

Questions connexes