Блог

У меня есть форма редактирования, в которой я пытаюсь извлечь данные из базы данных MySQL с помощью Ajax. Поэтому, когда есть два выпадающих списка select2. Я хочу отобразить данные внутри этого селекта2. Например : Когда я создал новый грузовик и водителя для определенной компании ( допустим, идентификатор компании равен 6). Поэтому для идентификатора компании 6 я выбрал водителя как Джона, а грузовик как бортовой и отправил форму. Данные были сохранены внутри БД. Когда я хочу отредактировать или обновить некоторые данные, тогда на нем должно отображаться название компании для идентификатора 6 (который успешно отображается), а водитель-Джон, а грузовик-планшетный.

Ниже приведен мой сценарий:

 function getTrip(tripid){
    document.getElementById('edtrip').value = tripid;
    var url = "api/gettripinfo";
    $.post(url,{
        tripid : tripid,
    },function(data, status){
        if (data.status == "OK") {
            if (data.statusCode == 1) {
                document.getElementById("edcompanyselect").value = data.response.company.companyname;
                document.getElementById("ed_com").value = data.response.company.companyid;
                document.getElementById('eddriverselect').value = data.response.driver.username;
                document.getElementById('edtruckselect').value = data.response.truck.name;
                document.getElementById("edtripnumber").value = data.response.tripnumber;
                document.getElementById("eddate").value = data.response.date;
                
            } else {
                var error = data.responseMessage;
                swal(error, "", "error");
            }
        } else {
            var error = data.responseMessage;
            swal(error, "", "error");
        }
    });
}
 

Но я не в состоянии получить ожидаемый результат. Пожалуйста, предоставьте мне свои ценные предложения.

Попробуйте выполнить приведенный ниже код. С помощью jQuery вы можете установить значение и запустить change событие.

 function getTrip(tripid){
    document.getElementById('edtrip').value = tripid;
    var url = "api/gettripinfo";
    $.post(url,{
        tripid : tripid,
    },function(data, status){
        if (data.status == "OK") {
            if (data.statusCode == 1) {
                document.getElementById("edcompanyselect").value = data.response.company.companyname;
                document.getElementById("ed_com").value = data.response.company.companyid;
                document.getElementById('eddriverselect').value = data.response.driver.username;
                document.getElementById('edtruckselect').value = data.response.truck.name;
                document.getElementById("edtripnumber").value = data.response.tripnumber;
                document.getElementById("eddate").value = data.response.date;

                jQuery("#edcompanyselect").val(data.response.company.companyname).trigger('change');
                jQuery("#eddriverselect").val(data.response.driver.username).trigger('change');
                jQuery("#edtruckselect").val(data.response.truck.name).trigger('change');

            } else {
                var error = data.responseMessage;
                swal(error, "", "error");
            }
        } else {
            var error = data.responseMessage;
            swal(error, "", "error");
        }
    });
}
 

Приведенный ниже код решил проблему:

 function getTrip(tripid){
        document.getElementById('edtrip').value = tripid;
        var url = "api/gettripinfo";
        $.post(url,{
            tripid : tripid,
        },function(data, status){
            if (data.status == "OK") {
                if (data.statusCode == 1) {
                    document.getElementById("edcompanyselect").value = data.response.company.companyname;
                    document.getElementById("ed_com").value = data.response.company.companyid;
                    setTimeout(function(){
                        getDriverAjax();
                        getTruckAjax();
                    },500);
                    document.getElementById("edtripnumber").value = data.response.tripnumber;
                    document.getElementById("eddate").value = data.response.date;
                    setTimeout(function(){
                        $("#eddriverselect").val(data.response.driver.userid).trigger('change');
                        $("#edtruckselect").val(data.response.truck.truckid).trigger('change');
                        $('#edit_info').modal("show");
                    }, 1500);
                } else {
                    var error = data.responseMessage;
                    swal(error, "", "error");
                }
            } else {
                var error = data.responseMessage;
                swal(error, "", "error");
            }
        });
    }