0

ユーザーが複数の都市を選択できるようにする、対応する国への都市を含む複数の選択ボックスがあります。フォーム入力プロセスでは、ユーザーは最初に国を選択する必要があり、それに応じて複数の選択ボックスで都市を変更する必要があります。ここでは、私の国の選択ボックスと都市の複数の SB の下に表示されます。

<select name="country" id="country" onchange="ajax_change(this.value)">
    <option value="">--Select Country--</option>
    <? echo $countryList;?>
</select>

ここに複数の選択ボックスがあります

<select multiple="multiple" name="cities[]" id="cities[]" style="height:150px; width:300px;">
    <option value="">-- Select City --</option> 
</select>

これは、都市リストを正常に返す ajax コードです。

<script type="text/javascript">
    function ajax_change(val)
    {

        jQuery.post(
            '<?=WEB_ROOT?>index.php?rt=admin/airport/ajax',
            {
                val:val,
                type:'get_cities'
            },
            function(data){
                $('#cities[]').val(data);
            }
        );
    }
</script>

しかし、$('#cities[]').val(data)機能していません。これについて誰か助けてください。

4

2 に答える 2

2

$.each関数を使用して、返されたデータをループし (JSON であると想定しています)、新しく作成されたアイテムをリストに追加します。

これを試してください：

HTML

<select id='select' />​

Javascript

var data = {
    'name1':'value1',
    'name2':'value2'
};

$.each(data, function(key, value) {
    $('#select').append($("<option/>").text(key).val(value));
});

上記の jsfiddle: jsfiddle

ID から角かっこも削除します。

于 2012-05-14T17:36:21.703 に答える
1

クラスを使用して、idタグから[]を削除するだけです

<select multiple="multiple" name="cities[]" class="cities" style="height:150px; width:300px;">
    <option value="">-- Select City --</option>
</select>

と

<script type="text/javascript">
    function ajax_change(val)
    {
       //alert(val);

       jQuery.post('<?=WEB_ROOT?>index.php?rt=admin/airport/ajax',
           {val:val,type:'get_cities'},
           function(data){
               $('.cities').val(data);
           }
       );
    }
</script>
于 2012-05-14T17:21:49.710 に答える