1. Accueil
  2. Forum Codes-Sources
  3. Javascript / DHTML
Sujet Précédent Sujet Suivant

Récupérer les données cochées du checkbox dans un <span>

ksomda
Messages postés
36
Date d'inscription
lundi 17 février 2014
Statut
Membre
Dernière intervention
2 septembre 2016
 - 22 mars 2014 à 20:45
ksomda
Messages postés
36
Date d'inscription
lundi 17 février 2014
Statut
Membre
Dernière intervention
2 septembre 2016
 - 24 mars 2014 à 14:41
Bonsoir tout le monde, j'utilise le plugin Jquery Multiple select qui est à cette adresse: http://wenzhixin.net.cn/p/multiple-select/. Mon problème est de récupérer les donner cocher de la même manière que dans le lien http://wenzhixin.net.cn/p/multiple-select/ . Quand je coche les checkbox de mon choix rien ne vient. S'il vous plait quelqu'un peut t'il m'aider? 

     <html>
<head>
    <link href="multiple-select.css" rel="stylesheet"/>
    <script src="jquery.multiple.select.js"></script>
    <script type="text/javascript">
       function sortie() {
  var tmp = "";
  //-- Get les checkBox
  var tabCheck = document.getElementsByName("box[]");
  //-- on recup les donnees input
  tmp += Form["ch1"].value +" ";

  //-- donnee checkBox
  for (i 0, nb=taCheck.length; i < nb; i++) {
    if (tabCheck[i].checked) {
      tmp += tabCheck[i].value +"";
    }
  }
  //-- donnee select
  szTmp += oForm["license[]"].value;
  //-- on ecrit d'un block
  document.write(tmp);
  //-- close le document
  document.close();
  return false; // ne sert à rien mais bon
}
     $("select").multipleSelect({
            placeholder: "Here is the placeholder"
        });
    </script>
</head>
<body>
	<p id="e6">
		<select class="w300" multiple="multiple" name="license[]" style="display: none;">
        	<option value="1">Hongrie</option>
        	<option value="2">Espagne</option>
        	<option value="3">France</option>
        	<option value="4">Suisse</option>
        	<option value="5">Iraq</option>
        	<option value="6">Mali</option>
        	<option value="7">Afrique du Sud</option>
        	<option value="8">Mexique</option>
        	<option value="9">Burkina Faso</option>
        	<option value="10">Malaysie</option>
        	<option value="11">Madagascar</option>
        	<option value="12">Chine</option>
    	</select>
    		<div class="ms-parent">
    			<button type="button" class="ms-choice" style="width: 298px;">
    				<span class="placeholder">Here is the placeholder</span>
    				<div class="open"></div>
    			</button>
    			<div class="ms-drop bottom" style="width: 298px; display: block;">
    				<ul style="max-height: 250px;">
    					<li><label><input type="checkbox" name="selectAll"> [Select all]</label></li>
    					<li><label><input type="checkbox" name="selectItem1" value="1"> Hongrie</label></li>
    					<li><label><input type="checkbox" name="selectItem2" value="2"> Espagne</label></li>
    					<li><label><input type="checkbox" name="selectItem3" value="3"> France</label></li>
    					<li><label><input type="checkbox" name="selectItem4" value="4"> Suisse</label></li>
    					<li><label><input type="checkbox" name="selectItem5" value="5"> Iraq</label></li>
    					<li><label><input type="checkbox" name="selectItem6" value="6"> Mali</label></li>
    					<li><label><input type="checkbox" name="selectItem7" value="7"> Afrique du Sud</label></li>
    					<li><label><input type="checkbox" name="selectItem8" value="8"> Mexique</label></li>
    					<li><label><input type="checkbox" name="selectItem9" value="9"> Burkina Faso</label></li>
    					<li><label><input type="checkbox" name="selectItem10" value="10"> Malaysie</label></li>
    					<li><label><input type="checkbox" name="selectItem11" value="11"> Madagascar</label></li>
    					<li><label><input type="checkbox" name="selectItem12" value="12"> Chine</label></li>
    				</ul>
    			</div>
   			</div>
		</p>
		<br/>
	</body>
</html>

Merci d'avance pour votre aide.

1 réponse

Réponse 1 / 1
jordane45
Messages postés
36054
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
14 août 2022
 358
23 mars 2014 à 01:28
Bonsoir,
sans regarder plus loin.. je te répondrais que dans l'exemple que tu veux reproduire (voir le lien que tu nous donnes).. les checkbox ont toutes le même nom 
<li>

    <label>
        <input type="checkbox" name="selectAll"></input>

         [Select all]

    </label>

</li>
<li>

    <label>
        <input type="checkbox" value="1" name="selectItem"></input>

         January

    </label>

</li>
<li>

    <label>
        <input type="checkbox" value="2" name="selectItem"></input>

         February

    </label>

</li>
<li>

    <label>
        <input type="checkbox" value="3" name="selectItem"></input>

         March

    </label>

</li>

0
ksomda
Messages postés
36
Date d'inscription
lundi 17 février 2014
Statut
Membre
Dernière intervention
2 septembre 2016
24 mars 2014 à 10:29
Bonjour Jordane45, merci pour la remarque mais j'avais déjà essayé cette méthode mais ca ne marche.Est ce que ce serait pas le script que j'ai écri qui n'est pas bon?Si la réponse est Oui.pourriez vous aider dans ce sens?
0
jordane45
Messages postés
36054
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
14 août 2022
 358
24 mars 2014 à 13:30
Ben dans ton script... il y a déjà ça qui me choque : 
 var tabCheck = document.getElementsByName("box[]");

BOX[] ?? mais rien ne porte ce nom dans ta page... non ??
0
ksomda
Messages postés
36
Date d'inscription
lundi 17 février 2014
Statut
Membre
Dernière intervention
2 septembre 2016
24 mars 2014 à 14:41
oh oui c'est comme ca je pensais avoir écrit: 
  
function sortie() {
  var tmp = "";
  //-- Get les checkBox
  var tabCheck = document.getElementsByName("license[]");
  //-- on recup les donnees input
  tmp += Form["checkbox"].value +" ";

  //-- donnee checkBox
  for (i 0, nb=taCheck.length; i < nb; i++) {
    if (tabCheck[i].checked) {
      tmp += tabCheck[i].value +"";
    }
  }
  //-- donnee select
  tmp+= oForm["license[]"].value;
  //-- on ecrit d'un block
  document.write(tmp);
  //-- close le document
  document.close();
  return false; // ne sert à rien mais bon
}
même comme ça ne marche pas sur aucun navigateur.
0