Comment déclencher un événement de changement jQuery dans le code

177

J'ai un événement de changement qui fonctionne bien, mais je dois le faire revenir.

J'ai donc une fonction qui se déclenche sur le changement qui va "changer" d'autres listes déroulantes basées sur un sélecteur de classe (notez "drop downS", il pourrait y en avoir plus d'un). Ce changement de proxy ne déclenche pas la fonction et échoue donc. Comment puis-je le faire fonctionner?

Code

$(document).ready(function () {
    var activeDropBox = null;

    $("select.drop-box").change(function () {
        var questionId = $(this).attr("questionId");
        var selectedAnswer = $(this).val();
        activeDropBox = this;

        alert(this.questionId);

        $.ajax(
        {
            type: "POST",
            url: answerChangedActionUrl,
            data: { questionId: questionId, selectedValue: selectedAnswer },
            success: function (data) {
                SetElementVisibility(data.ShowElement, questionId);
            }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert('XMLHttpRequest:' + XMLHttpRequest.responseText);
                alert('textStatus:' + textStatus);
                alert('errorThrown:' + errorThrown);
            }
        });
    });

    function SetElementVisibility(visible, questionId) {
        // I would like each child to then trigger the change event...
        $(".childOf" + questionId)[visible ? 'show' : 'hide']('slow');

        // Suggested code
        //$(".childOf" + questionId + " select").trigger("change");

        if (!visible) {
            $(".childOf" + questionId + " select").attr('selectedIndex', 0);
        }
    }
}

Les suggestions jusqu'à présent semblent fonctionner, mais comme l'événement de changement déclenche un post ajax, il semble maintenant échouer ici. Je vais jouer avec mais c'est quelque chose pour une autre question que je ressens.

javascript jquery javascript-events

— 4imble
source

1

Fournissez du code pour que nous puissions jeter un coup d'œil

— Alex Rashkov

Comment pouvons-nous vous dire comment le faire fonctionner, alors que vous ne nous avez pas montré ce que c'est ?

— user113716

1

Je pensais que c'était un concept simple et je ne pensais pas que le code était nécessaire. Les réponses jusqu'à présent semblent avoir compris mon explication et j'essaie donc leurs solutions maintenant. Si je n'ai aucune joie, je posterai du code. Ma mise en œuvre est en fait beaucoup plus complexe.

— 4imble

1

Trié, c'était un problème avec moi en changeant la valeur après le post ajax. Merci à tous pour l'aide. Les suggestions publiées ont fonctionné comme un charme.

— 4imble

391

Utilisez la méthode trigger ()

$(selector).trigger("change");

— John Hartsock
source

4

Y a-t-il un avantage à cela change()? Ou est-ce juste une préférence?

— Joshua Pinter

6

@JoshPinter pas de réel avantage, plus une préférence. Mais certainement plus facile à résumer comme paramètre qu'un nom de méthode.

— John Hartsock

Définir une valeur avant de déclencher un événement de changement est le meilleur moyen !!

— Kapil Yadav

33

pour moi, $('#element').val('...').change()c'est le meilleur moyen.

— Luis Carlos Steffens
source

Ouais !, j'aime celui-ci

— Juan Herrera

Oui! il permet de choisir l'option en même temps. Je pense que votre réponse mérite d'être la meilleure ici.

— Sergej Fomin

20

La forme sans paramètre de la méthode change () déclenche un changeévénement. Vous pouvez écrire quelque chose comme:

$(document).ready(function() {
    $("#yourInitialElementID").change(function() {
        // Do something here...
        $(".yourDropDownClass").change();
    });
});

— Frédéric Hamidi
source

9

$(selector).change()

.changement()

.trigger ("modifier")

Alternative plus longue et plus lente , meilleure pour l'abstraction.

.trigger ("modifier")

$(selector).trigger("change")

— Geoffrey Hale
source

8

Utiliser ça :

$(selector).trigger("change");

OU

$('#id').trigger("click");

OU

$('.class').trigger(event);

Le déclencheur peut être n'importe quel événement pris en charge par javascript. J'espère qu'il est facile à comprendre pour vous tous.

— Muhammad Fahad
source