IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

affichage de popin


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Femme Profil pro
    Inscrit en
    Mai 2012
    Messages
    360
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Localisation : France

    Informations forums :
    Inscription : Mai 2012
    Messages : 360
    Par défaut affichage de popin
    Bonjour,

    Je développe une application des gestion des horaires et j'utilise le javacript pour renseigner les champs.
    Ainsi, une personne peut être :
    • présente toute la journée (matin et après midi)
    • être absente (toute la journée),
    • ou être là le matin ou l'après midi et être ensuite absente dans la même journée




    Lorsque je clique une première fois sur présent toute la journée (PR), je ne rencontre pas de pb d'affichage
    [IMG][/IMG]

    Lorsque je clique sur absente (NPR), j'ai bien mon menu déroulant avec ma liste d'absence qui s'affiche.
    [IMG][/IMG]

    Le soucis vient du fait lorsque je re-clique sur PR (la personne travaille toute la journée) : Ca ne fonctionne pas.
    [IMG][/IMG]


    Ce que je souhaiterais, c'est que lorsque je re-clique sur (PR), la même chose apparaissent que lorsque je clique dessus pour la première fois.

    Voici donc les champs présent dans mon formulaire :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
     
    <div class="display" id="divCreate">
     
    <div class="displayOpct">
     
    <table id="tabCreate" align="center" width="600px" cellspacing="0" cellpadding="0" border="0" class="cadb">
    	<tbody>
    		<tr>
    			<td>
    				<table width="100%">
    					<tr>
    						<td width="20" height="20"><img vspace="5" hspace="5" src="./resources/img/cbb.gif">
    						</td>
    						<td  style="font-size:12px;color: #4891C0;font-weight: bold" id="titre"> 
    							Modification horaire
    						</td>
    						<td style="font-size:10px;color: #4891C0;font-weight: bold" align="right">
    								<A href="#" onclick="closePreview();">Fermer</A>&nbsp;
    						</td>
    					</tr>
    				</table>
    			</td>
    		</tr>
     
    		<!-- Message d'information -->
     
    		<tr>
    			<td>
    				<table>
    					<tr>
    						<td>&nbsp;</td>
    						<td>
    							<table id="infoMsg">
    								<tbody>
    									<tr>
    										<td></td>
    									</tr>
    								</tbody>
    							</table>
    						</td>
    						<td>&nbsp;</td>
    					</tr>
    				</table>
    			</td>
    		</tr>
     
    		<tr>
    			<td align="center">
    			<s:form name="popinPreview">
    				<s:hidden name="idPersonnePreview" name="idPersonnePreview" value="" />
    				<s:hidden name="indexPreview" name="indexPreview" value="" />
    				<table cellpadding=5 style="width:600;align:center;" class="cadre">
    					<tr>
    						<td> Horaire enregistré en base de données</td>
    					</tr>	
    					<tr>
    						<td>
    							<div id="day"></div>
    							<div id="people"></div>
    						</td>
    					</tr>
    					<tr>
    						<td>
    							<div id="hours"></div>
    							<div id="absencess"></div>
    							<div id="halfAbsence"> </div>
    						</td>
     
     
    					</tr>					
    					<tr>
    						<td><hr></td>
    					</tr>
    					<tr>
    						 <td  style="text-align: center;">
    						  	<input type="radio" id="demiab0" name="work" value="0" onchange="afficheDiv('0_<s:property value="%{personneDto.idPersonne}"/>', 'demiab0_<s:property value="%{personneDto.idPersonne}"/>', 'pres0_<s:property value="%{personneDto.idPersonne}"/>')"> 1/2 PR 
    							<input type="radio" id="ab0" name="work" value="0" onchange="afficheDiv('0_<s:property value="%{personneDto.idPersonne}"/>', 'ab0_<s:property value="%{personneDto.idPersonne}"/>', 'pres0_<s:property value="%{personneDto.idPersonne}"/>')">NPR 
    							<input type="radio" id="pres0" name="work" value="1" onchange="afficheDiv('0_<s:property value="%{personneDto.idPersonne}"/>', 'ab0_<s:property value="%{personneDto.idPersonne}"/>', 'pres0_<s:property value="%{personneDto.idPersonne}"/>')" checked="checked"> PR<br>
    								<div id="horaire0" style="display: block;">
    						    	<table border="1" align="center">
    						    		<tr>
    						    			<td>						    				
    						    				De <s:textfield name="horairedm" id="horairedm" size="5" maxLength="5" value=""/> 
    						    				 A<s:textfield name="horairefm" id="horairefm" size="5" maxLength="5" value=""/>
    						    			</td>
    						    		</tr>
    						    		<tr>
    						    			<td>
    						    				De <s:textfield name="horaireda" id="horaireda" size="5" maxLength="5" value=""/>
    						    				A<s:textfield name="horairefa" id="horairefa" size="5" maxLength="5" value=""/>
    						    			</td>
    						    		</tr>
    						    	</table>
    						    	</div>
    						    	<div id="abs0" style="display: none;">
    						    	<table border="1" align="center">
    						    		<tr>
    						    		<!--  td>
    										<s:select headerKey="-1" headerValue="Abs ?" id="absenceSelected1_%{personneDto.idPersonne}" name="absenceSelected1_%{personneDto.idPersonne}" list="listAbsenceDto" listKey="idAbsence" listValue="abrAbsence"></s:select>
    					    			</td -->
     
    							    		<td>
    							    		   <s:select headerKey="-1" headerValue="Abs ?" id="absenceSelected" name="absenceSelected" list="listAbsenceDto" listKey="idAbsence" listValue="abrAbsence"></s:select>
    						    			</td>
    						    		</tr>
    						    	</table>
    						    	</div>
    						    	<div id="demiabs0" style="display: none;">
    						    	<table border="1" align="center">
    						    		<tr>
    							    		<!--  td>
    							    			<s:select headerKey="-1" headerValue="Abs ?" id="demiabsenceSelected1_%{personneDto.idPersonne}" name="demiabsenceSelected1_%{personneDto.idPersonne}" list="listAbsenceDto" listKey="idAbsence" listValue="abrAbsence"></s:select>
    						    			</td -->
    						    			<tr>
    						    				<td>
    							    				<div id="horaire0DemiAbsMatin"></div>
    						    				</td>
    						    			</tr>
    							    		<td>
    							    			<s:select headerKey="-1" headerValue="Abs ?" id="demiAbsenceSelected" name="demiAbsenceSelected" list="listAbsenceDto" listKey="idAbsence" listValue="abrAbsence"></s:select>
    						    			</td>
    						    		</tr>
    						    		<tr>
    							    		<td>
    							    			<div id="horaire0DemiAbsApres"></div>
    						    			</td>
    						    		</tr>
    						    	</table>
    						    	</div>
    						    </td>
     
    					</tr>
     
     
    					<tr>
    						<td align="center">	
    							<input type="button" value="Valider" onclick="returnPreview();">					
    						<br/><br/>
    						</td>
    					</tr>				
    				</table>
    				</s:form>
    				<br/><br/>
     
     
    			</td>
    		</tr>
     
    	</tbody>
    </table>
    </div>
     
    </div>

    Le javascript qui gère l'affichage des info dans la popin
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
     
    function afficheDiv(position, nomAbs, nomPres)
    {
     
    	//RECUPERATION DES INDEX ET ID PERSONNE
    	var chaine = position;
    	var tableau=chaine.split("_");
    	var index = tableau[0];
     
    	var stringNomAbs = nomAbs;
    	var tabNomAbs = stringNomAbs.split("_");
    	var nomAbs = tabNomAbs[0];
     
     
    	//DECLARATION DES DIV
    	var nameDivHoraire = 'horaire'+index;
    	var nameDivAbsence = 'abs'+index;
    	var nameDivDemiAbsence = 'demiabs'+index;
     
    	//var idPersonne = tableau[1];
    	var idPersonne = document.forms["popinPreview"].elements["idPersonnePreview"].value;
     
    	//Déclaration des Div Modification 
    	var nameDivHoraireModif = "divHoraireModif"+index+'_'+idPersonne;
    	var nameDivAbsenceModif = "divAbsenceModif"+index+'_'+idPersonne;
    	var nameDivDemiAbsenceModif = "divDemiAbsenceModif"+index+'_'+idPersonne;
     
    	//DECLARATION DES NOMS DE VARIABLES (champs texte)
     
    	var debutAM = 'horaire'+index+'dm_'+idPersonne;
    	var finAM = 'horaire'+index+'fm_'+idPersonne;
    	var debutPM = 'horaire'+index+'da_'+idPersonne;
    	var finPM = 'horaire'+index+'fa_'+idPersonne;
     
    	if(document.getElementById(debutAM)==null){
    		//alert("debutAM est nulle");
    		document.getElementById(nameDivHoraire).innerHTML= 'horaire'+index+'dm_'+idPersonne;
    		//alert("Création variable "+document.getElementById(debutAM));
     
    	}
    	//DECLARATION DES NOMS DE VARIABLES (select)
     
    	//var absenceSelectedId = "absenceSelected"+index+"_"+idPersonne;
    	//var demiAbsSelectedId = "demiabsenceSelected"+index+"_"+idPersonne;
    	var absenceSelectedId = "absenceSelected";
    	var demiAbsSelectedId = "demiAbsenceSelected";
    	var idAbs = document.getElementById(absenceSelectedId).options[document.getElementById(absenceSelectedId).selectedIndex].id;
    	var idDemiAbs = document.getElementById(demiAbsSelectedId).options[document.getElementById(demiAbsSelectedId).selectedIndex].id;
     
     
    	var text = nomAbs.substring(0, 4);
     
    	if (text == 'demi'){
     
    		openPopinMatinOuApres(idPersonne, index);
    		document.getElementById(nameDivAbsence).style.display = 'none';
    		var nameDivAbsence = 'demiabs'+index;
    		//alert("new nameDivAbsence : "+nameDivAbsence);
    		document.getElementById(absenceSelectedId).options[0].selected = true;
    	}else{
    		document.getElementById(nameDivDemiAbsence).style.display = 'none';
     
    		//ICI METTRE LES VARIABLES A VIDE
    		document.getElementById(demiAbsSelectedId).options[0].selected = true;
    		}
     
     
    	var nomAbs = document.getElementById(nomAbs);
     
    	if (nomAbs.checked) {
    		document.getElementById(nameDivAbsence).style.display = 'block';
    		//alert("ici");
    		document.getElementById(nameDivHoraire).style.display = 'none';
     
    		if(document.getElementById(debutAM)!=null){
    			document.getElementById(debutAM).value="00:00";
    			document.getElementById(finAM).value="00:00";
    			document.getElementById(debutPM).value="00:00";
    			document.getElementById(finPM).value="00:00";
     
     
    		}
     
    	}
     
    	var stringNomPresent = nomPres;
    	var tabNomPres = stringNomPresent.split("_");
    	var nomPres = tabNomPres[0];
    	var nomPres = document.getElementById(nomPres);	
     
    	if (nomPres.checked) {
    		document.getElementById(nameDivAbsence).style.display = 'none';
    		document.getElementById(nameDivHoraire).style.display = 'block';
    		document.getElementById(nameDivDemiAbsence).style.display = 'none';
    	}
    }
    Je vous remercie d'avance pour votre aide.

  2. #2
    Membre éclairé
    Femme Profil pro
    Inscrit en
    Mai 2012
    Messages
    360
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Localisation : France

    Informations forums :
    Inscription : Mai 2012
    Messages : 360
    Par défaut
    Finalement mon pb venait d'un innerHtml mal placé.

    Il m'a fallut juste commenter ce bout de code çà à marché ^^

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
     
    /*if(document.getElementById(debutAM)==null){
     
    		document.getElementById(nameDivHoraire).innerHTML= 'horaire'+index+'dm_'+idPersonne;
     
     
    	}*/

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Pb affichage avec un PaintBox (pour eviter scintillement)
    Par juan64 dans le forum C++Builder
    Réponses: 7
    Dernier message: 08/04/2004, 09h21
  2. [VB6] [Flexgrid] Format d'affichage des numériques
    Par yansolo dans le forum VB 6 et antérieur
    Réponses: 5
    Dernier message: 19/10/2002, 21h00
  3. Affichage de documents PDF
    Par Dajon dans le forum C++Builder
    Réponses: 5
    Dernier message: 10/10/2002, 11h36
  4. probléme d'affichage d'une fiche
    Par sb dans le forum Composants VCL
    Réponses: 7
    Dernier message: 29/08/2002, 09h43
  5. Affichage en passant par un buffer...
    Par Sirotilc dans le forum MFC
    Réponses: 5
    Dernier message: 27/05/2002, 21h00

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo