Rafraichir liste déroulante par calendrier

Signaler
Messages postés
103
Date d'inscription
jeudi 2 mars 2006
Statut
Membre
Dernière intervention
4 février 2009
-
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
-
Bonjour,

Alors j'ai créer un calendrier et plusieurs listes déroulantes, ce que je voudrais c'est lorsque je choisi un jour de mon calendrier, les listes déroulantes soient rafraichis pour que seules les données correspondant au jour choisis s'affichent (les listes déroulantes sont remplis pas requêtes php), mais je ne sais pas comment faire. Quelqu'un peut m'aider?

Merci d'avance.

19 réponses

Messages postés
1423
Date d'inscription
mardi 14 décembre 2004
Statut
Membre
Dernière intervention
29 décembre 2012
4
Hum...

innerHtml, createElement : https://developer.mozilla.org/fr/DOM/document.createElement
t'aidera surement...

Il vaut mieux poser une question et passer pour bête que le rester toute sa vie

Les geeks n'ont pas une case en moins ils commencent juste à compter à partir de zéro
Messages postés
103
Date d'inscription
jeudi 2 mars 2006
Statut
Membre
Dernière intervention
4 février 2009

merci, mais je ne vois pas en quoi ça peut m'aider?, je ne cherche pas à créer un nouvel élément mais juste à rafraichir des listes déroulantes lorsque je clique sur un jour de mon calendrier
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
>>que lorsque je choisi un jour de mon calendrier,
>>les listes déroulantes soient rafraichis pour que seules
>>les données correspondant au jour choisis s'affichent
>>(les listes déroulantes sont remplis pas requêtes php)
tu n'as donc pas le choix.
il faut rappeler un script php qui te
retourneras les données ou la page à afficher.
donc soit avec un formulaire, soit en passant par
l'url, voire peut-être avec ajax.
@+
Messages postés
103
Date d'inscription
jeudi 2 mars 2006
Statut
Membre
Dernière intervention
4 février 2009

et comment je fais ça???????
Messages postés
1423
Date d'inscription
mardi 14 décembre 2004
Statut
Membre
Dernière intervention
29 décembre 2012
4
J'avais compris sans requête Ajax ...

Genre je choisis février et ça me propose du 1 au 28 ou 29 selon l'année donc pas besoin de traitement côté serveur.

Pour Ajax :
La base => http://www.prototypejs.org/
Quelques libs supplémentaires => scriptaculous, jquery, extjs, ...

Il vaut mieux poser une question et passer pour bête que le rester toute sa vie

Les geeks n'ont pas une case en moins ils commencent juste à compter à partir de zéro
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
comment tu fais quoi ?
tu ne sais pas envoyer un formulaire ?
tu ne sais pas changer l'url pour appeler une page ?
tu ne connais pas ajax ? ( c'est le plus "difficile" !!!  :  10 lignes  en javascript,
    des exemples, des tutos partout et y compris sur CodesSourdes bien sûr ).
          [mon Site] [M'écrire] Bul         
Messages postés
103
Date d'inscription
jeudi 2 mars 2006
Statut
Membre
Dernière intervention
4 février 2009

dsl, nouvelle en javascript et dans d'autres langages, je ne programme pas souvent!!! et non je ne connait pas ajax mais c'est pas grave parce que je ne dois utiliser que php ou javascript. Ma page s'affiche dans un frame sur un autre page. Le calendrier est générer en javascript, donc je dois appeller une fonction qui me permette de rafraichir toute la page, c'est bien ça?
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
si c'est dans un frame, rafraîchit ce frame en passant
les données dans l'url qui seront traités par ton php.
 page.php/?prm=valeur et dans page.php $_GET['prm'] sera = valeur
 et pour valeur si tu mets la date cliquée....
          [mon Site] [M'écrire] Bul         
Messages postés
1423
Date d'inscription
mardi 14 décembre 2004
Statut
Membre
Dernière intervention
29 décembre 2012
4
ça va vite !!!
On passe du tout au tout

Il vaut mieux poser une question et passer pour bête que le rester toute sa vie

 Les geeks n'ont pas une case en moins ils commencent juste à compter à partir de zéro
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
>>On passe du tout au tout
ça va encore ici Teclis...
au moins lisbeth "domine" et nous dit tout
( au fûr et à mesure, mais bon, on avance )
parfois, sur le même genre d'échange,
on aurait uniquement : "sa march po"
on va donc aller au bout et résoudre avec
les intervenants et lisbeth.
@+
Messages postés
1423
Date d'inscription
mardi 14 décembre 2004
Statut
Membre
Dernière intervention
29 décembre 2012
4
Le demandeur/demandeuse : lisbeth
Les intervenants : toi et moi

Ca restreint

Au cas ou lisbeth ... pose nous la source
Non pas qu'on soit code fluent mais ça peut aider à comprendre la mécanique (la frame ici etait difficilement devinable )

Il vaut mieux poser une question et passer pour bête que le rester toute sa vie

Les geeks n'ont pas une case en moins ils commencent juste à compter à partir de zéro
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
>>Les intervenants : toi et moi
pour l'instant !
mais tu as assez de compétences pour résoudre seul..
alors peu importe. c'est la qualité qui compte pas la quantité ;o)))
le seul risque c'est que lisbeth nous abandonne...
ce serait dommage ( enfin... pour elle ;o)
          [mon Site] [M'écrire]  Bul         
Messages postés
103
Date d'inscription
jeudi 2 mars 2006
Statut
Membre
Dernière intervention
4 février 2009

Voila mon script, je sais ça fait beaucoup d'un seul coup!!!! Et merci pour votre aide c'est super sympa

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<link rel="stylesheet" type="text/css" media="all" href="/inc/jscalendar-1.0/calendar-blue.css" title="blue" />
<script type="text/javascript" src="/inc/jscalendar-1.0/calendar.js"></script>
<script type="text/javascript" src="/inc/jscalendar-1.0/lang/calendar-fr.js"></script>
<script type="text/javascript" src="/inc/jscalendar-1.0/calendar-setup.js"></script>
<link href="/SRC-APRI/css/calendrier.css" type="text/css" rel="StyleSheet" />
<SCRIPT language="javascript">
function Submit() {
    InitDate();
    ParamCalen.submit();
}
</SCRIPT>

<SCRIPT language="javascript">
function ChangeVue1() {
    InitDate();
    document.ParamCalen['Vue'].value = "1";
    ParamCalen.submit();
}

function ChangeVue2() {
    InitDate();
    document.ParamCalen['Vue'].value = "2";
    ParamCalen.submit();
}

function ChangeVue3() {
    InitDate();
    document.ParamCalen['Vue'].value = "3";
    ParamCalen.submit();
}

function ChangeVue4() {
    InitDate();
    document.ParamCalen['Vue'].value = "4";
    ParamCalen.submit();
}
</SCRIPT>

<SCRIPT language="javascript">
function InitDate(){
    if (!document.ParamCalen['SelAnnee'].value){
    document.ParamCalen['SelAnnee'].value = "<? echo date(Y); ?>";
    }
    if (!document.ParamCalen['SelMois'].value){
        document.ParamCalen['SelMois'].value = "<? echo date(m); ?>";
    }

    if (!document.ParamCalen['SelJour'].value){
        document.ParamCalen['SelJour'].value = "<? echo date(d); ?>";
    }

    if (!document.ParamCalen['Semaine'].value){
        document.ParamCalen['Semaine'].value = "<? echo date(W); ?>";
    }
}
</SCRIPT>
</head>

<?php
  //Connexion et paramétrage Base de données
include getenv("DOCUMENT_ROOT")."SRC-APRI/Init_Base.php";
?>

<form name="ParamCalen" method="get" onChange="Submit()" target="mainFrame" action="/SRC-APRI/Planning/Planning.php">

<style>
.divSidebox
{    max-width: 203px; }
</style>

Menu Calendrier

    
<!-- Génère le menu selection plage de date sous forme d'image à cliquer -->
    ----
<table style="width: 100%">----

    , </td>
    ,
    ,
    ,
    
</td></tr>
<!-- Fin du menu image à cliquer -->

<!-- Génère le menu selection plage date sous forme de texte -->
    <tr class="divSideboxEntry">
    <td class="textSidebox" align="center" valign="middle" width="20"></td>
    <td class="textSidebox">
        <select style="width: 185px; visibility: visible;" name="Vue" onchange="Submit()" title="Sélectionnez un Vue affichée">
        <option value="1">Vue journalière</option>
        <option value="2">Vue hebdomadaire sans weekend</option>
        <option value="3">Vue mensuelle</option>
        <option value="4">Vue trimestrielle</option>
        </select>
    </td>
    </tr>

<!-- Fin du menu plage date sous forme de texte -->

<!-- Génère le menu Selection du groupe horaire -->
    <tr class="divSideboxEntry">
    <td class="textSidebox" align="center" valign="middle" width="20"></td>
    <td class="textSidebox">
        <select style="width: 185px; visibility: visible;" name="GpHoraire" onchange="Submit()" title="Sélectionnez un Groupe Horaire">
        <option selected value="">Tout les groupes horaire</option>

<?
$sql = "SELECT * FROM $MySQL_database.$MySQL_table_HORAIRE".date('Y');
$Result_Horaire = mysql_query($sql);

while($List_Horaire = mysql_fetch_array($Result_Horaire)){
        echo "<option value=".$List_Horaire[$MySQL_Horaire_idHoraire].">".$List_Horaire[$MySQL_Horaire_Horaire]."</option>" ;
        }
?>
</select>
</td>
</tr>

<!-- Fin du menu Sélection du groupe Horaire -->
<!-- Génère le menu Sélection de l'équipe de superviseur -->
<tr class="divSideboxEntry">
<td class="textSidebox" align="center" valign="middle" width="20"></td>
<td class="textSidebox">
<select style="width: 185px; visibility: visible;" name="GpEquipe" onchange="Submit()" title="Sélectionnez une Equipe">
<option selected value="">Toute les équipes</option>
<?
$sql = "SELECT * FROM $MySQL_database.$MySQL_table_EQUIPE".date('Y');
$Result_Equipe = mysql_query($sql);

while($List_Equipe = mysql_fetch_array($Result_Equipe)){
echo "<option value=".$List_Equipe[$MySQL_Equipe_ID_EQUIPE].">".$List_Equipe[$MySQL_Equipe_EQUIPE]."</option>" ;
}
?>
</select>
</td>
</tr>
<!-- Fin du menu Sélection de l'équipe Superviseur -->

<!-- Génère le calendrier pour sélectionner son jour/mois/année -->
<tr class="divSideboxEntry" align="center" valign="center">
<td colspan="2" class="textSidebox" align="center" valign="center">

<script type="text/javascript">
    function dateChanged(calendar) {
        // Beware that this function is called even if the end-user only
        // changed the month/year.  In order to determine if a date was
        // clicked you can use the dateClicked property of the calendar:

        if (calendar.dateClicked)
            {
            // OK, a date was clicked, redirect to /yyyy/mm/dd/index.php
            var y = calendar.date.getFullYear();
            var m = calendar.date.getMonth()+1;     // integer, 1..12

            if (m<10){m = "0" + m}
            var d = calendar.date.getDate();      // integer, 1..31
            if (d<10){d = "0" + d}
            var W = calendar.date.getWeekNumber();
            if (W<10){W = "0" + W}
            // redirect...
            //parent.mainFrame.location.href = "/SRC-APRI/Planning/Planning.php?SelAnnee=" + y + "&SelMois=" + m + "&SelJour=" + d + "&Semaine=" + W;
            document.ParamCalen['SelAnnee'].value = y;
            document.ParamCalen['SelMois'].value = m;
            document.ParamCalen['SelJour'].value = d;
            document.ParamCalen['Semaine'].value = W;
            ParamCalen.submit();
            }
        };

        Calendar.setup(
            {
            flat         : "calendar-container", // ID of the parent element
            flatCallback : dateChanged         // our callback function
            }
        );
    </script>
    </td>
    </tr>
    <!-- mise en mémoire des valeurs du calendrier afin de pouvoir les récupérer dans l'URL lors de la soumission du formulaire -->
    
    
    
    
<!-- Fin du calendrier -->

<!-- Génère le menu Sélection d'un agent en particulier -->
    <tr class="divSideboxEntry">
    <td class="textSidebox" align="center" valign="middle" width="20"></td>
    <td class="textSidebox">
    <select style="width: 185px; visibility: visible;" name="Agent" onchange="Submit()" title="Sélectionnez un Téléconseiller">
    <option selected value="">Tout les téléconseillers</option>
    <?    $sql "SELECT * FROM $MySQL_database.$MySQL_table_Agent,  $MySQL_database.$MySQL_table_FONCTION WHERE $MySQL_database.$MySQL_table_Agent.$MySQL_Agent_ACTIF '1' AND $MySQL_database.$MySQL_table_FONCTION.$MySQL_FONCTION_FONCTION = "Téléconseiller" AND $MySQL_database.$MySQL_table_Agent.$MySQL_Agent_STATUT = $MySQL_database.$MySQL_table_FONCTION.$MySQL_FONCTION_ID_FONCTION";
    $Result_Agent = mysql_query($sql);
    while($List_Agent = mysql_fetch_array($Result_Agent)){
    echo "<option value=".$List_Agent[$MySQL_Agent_ID_IDENTIF].">".$List_Agent[$MySQL_Agent_NOM]." ".$List_Agent[$MySQL_Agent_PRENOM]."</option>" ;
    }
?>
    </select>
    </td>
    </tr>
<!-- Fin du menu sélection d'un agent en particulier -->

<!-- balise de début du body pour la mise en page -->
</table>    

</form>

</html>

<!-- feuille d'appel pour mon frame--->

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

<SCRIPT language="javascript">
    parent.mainFrame.location.href = "/SRC-APRI/Planning/Planning.php";
</SCRIPT>
&nbsp;

&nbsp;

<?php
include getenv("DOCUMENT_ROOT")."/SRC-APRI/Planning/calendrier.php";
?>
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
ah.... mauvaise réponse lisbeth !
là, tu nous colles tout et : "débrouillez-vous" !
ça ne marche pas comme ça.
relis mes suggestions
ou limite ce que tu nous postes à ce qui ne fonctionne pas...
     en nous disant où ça plante, le message d'erreur s'il y a lieu...
ton problème pour l'instant, il me semble,
     c'est rafraîchir une frame coté client.. non ?
     c'est 5 lignes html/javascript, pas plus
          [mon Site] [M'écrire]  Bul          
Messages postés
103
Date d'inscription
jeudi 2 mars 2006
Statut
Membre
Dernière intervention
4 février 2009

Pardon, ce n'est pas comme ça que je le voyais, j'ai mis tout mon code pour vous permettre de bien comprendre ce que je souhaite faire, c'est tout
Messages postés
103
Date d'inscription
jeudi 2 mars 2006
Statut
Membre
Dernière intervention
4 février 2009

c'est lors de l'évènement dateChanged() que je dois rafraichir mes listes déroulantes

<!-- Génère le calendrier pour sélectionner son jour/mois/année -->
<tr class="divSideboxEntry" align="center" valign="center">
<td colspan="2" class="textSidebox" align="center" valign="center">

<script type="text/javascript">
    function dateChanged(calendar) {
        // Beware that this function is called even if the end-user only
        // changed the month/year.  In order to determine if a date was
        // clicked you can use the dateClicked property of the calendar:

        if (calendar.dateClicked)
            {
            // OK, a date was clicked, redirect to /yyyy/mm/dd/index.php
            var y = calendar.date.getFullYear();
            var m = calendar.date.getMonth()+1;     // integer, 1..12

            if (m<10){m = "0" + m}
            var d = calendar.date.getDate();      // integer, 1..31
            if (d<10){d = "0" + d}
            var W = calendar.date.getWeekNumber();
            if (W<10){W = "0" + W}
            // redirect...
            //parent.mainFrame.location.href = "/SRC-APRI/Planning/Planning.php?SelAnnee=" + y + "&SelMois=" + m + "&SelJour=" + d + "&Semaine=" + W;
            document.ParamCalen['SelAnnee'].value = y;
            document.ParamCalen['SelMois'].value = m;
            document.ParamCalen['SelJour'].value = d;
            document.ParamCalen['Semaine'].value = W;
            ParamCalen.submit();
            }
        };

        Calendar.setup(
            {
            flat         : "calendar-container", // ID of the parent element
            flatCallback : dateChanged         // our callback function
            }
        );
    </script>
    </td>
    </tr>
    <!-- mise en mémoire des valeurs du calendrier afin de pouvoir les récupérer dans l'URL lors de la soumission du formulaire -->
   
   
   
   
<!-- Fin du calendrier -->

en faite j'ai essayer de mettre location.reload() mais soit ça bug, soit ça ne fait rien du tout, après je ne sais pas ce que je peut faire. si lorsque je clique sur un jour je dois rafraichir la page dans le frame, je fais ça comment?
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
11
>>j'ai essayer de mettre location.reload() mais soit ça bug, soit ça ne fait rien du tout,
location.reload recharge la page en cours , pas la frame
sans passer de paramètres... donc comment tu vas faire coté php pour savoir ?
mais ça ne doit planter...  aucune raisons.

>>je dois rafraichir la page dans le frame, je fais ça comment?
comment ferais-tu pour mettre une page dans un frame qui n'en contiendrait pas ?
en fait, rafraîchir ça veut dire mettre une "nouvelle" pagela_frame_dont_on_cause.location.href" la_page_dont_on_cause. php/?prm_par_exemple"+valeur_que_tu_veux;
ou pas loin...
          [mon Site] [M'écrire] Bul         
Messages postés
103
Date d'inscription
jeudi 2 mars 2006
Statut
Membre
Dernière intervention
4 février 2009

ok, donc un problème se pose à moi, lors du rafraichissement, je dois concerver le calendrier avec la date cliquée
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
34
ah ben ça....
la page qui sera affichée va être créée par le php appelé
ce php possède toutes les billes
@+