Выберите изменение не работает

Question

Я создаю новое приложение в Кордове. Я борюсь с этой "странной" проблемой.

У меня есть выбор, который хорошо загружен в HTML

Только при запуске функция изменения не работает.

Вот код:

function loadlocations() {

        $.ajax({
            type       : "POST",
            url        : "https://app.q-r-s.eu/client/get_locations.php",
    crossDomain: true,
            tryCount   : 0,
            retryLimit : 3,
            success    : function(data) {
                var result = $.parseJSON(data);
                // div leegmaken voor we each kunnen doen
                $("#keuzelocatie").empty();
                console.log("locatiesladen"); 
                // eerst kijken of JSON leeg is (let op het ! )
                if (!$.isEmptyObject(result)) {
                            var select = '<h3><label for="location">Kies uw locatie:</label></h3>'
                                +'<select name="location" id="location" class="form-control" required>'
                                +'<option value="" disabled selected>Maak uw keuze</option>';
                    $.each(result, function(cat, inhoud) {
                            select += '<option data-cat="'+ cat +'" data-vest="'+ inhoud.id +'">'+ inhoud.name +' ('+ inhoud.city +')</option>';
                    });
                            select += '</select>';
                            $("#keuzelocatie").append(select);
                } else {
                    $("#keuzelocatie").append('Geen locaties met QRS gevonden');
                }

            },
            error      : function(xhr, textStatus, errorThrown){
                if (textStatus === 'timeout') {
                    this.tryCount++;
                    if (this.tryCount <= this.retryLimit) {
                        //try again
                        $.ajax(this);
                        return;
                    }            
                    return;
                }              
            }
        });
    }    

    $(document).ready(function(){

        $("#actionbusy").hide();
        loadlocations();
        $("#table").hide();

        $("#location").change(function()
        {
            console.log("locationchange");
        });


    });

Даже de console.log не появляется.

Я искал это несколько дней, но не смог найти проблему. Это для приложения Cordova.

Answer 1

Вы пытаетесь прикрепить событие к несуществующему элементу. Вы можете сделать это как $(document).on('change', '#location', function() вместо $("#location").change(function(), который будет прикреплять событие также к вновь созданным элементам, Или создайте элемент, а затем прикрепите событие, например:

function loadlocations() {

        $.ajax({
            type       : "POST",
            url        : "https://app.q-r-s.eu/client/get_locations.php",
    crossDomain: true,
            tryCount   : 0,
            retryLimit : 3,
            success    : function(data) {
                var result = $.parseJSON(data);
                // div leegmaken voor we each kunnen doen
                $("#keuzelocatie").empty();
                console.log("locatiesladen"); 
                // eerst kijken of JSON leeg is (let op het ! )
                if (!$.isEmptyObject(result)) {
                            var select = '<h3><label for="location">Kies uw locatie:</label></h3>'
                                +'<select name="location" id="location" class="form-control" required>'
                                +'<option value="" disabled selected>Maak uw keuze</option>';
                    $.each(result, function(cat, inhoud) {
                            select += '<option data-cat="'+ cat +'" data-vest="'+ inhoud.id +'">'+ inhoud.name +' ('+ inhoud.city +')</option>';
                    });
                            select += '</select>';
                            $("#keuzelocatie").append(select);
                            $("#location").change(function()
                            {
                                console.log("locationchange");
                            });

                } else {
                    $("#keuzelocatie").append('Geen locaties met QRS gevonden');
                }

            },
            error      : function(xhr, textStatus, errorThrown){
                if (textStatus === 'timeout') {
                    this.tryCount++;
                    if (this.tryCount <= this.retryLimit) {
                        //try again
                        $.ajax(this);
                        return;
                    }            
                    return;
                }              
            }
        });
    }    

    $(document).ready(function(){

        $("#actionbusy").hide();
        loadlocations();
        $("#table").hide();
    });