Comment transformer ma liste déroulante

Messages postés
458
Date d'inscription
lundi 24 août 2009
Dernière intervention
8 décembre 2018
- - Dernière réponse : msi79
Messages postés
458
Date d'inscription
lundi 24 août 2009
Dernière intervention
8 décembre 2018
- 9 oct. 2018 à 08:23
Bonjour,
j'ai une liste déroutante qui fonctionne bien mais j'aimerai qu'elle soit un selectpicker.
la première fonctionne très bien ma la seconde non.

voici mon code :
<div class="row">
  <div class="col-md-6 mb-3">
  	<label for="validationCustom03">Sous-Famille :</label>
      <select id="validationCustom03" class="selectpicker show-tick form-control form-control-lg" data-live-search="true" onchange="ChangecatList()" name="category" title="Choisir une sous-famille">
        <option value=""></option>
                <?php 
					if(!empty($arrDesigns)){
					  foreach($arrDesigns as $D){
						echo '<option value="'.$D.'">'.$D.'</option>';
						
					 }
					}
				   ?>
    </select>
    
	<div class="invalid-feedback"></div>
  </div>
  <div class="col-md-6 mb-3">
  	<label for="validationCustom04">Produit :</label>
        <select id="validationCustom04" name="produit" onchange="getDepartements_detail(this.value);" class=" form-control form-control-lg" data-live-search="true" title="Choisir un produit">
    </select>
    <div class="invalid-feedback"></div>
  </div>
</div>


dans la seconde c'est à dire celle la :
<select id="validationCustom04" name="produit" onchange="getDepartements_detail(this.value);" class=" form-control form-control-lg " data-live-search="true" title="Choisir un produit">
    </select>


quand il a pas : selectpicker dans
<class=" form-control form-control-lg "
ça fonctionne mais quand je mets :
<class="selectpicker  form-control form-control-lg "
ça fonctionne pas.

voici le code source du selectpicker :
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/css/bootstrap-select.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/js/bootstrap-select.js"></script>

<select data-live-search="true" data-live-search-style="startsWith" class="selectpicker">
        <option value="4444">4444</option>
        <option value="Fedex">Fedex</option>
        <option value="Elite">Elite</option>
        <option value="Interp">Interp</option>
        <option value="Test">Test</option>
    </select>


la partie PHP
<?php 
/**
* Petit rappel
* comment écrire correctement son code en php :
* http://www.commentcamarche.net/faq/48399-php-gestion-des-erreurs-debogage-et-ecriture-du-code
*/


//-------------------------------------------//
//affichage des erreurs php
//-------------------------------------------//
/*
error_reporting(E_ALL);
ini_set('display_errors', TRUE);
ini_set('display_startup_errors', TRUE);
*/

//-------------------------------------------//
//connexion à la bdd
//-------------------------------------------//
//require_once 'connect_pdo.php';


//-------------------------------------------//
//VERIF L'EXISTENCE DU TELEPHONE
//-------------------------------------------//
$sql = "SELECT * 
      FROM tb_sous_famille SF
      LEFT JOIN cree_produit P ON P.id_sousfamille = SF.id
      ORDER BY SF.design ";


  try{
     $req_1 = $pdo->prepare($sql);
     $req_1->execute();
     $resulsMDP = $req_1->fetchAll();
    }catch(PDOException  $e){
     echo "ERREUR DE REQUETE : " . $sql . '  error : '.$e->getMessage();
    }
  
  $nbr = !empty($resulsMDP) ? count($resulsMDP) : 0;
  
/*  $arrDesigns = array();
  if(!empty($resulsMDP)){
    foreach($resulsMDP as $R){
      $arrDesigns[] = $R['design']; //echo $arrDesigns[1];
    }
  }
 */ 
  $arrDesigns = array();
  if(!empty($resulsMDP)){
    foreach($resulsMDP as $R){
      $arrDesigns[$R['design']] = $R['design'];
    }
  }
  
 $arrPacks = array();
  if(!empty($resulsMDP)){
    foreach($resulsMDP as $R){
      $arrPacks[$R['design']][] = array($R['id'],$R['produit']);
    }
  }
  
   ?>
Afficher la suite 

Votre réponse

2 réponses

Messages postés
23569
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
10 décembre 2018
0
Merci
Quand tu dis ça ne fonctionne pas c'est-à-dire ??
As-tu vérifié dans la console de ton navigateur si il y avait des erreurs ou non ?

Comment est alimenté cette liste je pense que c'est en Javascript tu ne nous a pas mis le code.....


msi79
Messages postés
458
Date d'inscription
lundi 24 août 2009
Dernière intervention
8 décembre 2018
-
Bonsoir,
quand j'ecris <class=" form-control form-control-lg "> sans la classe selectpicker le menu deroulant affiche les elements sans que ce soit un selectpicker
jordane45
Messages postés
23569
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
10 décembre 2018
-
Et le reste des réponses à mes questions ?????
msi79
Messages postés
458
Date d'inscription
lundi 24 août 2009
Dernière intervention
8 décembre 2018
-
voici le contenu de a console qui indique des erreurs :
GET http://localhost/chicsape_codebar_NEW.com/css/fonts/glyphicons-halflings-regular.woff net::ERR_ABORTED 404 (Not Found)
index.php?page=STOCK:297 GET http://localhost/chicsape_codebar_NEW.com/css/interface_0.css net::ERR_ABORTED 404 (Not Found)
index.php?page=STOCK:461 GET http://localhost/4/uploads/article.jpg 404 (Not Found)
index.php?page=STOCK:203 GET http://localhost/chicsape_codebar_NEW.com/css/fonts/glyphicons-halflings-regular.ttf net::ERR_ABORTED 404 (Not Found)
3index.php?page=STOCK:297 GET http://localhost/chicsape_codebar_NEW.com/css/interface_0.css net::ERR_ABORTED 404 (Not Found)
index.php?page=STOCK:351 GET http://localhost/chicsape_codebar_NEW.com/css/fonts/glyphicons-halflings-regular.woff2 net::ERR_ABORTED 404 (Not Found)
index.php?page=STOCK:357 GET http://localhost/chicsape_codebar_NEW.com/css/fonts/glyphicons-halflings-regular.woff net::ERR_ABORTED 404 (Not Found)
index.php?page=STOCK:617 Uncaught SyntaxError: Unexpected end of input
2index.php?page=STOCK:558 GET http://localhost/4/uploads/article.jpg 404 (Not Found)


et le code js:
<script type="text/javascript">
var catAndActs =  <?php echo json_encode($arrPacks) ?>;

//pour voir dans la console ce que ça donne :
console.log("catAndActs :");
console.log(catAndActs);


function ChangecatList() {  
  var catList = document.getElementById("validationCustom03");
  var actList = document.getElementById("validationCustom04");
  var selCat = catList.options[catList.selectedIndex].value;

  actList.innerHTML = "";
  var cats = catAndActs[selCat];
  console.log('selCat : ' + selCat);
  console.log('cats : ' + cats);
  if (cats) {
	  var cat = new Option('','');
       actList.options.add(cat);
    for (var i = 0; i < cats.length; i++) {
      var cat = new Option(cats[i][1], cats[i][0]);
      actList.options.add(cat);
    }
  }
} 
</script>
jordane45
Messages postés
23569
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
10 décembre 2018
-

quand j'ecris <class=" form-control form-control-lg "> sans la classe selectpicker le menu deroulant affiche les elements sans que ce soit un selectpicker

Et quand tu mets la class selectpicker ... quel est le comportement observé ? En quoi cela ne fonctionne t'il pas ?
Commenter la réponse de jordane45
Messages postés
458
Date d'inscription
lundi 24 août 2009
Dernière intervention
8 décembre 2018
0
Merci
Bonjour quand je mets la classe selectpicker la liste déroulante deviens selectpicker mais rien ne s'affiche dans la liste derourante
jordane45
Messages postés
23569
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
10 décembre 2018
-
Donc...
Quand tu mets "selectpicker" :
1 - Quelles erreurs apparaissent dans la CONSOLE ( un imprime écran serait mieux que du copier coller )
2 - Quel est le code source généré (celui que tu peux récupérer dans ton navigateur directement via un clic droit sur le selectpicker / "examiner l'élément") ?
msi79
Messages postés
458
Date d'inscription
lundi 24 août 2009
Dernière intervention
8 décembre 2018
-
Bonjour,
1 - Quelles erreurs apparaissent dans la CONSOLE ( un imprime écran serait mieux que du copier coller )





2 - Quel est le code source généré (celui que tu peux récupérer dans ton navigateur directement via un clic droit sur le selectpicker / "examiner l'élément") ?

je sais pas si c'est de cela il s'agit:




<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <!-- This file has been downloaded from Bootsnipp.com. Enjoy! -->
    <title>FACTURA</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
  <!--  
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/style.css">
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
  -->  
    <link href="css/template/maxcdn.bootstrapcdn.com.bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
    <script src="js/template/code.jquery.jquery-1.11.1.min.js"></script>
    <script src="js/template/maxcdn.bootstrapcdn.bootstrap.min.js"></script>
    
    
        <script>
function popupCenter(url, title, w, h, t) {
var left = (screen.width/2)-(w/2);
var top = (screen.height/2)-(h/2);
return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+t+', left='+left);
} 
</script>
<script>
function confirmDelete(delUrl) {
if (confirm("Voulez vous vraiment supprimer cette famille ?")) {
document.location = delUrl;
}
}
</script>

</head>
<body>
           <nav class="navbar navbar-inverse navbar-fixed-top" id="jntopnav">
  
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#"><img src="images/LOGO_GLOBAL_AEITok3Petit.jpg" width="20" height="20"></a>
      <a class="navbar-brand" href="#">FACTURA</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li><a href="#" style="color: yellow">MAG : DEPOT</a></li>
        <li><a href="index.php?page=ACCUEIL">Accueil</a></li>
        
        <li><a href="#" class="active">SI</a></li>
        <li><a href="#">Eligibilite</a></li>
        <li><a href="index.php?page=sms">SMS</a></li>
        <li><a href="index.php?page=CODEBAR">Code Barre</a></li>
        <li><a href="#">Contacts</a></li>
        <li>
          <IFRAME id=membres title=membres frameBorder=0 width=1 height=1    scrolling=yes name=membres src="code/update_seuil.php" marginWidth=0 marginHeight=0>
           </IFRAME>
        </li>
        <li>
               <a data-toggle="tooltip" data-placement="right" title="Stock Bas" onclick="popupCenter('index.php?page=alertes', 'myPop1',960,600,5);" href="javascript:void(0);" ><span class="glyphicon glyphicon-warning-sign" style="color: white"></span><span class="badge" style="color: red; background-color: white">1</span></a>

        </li>
      </ul>

      <ul class="nav navbar-nav navbar-right">
        <li><a href="chicsape_codebar.com/index.php?page=ACCUEIL" style="color: #F60;">Ancienne Interface</a></li>
        <li><a href="index.php?page=licence">Licence</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> <img src="avatar/sool.png" alt=""  width="25" height="25">msi79 <span class="caret"></span></a>
          <ul class="dropdown-menu">

           
            <li><a href="#">Another action</a></li>
            <li><a href="index.php?page=update">Modifier mon Compte</a></li>
            <li><a href="index.php?page=change_magasin_2">Changer de magasin</a></li>

            <li role="separator" class="divider"></li>
            <li><a href="index.php?page=modiff_pass">Change mot de passe</a></li>

                       <li><a href="index.php?page=fermer" style="color: #F60">Fermeture de caisse</a></li>
                      <li><a href="index.php?page=logout"  style="color: red"><i class="fa fa-sign-out pull-right"></i> Se Deconnecter</a></li>
                    </ul>
        </li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>    <nav class="navbar navbar-default navbar-fixed-top" id="jntopsubnav">
  <div class="container-fluid">
    <ul class="nav navbar-nav">
   
       <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Recherche <span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li><a href="index.php?page=compteClient">Recherche Compte client</a></li>
          <li><a href="index.php?page=search_0">Recherche Une créance</a></li>
          
        </ul>
      </li>

      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Saisie <span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li><a href="index.php?page=NOUVEAU&clef=acdeT4U9">Caisse</a></li>
  
        </ul>
      </li>
  


    
   

      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Fichier <span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li><a href="index.php?page=NOUVEAU&clef=acdeT4U9">Caisse</a></li>
          <li><a href="index.php?page=ajout_compt_fourn">Créer Compte fournisseur</a></li>
          <li><a href="index.php?page=ajout_compt_livreur">Créer Compte Livreur</a></li>
          <li><a href="index.php?page=enreg_ptit_caisse">Alimenter Petite Caisse</a></li>
          <li><a href="index.php?page=ajout_versement">Saisie Lieu Versement</a></li>
          <li><a href="index.php?page=ble">Saisie Versement</a></li>
          <li><a href="index.php?page=LesSortie">Saisie Sortie d'argent</a></li>
           <li><a href="index.php?page=ptitecaisse"> Sortie petite Caisse</a></li>
           <li><a href="index.php?page=articles_mank"> Saisir articles manquants</a></li>
           <li><a href="index.php?page=list_facture_0"> Enregistrer un client</a></li>
        </ul>
      </li>
 
    
   
      <li>
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">États <span class="caret"></span></a>
        <ul class="dropdown-menu dropdown-menu-lg row">
        	<li class="col-sm-3">
            <ul>
              <li class="dropdown-header">Fourniseur</li>
              <li><a href="index.php?page=list_fourn">Consulter</a></li>
              
              <li class="dropdown-header">LIvreur/Serveur</li>
              <li><a href="index.php?page=list_livreur">Consulter</a></li>

              <li class="dropdown-header">EDITION</li>
              <li><a href="index.php?page=EDITION">Consulter les factures</a></li>
              <li><a href="index.php?page=list_facture&id_reser=reserv">Consulter les reservations</a></li>
              <li><a href="index.php?page=list_facture&id_prof=proforma">Consulter les pro-forma</a></li>
              <li><a href="index.php?page=list_facture&id_online=online">Consulter les pro-forma</a></li>
            </ul>
        </li>
            <li class="col-sm-3">
            <ul>
              <li class="dropdown-header">Client</li>
              <li><a href="index.php?page=list_clients">Liste des cleint</a></li>
              <li><a href="index.php?page=situation_cl">Situation des Clients</a></li>
              <li><a href="index.php?page=list_clients_priv">Liste clients Prestiges</a></li>
              <li><a href="index.php?page=anniv">Anniversaire</a></li>

            </ul>
        </li>
            <li class="col-sm-3">
            <ul>
              <li class="dropdown-header">Historique</li>
              <li><a href="index.php?page=historiques">Historique</a></li>
              <li><a href="index.php?page=fact_suppr">Historique Factures supprimées</a></li>
            </ul>
        </li>
            <li class="col-sm-3">
            <ul>
              <li class="dropdown-header">Point de caisse</li>
              <li><a href="index.php?page=point_caisse">Afficher Point de caisse</a></li>
              <li class="dropdown-header">Sortie d'argent</li>
              <li><a href="index.php?page=aff_sorties">Sortie d'argent</a></li>
            </ul>
        </li>
        </ul>
      </li>
		<li class="dropdown dropdown-lg">

        <a href="#" class="dropdown-toggle " data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Facturation <span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li class="dropdown-header">Bordereaux</li>
          <li><a onclick="popupCenter('print/printBorderau_0.php', 'myPop1',1500,600,5);" href="javascript:void(0);" >Gestion des Bordereaux</a></li>
          <li class="dropdown-header">Facturation</li>
          <li><a href="index.php?page=list_facture">Liste des factures</a></li>
          <li><a href="index.php?page=list_facture&id_reser=reserv">Liste Reservations</a></li>
          <li><a href="index.php?page=list_facture&id_prof=proforma">Liste Factures Pro-forma</a></li>
          <li class="dropdown-header">Compta</li>
          <li class="dropdown-header">Vente en Ligne</li>
          <li><a href="index.php?page=list_facture&id_online=online">Liste des produits en ligne</a></li>
        </ul>
      </li>
       
 <li>
   
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Cuisine <span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li class="dropdown-header">Creez menu Cuisine</li>
          <li><a href="index.php?page=menucuisine">Entrée menu</a></li>
          <li><a href="index.php?page=bonusNombre">Entrez nombre de points</a></li>
          <li class="dropdown-header">Commandes</li>
          <li><a href="index.php?page=CAISSE_CUISINE">Commandes</a></li>
          <li><a href="index.php?page=CUISINE">Ecran Cuisine</a></li>
        </ul>
      </li>
          
   
         
      <li>
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Stock <span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li class="dropdown-header">Entrée</li>
          <li><a href="index.php?page=STOCK">Entrée en stock</a></li>
          <li><a href="index.php?page=sttockCodeBar">Entrée en stock Code Bar</a></li>
          <li><a href="index.php?page=stock_status_peremption">Entrée Stock|Péremtion</a></li>
          <li class="dropdown-header">Articles</li>
          <li><a href="index.php?page=ajout_cat_article">Ajouter un article</a></li>
          <li><a href="index.php?page=edit_produit">Edition de produits</a></li>
          <li class="dropdown-header">Gestion des Seuil</li>
          <li><a href="index.php?page=harmonie_seuil">harmoniser</a></li>
          <li class="dropdown-header">Gestion Inventaire</li>
           <li><a href="print/printHistStockPlus.php">Historique de Stock</a></li>
          <li><a href="index.php?page=inventaire2">Inventaire</a></li>
          <li><a href="index.php?page=invent_detail">Infos Inventaires</a></li>
          <li><a href="print/printHistStock.php">Historiques Inventaires</a></li>

        </ul>
      </li>
      

 
      <li>
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Configuration <span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li class="dropdown-header">Choix d'interface</li>
          <li><a href="index.php?page=interfaces">Entrer</a></li>
          <li class="dropdown-header">Config</li>
          <li><a href="index.php?page=setting">Entrer</a></li>
          <li class="dropdown-header">Config couleur</li>
          <li><a href="index.php?page=setting_font">Entrer</a></li>
        </ul>
      </li>


      <li>
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Utilitaires <span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li><a href="index.php?page=cree_entreprise">Créer un Entreprise</a></li>
          <li><a href="index.php?page=ajout_depot">Créer un Dépot</a></li>
          <li><a href="index.php?page=upl&t=logo">Charger Logo</a></li>
          <li><a href="index.php?page=nom_dg_fact">Créer nom DG</a></li>
          <li><a href="index.php?page=pied_de_page">Créer Bas de page Facture</a></li>
          <li><a href="index.php?page=haut_de_page">Créer Haut de page Facture</a></li>
          <li><a href="index.php?page=mt_prestige">Créer Montant Prèstige</a></li>
          <li><a href="index.php?page=ajout_priv">Créer Privilège</a></li>
          <li><a href="index.php?page=ajout_depense">Créer Dépenses</a></li>
          <li><a href="index.php?page=polices">Créer Police de texte</a></li>
          <li><a href="index.php?page=ajout_couleur">Créer Couleur</a></li>
        </ul>
      </li>

         <li>
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Administration <span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li><a href="index.php?page=register">Créer un utilisateur</a></li>
          <li><a href="index.php?page=membre">Membres</a></li>
        </ul>
      </li>

    </ul>
    <form class="navbar-form navbar-right">
      <div class="form-group">
        <input type="text" class="form-control" placeholder="Search" id="searchtemp">
      </div>
      <button type="submit" class="btn btn-default" style="display: none">Submit</button>
    </form>
  </div>
</nav>  



<div class="container" style="padding-top: 101px"> 
    <div class="row">
        <div class="col-md-12">
                <script src="js/js_interface_0.js"></script>
  <link href="css/bootstrap.min.css" rel="stylesheet">
  <link href="css/interface_0.css" rel="stylesheet">
  <link href="css/bootstrap-select.min.css" rel="stylesheet">
    <script type="text/javascript" src="./js/dept_xhr_detail.js" charset="iso_8859-1"></script>
<form action="" method="post" id="chgdept"  >
<div class="row">
  <div class="col-md-6 mb-3">
  	<label for="validationCustom03">Sous-Famille :</label>
      <select id="validationCustom03" class="selectpicker show-tick form-control form-control-lg" data-live-search="true" onchange="ChangecatList()" name="category" title="Choisir une sous-famille">
        <option value=""></option>
                <option value="ROBES">ROBES</option>    </select>
    
	<div class="invalid-feedback"></div>
  </div>
  <div class="col-md-6 mb-3">
  	<label for="validationCustom04">Produit :</label>
        <select id="validationCustom04" name="produit" onchange="getDepartements_detail(this.value);" class="selectpicker form-control form-control-lg" data-live-search="true" title="Choisir un produit">
    </select>
    <div class="invalid-feedback"></div>
  </div>
</div>

     <div class="row">
        
              <div class="col-md-6">
                <label for="firstName"></label>
                <span id="blocDepartements_detail"></span>
                <div class="invalid-feedback"></div>
              </div>
         <div class="col-md-3"></div>
         <div class="col-md-3"></div>
      </div>
</form>      
      <br><br><br>
          <div class="row">
              <div class="col-md-12">
              


<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Document sans titre</title>
<link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet">

<!-- https://datatables.net/extensions/buttons/examples/styling/bootstrap.html-->
<link rel="stylesheet" href="css/print/maxcdn.bootstrapcdn.bootstrap3.3.7.bootstrap.min.css">
<link rel="stylesheet" href="css/print/cdn.datatables.net.1.10.13.dataTables.bootstrap.min.css">
<link rel="stylesheet" href="css/print/cdn.datatables.net.buttons.1.2.3.buttons.bootstrap.min.css">

<script src="js/print/code.jquery.com.jquery-1.12.4.js" ></script>
<script src="js/print/cdn.datatables.net.1.10.13jquery.dataTables.min.js" ></script>
<script  src="js/print/cdn.datatables.net.1.10.13.dataTables.bootstrap.min.js" ></script>
<script  src="js/print/cdn.datatables.net.buttons.1.2.3.dataTables.buttons.min.js" ></script>
<script  src="js/print/cdn.datatables.net.buttons.1.2.3.buttons.bootstrap.min.js" ></script>
<script  src="js/print/cdnjs.cloudflare.comajaxlibsjszip2.5.0jszip.min.js"></script>
<script  src="js/print/cdn.rawgit.combpampuchpdfmake0.1.18buildpdfmake.min.js" ></script>
<script  src="js/print/cdn.rawgit.combpampuchpdfmake0.1.18buildvfs_fonts.js" ></script>
<script  src="js/print/cdn.datatables.net.buttons.1.2.3.js.buttons.html5.min.js" ></script>
<script  src="js/print/cdn.datatables.net.buttons.1.2.3js.buttons.print.min.js" ></script>
<script  src="js/print/cdn.datatables.net.buttons.1.2.3.js.buttons.colVis.min.js" ></script>
  <script language="javascript">

		function ouvre_popup(page) {

		window.open(page,"nom_popup","menubar=no, status=no, scrollbars=yes,  width=2480, height=3508");

		}

	</SCRIPT>

</head>



<body >

<table id="example" class="table table-striped table-bordered" cellspacing="0" width="100%">



                      <thead>

                        <tr >

                          <th width="10%" style="text-align: center">DATE</th>
                          <th width="15%" style="text-align: center">SOUS-FAMILLE</th>

                          <th width="25%" style="text-align: center">ARTICLES</th>

                          <th width="10%" style="text-align: center">REF</th>

                           <th width="10%" style="text-align: center">P.A</th>

                          <th width="7%" style="text-align: center">QTE</th>

                          <th width="8%" style="text-align: center">P.V</th>

                          <th  width="15%" style="text-align: center"> MIN & MAX</th>



						
                         

                        <th  width="10%" style="text-align: center"></th>

                        
                        <th  width="5%" style="text-align: center"></th>

                        <th  width="5%" style="text-align: center"></th>

                      </tr>

                      </thead>

     

      

        <tbody>

           
                        <tr >

                          <td><a href="javascript:ouvre_popup('index.php?page=LISTE_STOCK&num=3')"  style="text-decoration:none; color:#000024">

                             04/10/2018
      

    </a></td>

    


<td>ROBES</td>

<td><a href="javascript:ouvre_popup('index.php?page=online&ref=000001&id_prod=1')"  style="text-decoration:none; color:#000024">

ROBE 12000</a></td>

    <td align="center">000001</td>

    <td align="center">7500</td>

     <td align="center">8</td>

     <td align="center">12000</td>

       <td align="center">10000-12000</td>

 

    

     
     <td align="center">

   

<a class="tooltips" href="javascript:ouvre_popup('index.php?page=upl&id=1&ref=000001&code=1')" style="z-index:10000"><img src="../4/uploads/article.jpg" width="15" height="15" />

<span><img src="4/uploads/article.jpg" width="15" height="15" /></span></a> 

 

  </td>

    

  
     <td>

     <a href="index.php?page=suppr_entre_stock&id=4"  style="text-decoration:none; color:red; width:30px">

      <span class="glyphicon glyphicon-remove" ></span>

     </a>

    </td>

     <td><a href="javascript:ouvre_popup('index.php?page=moddiff_entre_stock&id=4&num=3')"  style="text-decoration:none; color:red; width:30px"><span class="glyphicon glyphicon-pencil" ></span></a></td>

  

  </tr>


                        <tr >

                          <td><a href="javascript:ouvre_popup('index.php?page=LISTE_STOCK&num=2')"  style="text-decoration:none; color:#000024">

                             04/10/2018
      

    </a></td>

    


<td>ROBES</td>

<td><a href="javascript:ouvre_popup('index.php?page=online&ref=000002&id_prod=2')"  style="text-decoration:none; color:#000024">

ROBE 10000</a></td>

    <td align="center">000002</td>

    <td align="center">5000</td>

     <td align="center">15</td>

     <td align="center">100000</td>

       <td align="center">8500-100000</td>

 

    

     
     <td align="center">

   

<a class="tooltips" href="javascript:ouvre_popup('index.php?page=upl&id=2&ref=000002&code=1')" style="z-index:10000"><img src="../4/uploads/article.jpg" width="15" height="15" />

<span><img src="4/uploads/article.jpg" width="15" height="15" /></span></a> 

 

  </td>

    

  
     <td>

     <a href="index.php?page=suppr_entre_stock&id=3"  style="text-decoration:none; color:red; width:30px">

      <span class="glyphicon glyphicon-remove" ></span>

     </a>

    </td>

     <td><a href="javascript:ouvre_popup('index.php?page=moddiff_entre_stock&id=3&num=2')"  style="text-decoration:none; color:red; width:30px"><span class="glyphicon glyphicon-pencil" ></span></a></td>

  

  </tr>


        </tbody>

    </table>

    <script type="text/javascript">

    $(document).ready(function() {

 var table = $('#example').DataTable( {

     lengthChange: false,

     buttons: [ 'copy', 'excel', 'pdf', 'colvis' ]

 } );



 table.buttons().container()

     .appendTo( '#example_wrapper .col-sm-6:eq(0)' );

} );

    </script>

</body>

</html>

              </div>
          </div>



<script type="text/javascript">
var catAndActs =  {"ROBES":[["1","ROBE 12000"],["2","ROBE 10000"]]};

//pour voir dans la console ce que ça donne :
console.log("catAndActs :");
console.log(catAndActs);


function ChangecatList() {  
  var catList = document.getElementById("validationCustom03");
  var actList = document.getElementById("validationCustom04");
  var selCat = catList.options[catList.selectedIndex].value;

  actList.innerHTML = "";
  var cats = catAndActs[selCat];
  console.log('selCat : ' + selCat);
  console.log('cats : ' + cats);
  if (cats) {
	  var cat = new Option('','');
       actList.options.add(cat);
    for (var i = 0; i < cats.length; i++) {
      var cat = new Option(cats[i][1], cats[i][0]);
      actList.options.add(cat);
    }
  }
} 
</script>
<script type="text/javascript">
      window.onload=function(){
     // $('.selectpicker').selectpicker();


/*      // scrollYou
      $('.scrollMe .dropdown-menu').scrollyou();

      prettyPrint();
      };*/
    </script>
    <script src="js/bootstrap-select.min.js"></script>
    <script src="js/defaults-fr_FR.min.js"></script>
            
        </div>
    </div>
</div>

<script src="js/js.js" ></script>
Commenter la réponse de msi79

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.