0

PHP で AJAX を使用して国と都市のドロップダウン メニューを作成しました。彼らは正常に動作します。しかし、問題は、任意の国を選択し、この後にオプションを選択した場合に必要なことです」please select"都市オプションもに戻ります"please select"

これを行うために ajax コードを変更するにはどうすればよいですか?

<script type="text/javascript">
    // <![CDATA[
    $(document).ready(function(){   
        $('#country').change(function(){ //any select change on the dropdown with id country trigger this code        
            $("#cities > option").remove(); //first of all clear select items
            var country_id = $('#country').val();  // here we are taking country id of the selected one.
            $.ajax({
                type: "POST",
                url: "get_cities/"+country_id, //here we are calling our user controller and get_cities method with the country_id

                success: function(cities) //we're calling the response json array 'cities'
                {
                    $.each(cities,function(id,city) //here we're doing a foeach loop round each city with id as the key and city as the value
                    {
                        var opt = $('<option />'); // here we're creating a new select option with for each city
                        opt.val(id);
                        opt.text(city);
                        $('#cities').append(opt); //here we will append these new select options to a dropdown with the id 'cities'
                    });
                }

            });

        });
    });
    // ]]>
</script>

// ドロップダウン選択メニュー 

<label for="country">Country: </label>
<select id="country" name="country_id">
    <option selected="selected" value="#">Please Select</option>
    <?php foreach ($countries as $country) { ?>
        <option value="<?= $country['id'] ?>"><?= $country['country_name'] ?></option>

    <?php } ?>
</select>

<label for="city">City: </label>
<select id="cities" name="city_id">
    <option selected="selected" value="#">Please Select</option>
    <?php foreach ($cities as $city) { ?>
        <option value="<?= $city['id'] ?>"><?= $city['city_name'] ?></option>
    <?php } ?>
</select>
4

2 に答える 2

0

Ajax で取得している都市のリストには、最初の都市として「選択してください」オプションがあると思います。それ以外の場合は、ID 値 0 で追加する必要があります。これにより、都市を選択せず​​にユーザーが送信をトリガーした場合に簡単にフィルター処理できます。

次に、あなたの質問に答えます。

<script type="text/javascript">
    // <![CDATA[
    $(document).ready(function(){   
        $('#country').change(function(){ //any select change on the dropdown with id country trigger this code        
            $("#cities > option").remove(); //first of all clear select items
            var country_id = $('#country').val();  // here we are taking country id of the selected one.
            $.ajax({
                type: "POST",
                url: "get_cities/"+country_id, //here we are calling our user controller and get_cities method with the country_id

                success: function(cities) //we're calling the response json array 'cities'
                {
                    $.each(cities,function(id,city) //here we're doing a foeach loop round each city with id as the key and city as the value
                    {
                        var opt = $('<option />'); // here we're creating a new select option with for each city
                        opt.val(id);
                        opt.text(city);
                        $('#cities').append(opt); //here we will append these new select options to a dropdown with the id 'cities'});
                        **$("#cities option:first").attr('selected','selected');**
                }

            });

        });
    });
    // ]]>
</script>

最初のオプションを選択として設定するように選択に指示しています。

お役に立てれば！！

于 2013-05-15T13:27:43.997 に答える