Function javascript

Résolu

t671 Messages postés 1475 Date d'inscription Statut Membre Dernière intervention -
t671 Messages postés 1475 Date d'inscription Statut Membre Dernière intervention - 14 août 2012 à 09:08

Bonjour,

Dans un script html/php, je voudrais inclure du javascript.
En html, c'est cela :

<SELECT name="expression1">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="Vers">Vers</OPTION>
		<OPTION VALUE="Avant">Avant</OPTION>
		<OPTION VALUE="Après">Après</OPTION>
		<OPTION VALUE="Entre">Entre</OPTION>
		</SELECT>
		<SELECT name="jour1">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="01">01</OPTION>
		<OPTION VALUE="02">02</OPTION>
		<OPTION VALUE="03">03</OPTION>
		<OPTION VALUE="04">04</OPTION>
		<OPTION VALUE="05">05</OPTION>
		<OPTION VALUE="06">06</OPTION>
		<OPTION VALUE="07">07</OPTION>
		<OPTION VALUE="08">08</OPTION>
		<OPTION VALUE="09">09</OPTION>
		<OPTION VALUE="10">10</OPTION>
		<OPTION VALUE="11">11</OPTION>
		<OPTION VALUE="12">12</OPTION>
		<OPTION VALUE="13">13</OPTION>
		<OPTION VALUE="14">14</OPTION>
		<OPTION VALUE="15">15</OPTION>
		<OPTION VALUE="16">16</OPTION>
		<OPTION VALUE="17">17</OPTION>
		<OPTION VALUE="18">18</OPTION>
		<OPTION VALUE="19">19</OPTION>
		<OPTION VALUE="20">20</OPTION>
		<OPTION VALUE="21">21</OPTION>
		<OPTION VALUE="22">22</OPTION>
		<OPTION VALUE="23">23</OPTION>
		<OPTION VALUE="24">24</OPTION>
		<OPTION VALUE="25">25</OPTION>
		<OPTION VALUE="26">26</OPTION>
		<OPTION VALUE="27">27</OPTION>
		<OPTION VALUE="28">28</OPTION>
		<OPTION VALUE="29">29</OPTION>
		<OPTION VALUE="20">30</OPTION>
		<OPTION VALUE="21">31</OPTION>
		</SELECT>
		<SELECT name="mois1">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="JAN">JAN</OPTION>
		<OPTION VALUE="FEB">FEB</OPTION>
		<OPTION VALUE="MAR">MAR</OPTION>
		<OPTION VALUE="APR">APR</OPTION>
		<OPTION VALUE="MAI">MAI</OPTION>
		<OPTION VALUE="JUN">JUN</OPTION>
		<OPTION VALUE="JUL">JUL</OPTION>
		<OPTION VALUE="AUG">AUG</OPTION>
		<OPTION VALUE="SEP">SEP</OPTION>
		<OPTION VALUE="OCT">OCT</OPTION>
		<OPTION VALUE="NOV">NOV</OPTION>
		<OPTION VALUE="DEC">DEC</OPTION>
		</SELECT>
		<input name="an1" type="text" id="an1" size="2" maxlength="4"/>

Dans mon script, cela donne :

<script type="text/javascript"> 
function ajout_input(){ 
.............................
document.getElementById('div_input_autre').innerHTML='<SELECT name="expression1"><OPTION VALUE=""></OPTION><OPTION VALUE="Vers">..........

Je suis obligé de tout mettre sur une ligne sinon la fonction n'est pas prise en compte !!! Et la ligne est longue ..........
Je pourrais également créer un fichier js, tout y mettre, et faire un "include" dans mon script. Mais là, je ne sais plus comment faire ........... :o(

Merci pour votre aide.

Afficher la suite

11 réponses

Réponse 1 / 11
Utilisateur anonyme
Bonjour

Tu peux très bien faire :
```
document.getElementById('div_input_autre').innerHTML= '<SELECT name="expression1">' + 
  '<OPTION VALUE=""></OPTION>'+ 
  '<OPTION VALUE="Vers">'.. 
```
Et si tu tiens à mettre les noms de mois en anglais (malgré le Vers, Avant, Après.. en français) tu peux corriger MAY au lieu de MAI.
0
Réponse 2 / 11
t671 Messages postés 1475 Date d'inscription Statut Membre Dernière intervention 11

Merci pour l'astuce (+).
Dans le cas où je veux créer un fichier js avec le Select, comment je le déclare dans mon scipt php (<script>.....</script> et faut-il ou comment appeller la fonction dans le scrip) ?
0
Réponse 3 / 11
Utilisateur anonyme

Ici il n'est pas question de php, seulement de html et de javascript.
Pour créer un fichier js, il suffit que tu mettes la définition de ta fonction (depuis function ajout_input(){ jusqu'au } correspondant dans un fichier machin.js
Ensuite, quleque part entre <head> et </head>, tu insères :
<script src="machin.js" type="text/javascript"></script>

Enfin, à l'endroit où tu veux voir apparaître ton SELECT, tu appelles ta fonction :

<script type="text/javascript">ajout_input();</script>
0

t671 Messages postés 1475 Date d'inscription Statut Membre Dernière intervention 11

Ca fonctionne pas ........
Voici mon fichier js :

function ajout_input() {  
var choix_naissance=document.getElementById('date_naissance').value; 
 if(choix_naissance =='autre') { 
 document.getElementById('div_input_autre').innerHTML='<SELECT name="expression1">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="Vers">Vers</OPTION>
		<OPTION VALUE="Avant">Avant</OPTION>
		<OPTION VALUE="Après">Après</OPTION>
		<OPTION VALUE="Entre">Entre</OPTION>
		</SELECT>
		<SELECT name="jour1">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="01">01</OPTION>
		<OPTION VALUE="02">02</OPTION>
..................
		<OPTION VALUE="DEC">DEC</OPTION>
		</SELECT>
		<input name="an2" type="text" id="an2" size="2" maxlength="4"/><br><font size="1">Toutes les cases sont optionnelles</font><p>';
document.getElementById('date_naissance_autre').focus(); //et on lui donne le focus
 }else{ 
  document.getElementById('div_input_autre').innerHTML=''; //sinon on efface l'input eventuellement affiché 
 } 
}

et mon code php :

<script src="date.js" type="text/javascript"></script>
</head>
<body>
...........................
<?php
............................
echo '<script type="text/javascript">ajout_input();</script><p>';

Où est l'erreur ?

Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Réponse 5 / 11
Utilisateur anonyme

Le fichier date.js est-il bien dans le même répertoire que ton script php ?
Pourquoi le script php n'est-il pas écrit avec des ' et des + comme indiqué dans ma première réponse ?

as tu un élément avec l'id 'date_naissance' dont la valeur est 'autre' ? Il fallait peut-être mettre l'appel à la fonction dans l'événement 'onchange' de 'datenaissance', c'est à toi de savoir où il est logique que cet appel apparaisse.

Sinon, utilise la console javascript de ton navigateur, elle te dira bien où elle trouve une erreur.
0

t671 Messages postés 1475 Date d'inscription Statut Membre Dernière intervention 11

Mon fichier js est bien dans le même répertoire que mon script php.
J'ai tenté de mettre des + comme tu me l'as dit :

<script type="text/javascript">     
function ajout_input(){     
 var choix_naissance=document.getElementById('date_naissance').value;     
 if(choix_naissance =='autre'){       
 document.getElementById('div_input_autre').innerHTML='<SELECT name="expression1"> +    
<OPTION VALUE=""></OPTION> +    
<OPTION VALUE="Vers">Vers</OPTION> +    
<OPTION VALUE="Avant">Avant</OPTION> +    
<OPTION VALUE="Après">Après</OPTION> +    
<OPTION VALUE="Entre">Entre</OPTION> +    
</SELECT> +    
<SELECT name="jour1"> +    
<OPTION VALUE=""></OPTION> +    
<OPTION VALUE="01">01</OPTION> + .................    
</SELECT> +    
<input name="an2" type="text" id="an2" size="2" maxlength="4"/><br><font size="1">Toutes les cases sont optionnelles</font><p>';    
document.getElementById('date_naissance_autre').focus();   
 }else{     
  document.getElementById('div_input_autre').innerHTML='';   
 }     
}

Mais ça ne fonctionne pas mieux.

Mon code php (qui devrait appeler mon javascript " date.js" :

echo 'Date de naissance : ';     
echo '<select name="date_naissance" id="date_naissance" onchange="ajout_input();">';      
echo '<option value="autre">'.$row['date_naissance'].'</option>';  
echo '<option style="color:red;" value="autre">Saisie d\'une autre date</option>';    
echo '</select>';     
echo '<script type="text/javascript">ajout_input();</script><p>';

Si je sélectionne "Saisie d\'une autre date", le contenu de mon javascript devrait s'afficher, normalement (???)
Si je fait un débogage, j'ai la réponse : La valeur de la propriété « ajout_input » est null ou non définie, pas un objet Function. Ceci pour la ligne "echo '<select name="date_naissance" id="date_naissance" onchange="ajout_input();">';"

Réponse 7 / 11
Utilisateur anonyme

J'ai tenté de mettre des + comme tu me l'as dit :
Non, tu ne fais pas comme je t'ai dit. Ce que je t'ai proposé, c'est de concaténer des chaînes avec des + , encore faut-il que chaque 'morceau' soit une chaîne, c'est à dire entouré d'apostrophes comme dans mon exemple.

D'autre part, puisque l'appel à la fonction est bien dans un 'onchange', tu n'as pas à appeler la fonction par ailleurs : il ne faut pas mettre
echo '<script type="text/javascript">ajout_input();</script>';
0
Réponse 8 / 11
t671 Messages postés 1475 Date d'inscription Statut Membre Dernière intervention 11
T'as solution avec '..........'+ pour chaques lignes fonctione ! Une bonne chose de faite !!!!!
Maintenant, si je veux faire un include du fichier date.js, ça fonctionne toujours pas :
```
</style> 
<SCRIPT LANGUAGE="Javascript" SRC="date.js"></SCRIPT> 
</head> 
<body> 
........................... 
?> .................... 
echo 'Date de naissance : ';  
 echo '<select name="date_naissance" id="date_naissance">';   
 echo '<option value="autre">'.$row['date_naissance'].'</option>';  echo '<option style="color:red;" value="autre">Saisie d\'une autre date</option>'; 
 echo '</select>';  
 echo '<div id="div_input_autre"></div>';
```
En déboguant, j'ai comme messages :
Impossible d'obtenir la valeur de la propriété « focus » : objet null ou non défini pour la fin du script
Constante chaîne non terminée pour le qscript date.js après la première ligne ci-dessous
```
document.getElementById('div_input_autre').innerHTML='<SELECT name="expression1"> 
<OPTION VALUE=""></OPTION> .........
```
0
1. Utilisateur anonyme
  
  Le fichier est bien inclus, puisqu'il te trouve une erreur dedans.
  Comme le message l'indique, tu as oublié un ' quelque part. Je suppose que c'est après "expression1"> mais je ne peux pas être sûr comme ça.
  Peux-tu donner le contenu de ton fichier date.js ?
  
  0

t671 Messages postés 1475 Date d'inscription Statut Membre Dernière intervention 11

Voici mon fichier date.js

function ajout_input(){ 
 //lecture du choix dans la liste suite au onchange (liste atteinte par son id ) 
 var choix_naissance=document.getElementById('date_naissance').value; 
 if(choix_naissance =='autre'){ 
  //on rajoute l'input dans le div par un innerHTML   
 document.getElementById('div_input_autre').innerHTML='<SELECT name="expression1">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="Vers">Vers</OPTION>
		<OPTION VALUE="Avant">Avant</OPTION>
		<OPTION VALUE="Après">Après</OPTION>
		<OPTION VALUE="Entre">Entre</OPTION>
		</SELECT>
		<SELECT name="jour1">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="01">01</OPTION>
		<OPTION VALUE="02">02</OPTION>
		<OPTION VALUE="03">03</OPTION>
		<OPTION VALUE="04">04</OPTION>
		<OPTION VALUE="05">05</OPTION>
		<OPTION VALUE="06">06</OPTION>
		<OPTION VALUE="07">07</OPTION>
		<OPTION VALUE="08">08</OPTION>
		<OPTION VALUE="09">09</OPTION>
		<OPTION VALUE="10">10</OPTION>
		<OPTION VALUE="11">11</OPTION>
		<OPTION VALUE="12">12</OPTION>
		<OPTION VALUE="13">13</OPTION>
		<OPTION VALUE="14">14</OPTION>
		<OPTION VALUE="15">15</OPTION>
		<OPTION VALUE="16">16</OPTION>
		<OPTION VALUE="17">17</OPTION>
		<OPTION VALUE="18">18</OPTION>
		<OPTION VALUE="19">19</OPTION>
		<OPTION VALUE="20">20</OPTION>
		<OPTION VALUE="21">21</OPTION>
		<OPTION VALUE="22">22</OPTION>
		<OPTION VALUE="23">23</OPTION>
		<OPTION VALUE="24">24</OPTION>
		<OPTION VALUE="25">25</OPTION>
		<OPTION VALUE="26">26</OPTION>
		<OPTION VALUE="27">27</OPTION>
		<OPTION VALUE="28">28</OPTION>
		<OPTION VALUE="29">29</OPTION>
		<OPTION VALUE="20">30</OPTION>
		<OPTION VALUE="21">31</OPTION>
		</SELECT>
		<SELECT name="mois1">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="JAN">JAN</OPTION>
		<OPTION VALUE="FEB">FEB</OPTION>
		<OPTION VALUE="MAR">MAR</OPTION>
		<OPTION VALUE="APR">APR</OPTION>
		<OPTION VALUE="MAI">MAI</OPTION>
		<OPTION VALUE="JUN">JUN</OPTION>
		<OPTION VALUE="JUL">JUL</OPTION>
		<OPTION VALUE="AUG">AUG</OPTION>
		<OPTION VALUE="SEP">SEP</OPTION>
		<OPTION VALUE="OCT">OCT</OPTION>
		<OPTION VALUE="NOV">NOV</OPTION>
		<OPTION VALUE="DEC">DEC</OPTION>
		</SELECT>
		<input name="an1" type="text" id="an1" size="2" maxlength="4"/>
		<SELECT name="expression2">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="et vers">et vers</OPTION>
		<OPTION VALUE="et avant">et avant</OPTION>
		<OPTION VALUE="et après">et après</OPTION>
		<OPTION VALUE="et entre">et entre</OPTION>
		</SELECT>
		<SELECT name="jour2">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="1">1</OPTION>
		<OPTION VALUE="2">2</OPTION>
		<OPTION VALUE="3">3</OPTION>
		<OPTION VALUE="4">4</OPTION>
		<OPTION VALUE="5">5</OPTION>
		<OPTION VALUE="6">6</OPTION>
		<OPTION VALUE="7">7</OPTION>
		<OPTION VALUE="8">8</OPTION>
		<OPTION VALUE="9">9</OPTION>
		<OPTION VALUE="10">10</OPTION>
		<OPTION VALUE="11">11</OPTION>
		<OPTION VALUE="12">12</OPTION>
		<OPTION VALUE="13">13</OPTION>
		<OPTION VALUE="14">14</OPTION>
		<OPTION VALUE="15">15</OPTION>
		<OPTION VALUE="16">16</OPTION>
		<OPTION VALUE="17">17</OPTION>
		<OPTION VALUE="18">18</OPTION>
		<OPTION VALUE="19">19</OPTION>
		<OPTION VALUE="20">20</OPTION>
		<OPTION VALUE="21">21</OPTION>
		<OPTION VALUE="22">22</OPTION>
		<OPTION VALUE="23">23</OPTION>
		<OPTION VALUE="24">24</OPTION>
		<OPTION VALUE="25">25</OPTION>
		<OPTION VALUE="26">26</OPTION>
		<OPTION VALUE="27">27</OPTION>
		<OPTION VALUE="28">28</OPTION>
		<OPTION VALUE="29">29</OPTION>
		<OPTION VALUE="20">30</OPTION>
		<OPTION VALUE="21">31</OPTION>
		</SELECT>
		<SELECT name="mois2">
		<OPTION VALUE=""></OPTION>
		<OPTION VALUE="JAN">JAN</OPTION>
		<OPTION VALUE="FEB">FEB</OPTION>
		<OPTION VALUE="MAR">MAR</OPTION>
		<OPTION VALUE="APR">APR</OPTION>
		<OPTION VALUE="MAI">MAI</OPTION>
		<OPTION VALUE="JUN">JUN</OPTION>
		<OPTION VALUE="JUL">JUL</OPTION>
		<OPTION VALUE="AUG">AUG</OPTION>
		<OPTION VALUE="SEP">SEP</OPTION>
		<OPTION VALUE="OCT">OCT</OPTION>
		<OPTION VALUE="NOV">NOV</OPTION>
		<OPTION VALUE="DEC">DEC</OPTION>
		</SELECT>
		<input name="an2" type="text" id="an2" size="2" maxlength="4"/><br><font size="1">Toutes les cases sont optionnelles</font><p>';
document.getElementById('date_naissance_autre').focus(); //et on lui donne le focus
 }else{ 
  document.getElementById('div_input_autre').innerHTML=''; //sinon on efface l'input eventuellement affiché 
 } 
}

Merci.

Réponse 10 / 11
Utilisateur anonyme

T'as solution avec '..........'+ pour chaques lignes fonctione ! Une bonne chose de faite !!!!!
Mais où sont les ' et les + ?
0
Réponse 11 / 11
t671 Messages postés 1475 Date d'inscription Statut Membre Dernière intervention 11

OKKKKKK !!!! Merci beaucoup "le père" pour ton aide et ta pascience ......
Ca fonctionne .......... ;o))

PS : je ne pensais pas que dans le script js lui-même il fallait mettre les '.....'+

A ++
0

Function javascript

11 réponses

Discussions similaires

Newsletters