Comment transformer ma liste déroulante

msi79
Messages postés
500
Date d'inscription
lundi 24 août 2009
Statut
Membre
Dernière intervention
13 avril 2021
- 7 oct. 2018 à 18:12
msi79
Messages postés
500
Date d'inscription
lundi 24 août 2009
Statut
Membre
Dernière intervention
13 avril 2021
- 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']);
    }
  }
  
   ?>
A voir également:

2 réponses

jordane45
Messages postés
35415
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 mai 2022
356
7 oct. 2018 à 21:09
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.....


0
msi79
Messages postés
500
Date d'inscription
lundi 24 août 2009
Statut
Membre
Dernière intervention
13 avril 2021
1
7 oct. 2018 à 21:23
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
0
jordane45
Messages postés
35415
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 mai 2022
356
7 oct. 2018 à 23:17
Et le reste des réponses à mes questions ?????
0
msi79
Messages postés
500
Date d'inscription
lundi 24 août 2009
Statut
Membre
Dernière intervention
13 avril 2021
1
8 oct. 2018 à 00:03
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>
0
jordane45
Messages postés
35415
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 mai 2022
356
8 oct. 2018 à 09:59

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 ?
0
msi79
Messages postés
500
Date d'inscription
lundi 24 août 2009
Statut
Membre
Dernière intervention
13 avril 2021
1
8 oct. 2018 à 11:34
Bonjour quand je mets la classe selectpicker la liste déroulante deviens selectpicker mais rien ne s'affiche dans la liste derourante
0
jordane45
Messages postés
35415
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 mai 2022
356
8 oct. 2018 à 12:00
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") ?
0
msi79
Messages postés
500
Date d'inscription
lundi 24 août 2009
Statut
Membre
Dernière intervention
13 avril 2021
1
9 oct. 2018 à 08:23
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>
0