использование JQuery с путаницей в MySQL

0

HI, У меня такой код. то, что я делаю, заполняет первый выбор данными MySQL и основывается на выборе первого, используя jQuery, я заполняю второй. Теперь, на мой вопрос, могу ли я использовать тот же combos_get.php, чтобы заполнить другой выбор на основе выбора пользователя из второго выбора?

Да, тогда, пожалуйста, посмотрите комментарий, "застрявший в этой точке", где я смущен тем, как получить данные по третьему выбору.

    <html>
          <head>
            <link href="style23.css" rel="stylesheet" type="text/css" />
            <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

            <title></title>

          </head>
        <body>

        <div align="left" style="position:absolute;top:10px;">

         <select name="select1"  id="select1" size="10px;">
        <?php 
        // Make a MySQL Connection
        mysql_connect("localhost", "root", "bob") or die(mysql_error());
        mysql_select_db("mydb") or die(mysql_error());

        $result = mysql_query("select * from results where ID NOT LIKE 'Ex%' ") or die(mysql_error());  

        // store the record of the "example" table into $row
        while($row = mysql_fetch_array( $result )) {
        // Print out the contents of the entry 
        ?>
         <option value="<?php echo $row['ID']; ?>"><?php echo $row['ID'] ?></option>

        <?php
            }
            ?>
            </select><br>

            <script type="text/javascript">
        $(document).ready(function() {
            $('#select1').change(getDropdownOptions);
     //     $('#select2').change(getDropdownOptions); // stuck at this point 

        });

        function getDropdownOptions() {
            var val = $(this).val();
            //alert(val);
            // fire a POST request to combos_get.php
            $.post('combos_get.php', { value : val }, populateDropdown, 'html');
            //alert('s');
        }

        function populateDropdown(data) {
            if (data != 'error') {
                $('#select2').html(data);
            }
        }
        </script>
        </div>  
        <div align="left" style="position:relative;left:250px;">
        <select name="select2"  size="10px;" id="select2">
        <option value="--">--</option>
        </select>
        </div>

        <div  style="position:relative;left:450px;top:10px">
        <select name="select3"  size="10px;" id="select3">
        <option value="--">--</option>
        </select>
        </div>

        </body>
        </html>

    **combos_get.php**

<?php
if (!empty($_POST['value'])) {

$val = $_POST['value'];
mysql_connect("localhost", "root", "bob") or die(mysql_error());
mysql_select_db("mydb") or die(mysql_error());

$result = mysql_query("select ID2 from results where ID = \"$val\" ") or die(mysql_error());  

while($row = mysql_fetch_array( $result )) {
$html .= '<option value="1">'.$row['ID2'].'</option>';
}
    die($html);
    }


die('error');

?>
Теги:

2 ответа

1
Лучший ответ

Скорее всего, вам понадобится другой обработчик для этого случая. Вы можете решить, может ли один и тот же файл PHP обрабатывать запрос:

$(document).ready(function() {
    $('#select1').change(getDropdownOptions);
    $('#select2').change(getSecondDropdownOptions);
});

function getSecondDropdownOptions() {
    var val = $(this).val();
    $.post('combos_get.php', { value : val }, populateSecondDropdown, 'html');
}

function populateSecondDropdown(data) {
    if (data != 'error') {
        $('#YOURNEXTSELECT').html(data);
    }
}

Обычная практика заключается в том, чтобы использовать как можно больше кода. У меня нет времени на рефакторинг, так как я только что начал работать, но кто-то более чем приветствует его очистить.

Поделиться
  • 0
    Я создал второй обработчик, как вы заявили, но когда я выбираю любой вариант из второго выбора, содержимое второго выбора стирается, и ничего не добавляется в третий.
  • 0
    теперь все работает ТОЛЬКО в FIREFOX, в IE содержимое стирается. Странный!!. Любая ошибка в обработке JQuery в IE?
Показать ещё 3 комментария
1

Чтобы сделать это, вам нужно сделать populateDropdown использовать динамическую цель.

что-то вроде:

 function getDropdownOptions(event) {
            var e = $(this);
            var val = e.val();

            // fire a POST request to combos_get.php
            $.post('combos_get.php',{ value : val }, function(data){
                     populateDropdowns(data, e);
                }, 'html');

        }

        function populateDropdown(data, e) {
            // e is our originating select

            /* HERE You need to come up with a way to determin the target to populate based on the element that triggered it. for example assuming you only have 3 selects:*/
            switch(e.attr(id)){
              case 'select2':
                var targetSelector = '#select3';
                break;
              case 'select1':
                var targetSelector = '#select2';
                break;
              default:
                var targetSelector = null;
                break;
             }

            if (data != 'error' && targetSelector) {
                $(targetSelector).html(data);
            }
        }
Поделиться
  • 0
    интересно, но как мне объявить $ ('# select1'). change (getDropdownOptions); это $ ('# select1'). change (getDropdownOptions (event));
  • 0
    нет ... событие передается автоматически jQuery. это JQuery. Событие объекта. Вы можете даже не использовать это .. я просто включил это для полноты. Вы можете увидеть docs.jquery.com/Events/jQuery.Event для более подробной информации об объекте события.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню