Hent data til ajax-rullemenuen ved hjælp af PHP MySql JQuery

Få tænker over din kode

Med AJAX, prøv at bruge JSON til at sende og hente data, det vil give dig mere frihed omkring vars og brugergrænseflade.
Mens du bruger jQuery, så prøv at bruge det så meget som muligt, ikke definere onlinebegivenheder. Hvis du grupperer dem i scriptet, vil det være nemmere for dig at administrere det.
Om de udvalgte, det er ret vanskeligt at genindlæse dem. I IE kan jeg huske, at jeg ikke kunne tilføje indstillinger, så du skal indlæse HELE udvalgte.
Brug ikke PHP mysql_query funktioner, er ret forældede. Læs og anvend dette: Hvordan kan jeg forhindre SQL-injektion i PHP?
Når du indlæser værdier fra AJAX, skal du knytte handleren til DOM-elementerne, det er derfor, du bruger .on()-funktionen for at sikre, at den knytter handleren til elementerne.
Prøv at bruge de nyere biblioteker i jQuery, da de er hurtigere, kraftfulde og har øget ydeevne, 1.4 er ret gammel...

Jeg har skrevet til dig et eksempel på dropdown af lande, der bruger ovenstående ting, for at give dig et fingerpeg om, hvordan du opnår det, tag det, du tror, du kan lide det:

index.html:

<html>

    <head>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
    </head>

    <body>

    <script>
    $(document).ready(function () {
        $(document).on('change', '#div_country select, #div_state select', function () {
            var $type = $(this).attr('data-type');
            var $id = $(this).val();

            if ( $id != -1 ) {
                loadSelect( $type, $id );
            }

        });

        function loadSelect( $type, $id ) {
            $.ajax({
                type: 'post',
                url: 'states.php',
                cache: false,
                data: {
                    'type': $type
                ,   'id': $id
                },
                dataType: 'json',
                success: function (data) {
                    if ( data.result == true ) {
                        if (data.html !== undefined) {
                            var $div = '';
                            if ( $type == 'country') {
                                $div = 'state';
                            } else {
                                $div = 'city';
                            }
                            $( "#div_" + $div ).html(data.html);
                        }
                    } else {
                        alert('Something went wrong!');
                    }
                }
            });
        }

    });
    </script>

    <div id="div_country">
        <select data-type="country">
            <option value="-1">Select Country</option>
            <option value="1">Spain</option>
            <option value="2">France</option>
            <option value="3">Germany</option>
        </select>
    </div>

    <div id="div_state">
        <select data-type="state">
            <option value="-1">Select Country</option>
        </select>
    </div>

    <div id="div_city">
        <select>
            <option value="-1">Select State</option>
        </select>
    </div>

    </body>
</html>

state.php

<?php
$type = isset( $_POST['type'] ) ? $_POST['type'] : '';

if ( !empty( $type ) ) {
    switch ($type) {
        case 'country':
            $result = true;
            $html = '<select data-type="state">
                        <option value="-1">Select State</option>
                        <option value="1">state 1</option>
                        <option value="2">state 2</option>
                    </select>';
        break;
        case 'state':
            $result = true;
            $html = '<select data-type="city">
                        <option value="-1">Select City</option>
                        <option value="1">city 1</option>
                        <option value="2">city 2</option>
                    </select>';
        break;
        default:
            $result = false;
            $html = '';
        break;
    }
}

$data = array(
    'result' => $result,
    'html' => $html
);

Jeg har tilføjet for at give dig et fingerpeg om, hvordan du opnår det, det er et enkeltstående eksempel, og du vil se ændringerne i dropboxen. Du bliver nødt til at tilføje PHP-logikken, men jeg ville gerne vise dig en bedre tilgang, XD