Динамический выбор с помощью ajax php и mariadb

Я пытаюсь сделать динамический выбор с использованием ajax, php и запросов к BBDD. По этой причине у меня есть три части: html, в котором я заполнил свои варианты выбора с советами, которые я делаю с BBDD, эта консультация реализована с помощью AJAX, а скрипты для консультации с BBDD делают это на php. Мой html следующий:

<div class = "student-data-block">
                    <div class = "row">
                        <div class = "col-md-6">
                            <label>Nombre</label>
                            <input type = "text" name = "name" value = "" placeholder = ""/>
                            <br/>
                            <label>Apellido</label>
                            <input type = "text" name = "last_name" value = "" placeholder = ""/>
                            <br/>
                            <label>Universidad</label>
                            <select name = "universitySelect" id = "universitySelect" value = "" placeholder = "">
                                <option value = "">Escoger universidad</option>
                                <?php foreach ($universities as $name) { ?>
                                <option value = "<?php echo $name['UniversityID']?>"><?php echo $name['UniversityName']?></option>
                                <?php } ?>
                            </select>
                        </div>
                        <div class = "col-md-6">
                            <label>Campus</label>
                            <select name = "campusSelect" id = "campusSelect" value = "" placeholder = "">
                                <option value = "">Escoger campus</option>
                            </select>
                            <br/>
                            <label>Carrera</label>
                            <select name = "careerSelect" id = "careerSelect" value = "" placeholder = "">
                                <option value = "">Escoger carrera</option>
                            </select>
                            <br/>
                            <label>Nivel académico</label>
                            <select name = "study_type" value = ""
                                    placeholder = "">
                                <option value = "grado">Escoger nivel académico</option>
                                <option value = "grado">Grado</option>
                                <option value = "master">Máster</option>
                                <option value = "postgrado">Postgrado</option>
                                <option value = "doctorado">Doctorado</option>
                            </select>
                            <br/>
                        </div>
                    </div>

Сначала мы консультируемся с BBDD и заполняем первый выбор, #universitySelect, после того, как заполняем следующие выборы, мне нужен вариант, выбранный для пользователя, чтобы заполнить другие выбранные функции для выбранной опции. Для создания следующего мы используем Ajax, именно этот код:

$(document).ready(function() {
        $('#universitySelect').change(function() {
            var universityID = $("#universitySelect").val();
            if (universityID) {
                $.ajax({
                    type: 'POST',
                    url: 'action/AjaxSelect.php',
                    data: 'universityID=' + universityID,
                    success: function (html) {
                        $('#campusSelect').html(html);
                        $('#careerSelect').html('<option value = "">Selecciona tu carrera</option>');
                    }
                });
            } else {
                $('#campusSelect').html('<option value = "">Selecciona tu campus primero</option>');
                $('#careerSelect').html('<option value = "">Selecciona tu carrera primero</option>');
            }
        });
        $('#campusSelect').change(function(){
                var campusID = $("#campusSelect").val();
                if (campusID) {
                    $.ajax({
                        type: 'POST',
                        url: 'action/AjaxSelect.php',
                        data: 'campusID=' + campusID,
                        success: function (html) {
                            $('#careerSelect').html(html);
                        }
                    });
                }
                else {
                    $('#careerSelect').html('<option value = "">Selecciona tu carrera primero</option>');
                }
            });
    }   );

Наконец, когда я получаю данные AJAX, я обращаюсь к BBDD, чтобы заполнить остальные. Мой AjaxSelect.php выглядит следующим образом:

    if (!empty($_REQUEST["universityID"])){ //&& isset($_REQUEST["universityID"])
    $q_campus = 'select c.CampusID, c.Name as CareerName from unithinks.campus c
              where UniversityID = "$_REQUEST["universityID"]" order by c.CampusID asc ';

    //Count total number of rows
    $rowCampus = query($db_connection, $q_campus);

    //State option list
    if ($rowCampus > 0){
        echo '<option value = "">Selecciona campus</option>';
        foreach ($rowCampus as $campus){
            echo '<option value = "'.$campus['CampusID'].'">'.$campus['CareerName'].'</option>';
        }
    }else{
        echo '<option value = "">Selecciona primero universidad</option>';
    }
}
else if (!empty($_REQUEST["campusID"])){
    $q_careers = 'select ca.CareerID, ca.Name as CareerName from unithinks.careers ca
              where CampusID = "$_REQUEST["campusID"]" order by ca.CareerID asc ';
    $rowCareers = query($db_connection, $q_campus);

    //State option list
    if ($rowCareers > 0){
        echo '<option value = "">Selecciona Carrera</option>';
        foreach ($rowCareers as $careers){
            echo '<option value = "'.$careers['CampusID'].'">'.$careers['CareerName'].'</option>';
        }
    }else{
        echo '<option value = "">Selecciona primero universidad o campus</option>';
    }

Не понимаю, в чем ошибка. Я знаю, что код работает хорошо, пока не дойдет до петиции ajax, в Ajax я не знаю, отправляет ли он POST. (Также объясните, что консультации возвращают данные хорошо.)

Извините, я новичок в использовании php. Спасибо заранее.

Пожалуйста, поясните, в чем заключается ваша проблема. Что вы ожидаете? А что вы получите взамен? Пожалуйста, просмотрите наш Контрольный список вопросов SO, чтобы помочь вам задать хороший вопрос и, таким образом, получить хороший ответ.

Heri 04.05.2018 19:39

Закомментируйте весь свой скрипт в AjaxSelect.php и просто поместите <? Php var_dump ($ _ POST); ?>. В вашем успехе ajax: function (html) {console.info (html);}; и посмотри, что ты получишь

Michael Eugene Yuen 04.05.2018 19:42

Я отредактировал свой комментарий и более точно объяснил свою проблему.

Javier Sánchez Buitrago 05.05.2018 12:40

Привет, Майкл. Я вижу в console.info ошибку 404. AJAX не нашел файл action / AjaxSelect.php. Это проблема, большое спасибо.

Javier Sánchez Buitrago 05.05.2018 13:06
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
4
102
1

Ответы 1

Ошибка находится в URL-адресе AJAX и в консультации BDD.

Код следующий:

$('#universitySelect').change(function() {
            var universityID = $("#universitySelect").val();
            //alert(universityID);
            if (universityID) {
                $.ajax({
                    type: 'POST',
                    url: 'actions/AjaxSelect.php',
                    data: 'universityID=' + universityID,
                    success: function (html)
                        {
                            console.info(html);
                        $('#campusSelect').html(html);
                        $('#careerSelect').html('<option value = "">Selecciona tu carrera</option>');
                        }
                });
            } else {
                $('#campusSelect').html('<option value = "">Selecciona tu campus primero</option>');
                $('#careerSelect').html('<option value = "">Selecciona tu carrera primero</option>');
            }
        });

и ajaxSelect.php:

$db_connection = Connect_MySqli($cnn);   
if (!empty($_REQUEST["universityID"])){ //&& isset($_REQUEST["universityID"])
    $q_campus = 'select c.CampusID, c.Name as CareerName from unithinks.campus c
              where UniversityID='.$_REQUEST["universityID"].' order by c.CampusID asc ';

    //Count total number of rows
    $rowCampus = query($db_connection, $q_campus);
    //State option list
    if ($rowCampus > 0){
        echo '<option value = "">Selecciona campus</option>';
        foreach ($rowCampus as $campus){
            echo '<option value = "'.$campus['CampusID'].'">'.$campus['CareerName'].'</option>';
        }
    }else{
        echo '<option value = "">Selecciona primero universidad</option>';
    }
}

Другие вопросы по теме