Appel d'une fonction JS sur onchange

**Benduroy** · 30/10/2012, 10h02

Bonjour,

tout d'abords je suis débutant en javascript. Donc quelque chose de simple qui a l'air de marcher pour d'autres ne marche pas pour moi.

J'ai ma vue PHP avec une liste déroulante qui appelle une fonction js sur un onchange:

Code php :

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
<select name="BFAlist" id="BFAlist" onchange="bfaSelected();">
        <?php 
        $row = 0;
        if (($handle = fopen('files/FR21COMV01TBFA20121002.CSV', "r")) != FALSE) {
            while (($data = fgetcsv($handle, 1000, ";")) != FALSE) {
                $row++;
                $line = '<option value=\''.$row.'\'>';
                $num = count($data);
                for ($j=1; $j<$num; $j++) {
                    $line .= $data[$j].' - ';
                }
                // on enlève le dernier '-' avant de fermer la balise option
                $line = substr($line, 0, strlen($line)-2);
                $line .= '</option>';
                echo $line;
            }
        }
        ?>
    </select>

Mon modèle avec la fonction js (où j'essaie seulement d'afficher un message sur ma page):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<script language="Javascript">
    function bfaSelected() {
        alert('test');
        window.location = 'index.php?page=taux_bfa_ctrl&id='+selectOpt; 
    }
</script>

Et mon controleur:

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
include('model/taux_bfa_model.php');
 
include('view/taux_bfa_view.php');

Aucun message 'test' ne s'affiche...

J'ai essayé avec un onselect, même résultat...

**Bovino** · 30/10/2012, 10h11

Le code PHP ne nous intéresse pas. C'est le code HTML + JavaScript généré (celui affiché par le navigateur) qu'il faut nous montrer.

**Benduroy** · 30/10/2012, 10h17

A d'accord, voilà:

Code html :

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
!DOCTYPE html>
<html>
    <head>
        <meta charset=ISO-8859-1 />
        <link rel="stylesheet" type="text/css" href="css/style.css" />
        <title>Liaison AS400</title>
    </head>
 
    <body>
 
        <div id="top"></div>
<div id="menu">
    <a href="index.php?page=taux_bfa_ctrl" title="Gestion des taux de BFA">taux de BFA</a>
</div>
connexion AS400 réussie.<br><div id="main">
<script language="Javascript">
function bfaSelected() {
        alert('test');
         window.location = 'index.php?page=taux_bfa_ctrl&id='+selectOpt; 
    }
</script>    
<h1>Gestion des taux de BFA</h1>
 
 
<form method="post" action="index.php">
<input type="hidden" name="page" value="taux_bfa_ctrl" />
 
<table id="listBFA">
<tr>
    <td>Choisissez: </td>
    <td>
    <select name="BFAlist" id="BFAlist" onchange="bfaSelected();">
        <option value='1'>plein de valeurs ici</option>    </select>
    </td>
</tr>
</table>
</body>
</html>

Invité · 30/10/2012, 11h26

Bonjour,
aucun problème en vue...
Le code ci-dessus semble fonctionner (affichage de l'alerte "test").

A part remplacer :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<script language="Javascript">

en :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<script type="text/javascript">

Tu as sûrement d'autres scripts JavaScript sur ta page, non ?
L'un d'eux doit poser problème.

**E.Bzz** · 30/10/2012, 11h34

Salut.

Il vient d'où le selectOpt dans la fonction ?

**Benduroy** · 30/10/2012, 11h38

Ah oui pardon j'ai voulu mettre que le minimum nécessaire et du coup j'en oublie du code:

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
function bfaSelected() {
        alert('test');	
        var selectElmt = document.getElementById(selectId);	
        var selectOpt = selectElmt.options[selectElmt.selectedIndex].value;
 
         window.location = 'index.php?page=taux_bfa_ctrl&id='+selectOpt; 
    }

Et j'avais bien une autre fonction js juste avant celle là, mais je viens de la mettre en commentaire, et mon message 'test' ne s'affiche toujours pas.

**Bovino** · 30/10/2012, 11h40

Alors la nouvelle question devient :
Il sort d'où selectId dans la fonction ?

**E.Bzz** · 30/10/2012, 11h41

Peut-être un autre oubli, mais c'est maintenant selectId qui est indéfini.

**Benduroy** · 30/10/2012, 11h58

Tout à fait, là il s'agissait bien d'une erreur de ma part dans mon code, je l'ai remplacé par l'id de mon select dont le nom est 'BFAlist'
Mais ça ne m'affiche toujours rien.

**E.Bzz** · 30/10/2012, 12h00

S'il y a bien plusieurs options dans ton select (le onchange ne se déclenche qu'en changeant d'option), il reste cette piste :

Envoyé par jreaux62

Tu as sûrement d'autres scripts JavaScript sur ta page, non ?
L'un d'eux doit poser problème.

Invité · 30/10/2012, 12h05

Au lieu de faire une grande phrase, remets ton code corrigé.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<script type="text/javascript">
function bfaSelected() {
        var selectOpt = document.getElementById('BFAlist').value;
        alert('test : '+selectOpt);	
         window.location = 'index.php?page=taux_bfa_ctrl&id='+selectOpt; 
    }
</script>

Au fait, tu peux nous expliquer pourquoi tu fais une redirection en JavaScript, alors que tu as un formulaire fait pour ça ??

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<form method="post" action="index.php">
<input type="hidden" name="page" value="taux_bfa_ctrl" />

Cela revient à mettre method="get" au lieu de method="post".

**Benduroy** · 30/10/2012, 13h40

Au fait, tu peux nous expliquer pourquoi tu fais une redirection en JavaScript, alors que tu as un formulaire fait pour ça ??

En fait j'aimerais que la page soit rechargée sur le changement de valeur de la liste et non sur le click d'un bouton.

**E.Bzz** · 30/10/2012, 14h11

Si ton form se termine après le select (actuellement on ne voit pas le tag de fin), il suffit de faire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<select name="BFAlist" id="BFAlist" onchange="this.form.submit();">

Sinon, au cas où, ce serait

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

window.location.href = '....';

voire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

window.location.replace('....');

**Benduroy** · 30/10/2012, 15h02

Si ton form se termine après le select (actuellement on ne voit pas le tag de fin), il suffit de faire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<select name="BFAlist" id="BFAlist" onchange="this.form.submit();">

C'est tout simplement ça en effet. Je me suis compliqué pour rien.
Merci!

Appel d'une fonction JS sur onchange

JavaScript

Discussions similaires

Partager

Partager