Comment faire pour afficher des cases à cocher dans le code HTML de liste déroulante?
J'ai besoin pour remplir une liste déroulante (HTML <select></select>) avec des cases à cocher. J'ai essayé d'afficher une liste à l'aide d'un <div></div> de la balise et de l'application de certains styles dans la page JSP, mais il affiche une liste comme une zone de liste. Ci-dessous est le code de la page JSP avec Javascript que juste les alertes de la liste des langues qui ont été vérifiés au moment le seul bouton sur la page est cliqué.
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Check box list</title>
</head>
<script type="text/javascript" language="javascript">
function selectCheckBox()
{
var total="";
for(var i=0; i < document.form.languages.length; i++)
{
if(document.form.languages[i].checked)
{
total +=document.form.languages[i].value + "\n";
}
}
if(total=="")
{
alert("select checkboxes");
}
else
{
alert("Selected Values are : \n"+total);
}
}
</script>
<body>
<form id="form" name="form" method="post" action="CheckBox.jsp">
<div style="overflow: auto; width: 100px; height: 80px; border: 1px solid #336699; padding-left: 5px">
<input type="checkbox" name="languages" value="English"> English<br>
<input type="checkbox" name="languages" value="Hindi"> Hindi<br>
<input type="checkbox" name="languages" value="Italian"> Italian<br>
<input type="checkbox" name="languages" value="Chinese"> Chinese<br>
<input type="checkbox" name="languages" value="Japanese"> Japanese<br>
<input type="checkbox" name="languages" value="German"> German<br>
</div>
<br/><input type="button" name="goto" onClick="selectCheckBox()"value="Check">
</form>
</body>Il affiche simplement une liste des langues comme indiqué dans l'instantané.
Ce dont j'ai besoin est de montrer cette liste de langues que d'une liste déroulante (et non comme une zone de liste). Comment puis-je faire cela?
- Comme, code.google.com/p/dropdown-check-list ?
- Vous devriez vraiment écrire cela comme réponse. Bhavesh, Ce que Joe est en train de dire, avec son commentaire, c'est que le bon vieux HTML ne peut pas le faire...vous devez employer un peu de JavaScript magie...et quelques bonnes gens l'ont déjà fait la plupart du travail et il a partagé avec le monde entier dans le lien Joe fourni.
Vous devez vous connecter pour publier un commentaire.
Voici un lien vers une bonne bibliothèque, http://code.google.com/p/dropdown-check-list/
Avec quelques beaux cas de test, http://dropdown-check-list.googlecode.com/svn/trunk/doc/ddcl-tests.html.
En outre, en voici quelques exemples, http://dropdown-check-list.googlecode.com/svn/trunk/doc/dropdownchecklist.html.
jquery/1.10.2etjqueryui/1.10.3. jsbin.com/OrEqUfI/2/edit?html,sortieJ'espère que je ne suis pas vraiment la fin 🙂
Check this out: http://www.marghoobsuleman.com/jquery-image-dropdown