2 полета за въвеждане на автоматично довършване/предложение с помощта на jQuery или Ajax с второ поле въз основа на първи избор с множество елементи

Ето една много проста процедура. Просто ще покажа основния скелет. Добавянето на flash-meat ще бъде от ваша страна.

Да предположим, че имаме две <select> в ajax.php така:

   <select id="parent">
        <option value="1">value1</option>
        <option value="2">value2</option>
        <option value="3">value3</option>
        <option value="4">value4</option>
    </select>

    <select id="child">

    </select>

И така, какво ни трябва? Трябва да попълним втория <select> при случай на избора му.

Тук идва частта за javascript (ajax.php)

<script type="text/javascript">
            $(function(){                    
                $('#parent').change(function(){ //on change event
                var parentVal = $('#parent').val(); //<----- get the value from the parent select
                $.ajax({
                    url     : 'process.php', //the url you are sending datas to which will again send the result
                    type    : 'GET', //type of request, GET or POST
                    data    : { parentValue: parentVal}, //Data you are sending
                    success : function(data){$('#child').html(data)}, // On success, it will populate the 2nd select
                    error   : function(){alert('an error has occured')} //error message
                })
            })

            })
    </script>

Това ще изпрати заявката до process.php

Сега идва process.php

Тук имаме нужда от данните, за да попълним 2-ри <select>

Сега какво има вътре в <select> ?

<option value="someValue">someText</option>

Трябва да изведете нещо подобно:

    <option value="11">value11</option>
    <option value="12">value12</option>
    <option value="13">value13</option>
    <option value="14">value14</option>

Стойността и текстът вътре отговарят на вашите нужди.

Тъй като ще дойде от база данни:

• Можете да получите стойността за избор на родител в process.php с $_GET['parentValue']
• С тази стойност направете заявка към базата данни
• След това от резултата, върнат от базата данни, използвайте цикъл while , foreach или for (в зависимост от начина, по който го извличате), направете <option value="someValue">someText</option> .
• Готово!

За мултиселекция

за да направите живота малко по-лесен, можете да използвате избран мултиселект

Съвет

mysql_* е отхвърлено. вместо това използвайте PDO. Ето връзка към урок