1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76
|
<html>
<head>
<meta charset="utf-8"/>
<title>test jquery</title>
</head>
<body>
<div>
<label for="choixNouveauClient">Nouveau client ? <span
class="requis">*</span></label>
<input type="radio" id="choixNouveauClient"
name="choixNouveauClient" value="nouveauClient" checked /> Oui
<input type="radio" id="choixNouveauClient"
name="choixNouveauClient" value="ancienClient" /> Non
<br/><br />
<div id="nouveauClient">
<form method="get" action="#">
<fieldset>
<legend>Informations client</legend>
<label for="nomClient">Nom <span class="requis">*</span></label>
<input type="text" id="nomClient" name="nomClient" value="" size="20" maxlength="20" />
<br />
<label for="prenomClient">Prénom </label>
<input type="text" id="prenomClient" name="prenomClient" value="" size="20" maxlength="20" />
<br />
<label for="adresseClient">Adresse de livraison <span class="requis">*</span></label>
<input type="text" id="adresseClient" name="adresseClient" value="" size="20" maxlength="20" />
<br />
<label for="telephoneClient">Numéro de téléphone <span class="requis">*</span></label>
<input type="text" id="telephoneClient" name="telephoneClient" value="" size="20" maxlength="20" />
<br />
<label for="emailClient">Adresse email</label>
<input type="email" id="emailClient" name="emailClient" value="" size="20" maxlength="60" />
<br />
</fieldset>
<input type="submit" value="Valider" />
<input type="reset" value="Remettre à zéro" /> <br>
</form>
</div>
<div id="ancienClient">
<select name="listeClients" id="listeClients">
<option value="">Choisissez un client...</option>
<option value="choix1">Roger</option>
<option value="choix2">Robert</option>
<option value="choix3">Marcel</option>
</select>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script>
jQuery(document).ready(
function(){
$("div#ancienClient").hide();
jQuery('input[name=choixNouveauClient]:radio').click(
function(){
$("div#nouveauClient").hide();
$("div#ancienClient").hide();
var divId = jQuery(this).val();
$("div#"+divId).show();
}
);
}
);
</script>
</body>
</html> |
Partager