Lancer la première valeur d'un Select au chargement

**jayce23** · 12/03/2014, 11h21

Bonjour, j'ai créé une liste déroulante (balise "select") que je rempli avec une méthode Javascript (fillSlectTagStat3()).

J'utilise la fonction "change" pour lancer une autre méthode Javascript (getStatistic3()) qui affiche des données sur ma page.

Donc la première fois que ma page se lance, j'ai bien ma liste déroulante remplie mais logiquement rien n'est affiché vu que l'event se base sur un changement de sélection de la liste déroulante.

J'aimerais afficher les données sur ma page lorsque je la lance pour la première fois.

Voici mon code html :

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
<body>
    <select id="Select1" name="D1">
    </select>
    <br />
    <br />
    <br />
    <br />
    <script>
        $("#Select1").change(function () { getStatistic3(); });
    </script>
    <table id="table_statistic_3" class="display">
        <caption style="font-size: 15px">Omzetcijfer per klant en productgroep</caption>
        <thead>
        </thead>
        <tbody>
        </tbody>
    </table>
    <script type="text/javascript">
        fillSlectTagStat3();
    </script>

Mon code Javascript :

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
function fillSlectTagStat3() {//function qui va remplir la balise select
...
}
function showStatistic3() {//bouton sur une page index.html qui lance cette méthode et qui récupère l'htlm de la page concerné dans une balise div
    $("#content").empty();
    $.ajax({
        url: 'Statistic_3.html',
        dataType: 'html',
        success: function (data) {
            $("#content").html(data);
            getStatistic3();
        },
        error: function (e) {
            alert("Error loading statistic 3 html : " + e.statusText);
        }
    });
}
function getStatistic3() {//fonction qui va afficher les données suivant la sélection
    var response;
    var allstat3 = [];
    var allyearstat3 = [];
    var kla = $('#Select1').val();//ICI LA 1er FOIS J'AI VIDE, POURQUOI ?
    kla = kla.replace("'", "\\'");
    if (kla) {
        $.ajax({
            type: 'GET',
            url: 'http://localhost:52251/Service1.asmx/Statistic_3',
            data: "klant='" + encodeURIComponent(kla) + "'",
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            processData: false,
            success: function (msg) {
                response = msg.d;
                ...
            },
            error: function (e) {
                alert("error loading statistic 3");
            }
        });
    }
}

Merci.

**Bovino** · 12/03/2014, 11h30

Au chargement de la page, ton select est vide, quelle valeur espères-tu récupérer du coup ?

**SpaceFrog** · 12/03/2014, 11h30

Code :

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

trigger('change')

**jayce23** · 12/03/2014, 12h21

@Bovino

Oui au chargement j'ai mon select qui est vide et je voulais savoir comment faire pour contrer cela?

@SpaceFrog

J'ai mis

Code :

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

$("#Select1").trigger('change');

en dessous de

Code :

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

 $("#Select1").change(function () { getStatistic3(); });

, j'ai toujours une liste remplie au chargement mais pas de données affichées.

Ma variable "kla" vaut toujours null au chargement.

C'est bien de cette manière qu'il fallait faire?

**SpaceFrog** · 13/03/2014, 08h39

Accessoirement quand j'aurais compris ce que veut dire "Lancer la première valeur d'un select ...

Nom : poidsrot.gif
Affichages : 1700
Taille : 44,1 Ko

**jayce23** · 13/03/2014, 09h18

Je voudrais qu'il se lance avec la première valeur se trouvant dans ma liste déroulante : Nom : bam.png
Affichages : 1064
Taille : 16,7 Ko

Mais au chargement, j'ai juste ma liste déroulante remplie et pas d'affichage de données, il faut que je clic une première fois pour que ça affiche des données.

Ma méthode getStatistic3() récupère toujours null comme valeur pour "kla".

**jayce23** · 13/03/2014, 10h05

J'ai résolu en mettant getStatistic3() à la fin de ma fonction fillSlectTagStat3() et en initialisant le selectedIndex juste avant.

Merci.

**Bovino** · 13/03/2014, 10h10

Il y a quand même un truc qui me chiffonne...
A priori, au chargement de la page, tu possèdes tous les éléments pour remplir ton select. Du coup, quel intérêt de le faire en JavaScript plutôt qu'à la construction de la page sur le serveur ? Ce serait largement plus propre.
En règle générale, un appel AJAX au chargement de la page dénote une erreur de conception...

**jayce23** · 13/03/2014, 10h26

Je remplis ma liste déroulante avec des données que je récupère d'une méthode de mon Web Service.

La gestion de mes données se fait du côté serveur, ici je récupère et j'affiche seulement, ce n'est pas la bonne manière?

**SpaceFrog** · 13/03/2014, 10h43

Personnellement je ne "lance" pas les options, je les sélectionne ...

Lancer la première valeur d'un Select au chargement

jQuery

Discussions similaires

Partager

Partager