1

1 番目の選択で行った選択に基づいて 2 番目の選択を設定する方法がわかりません。私がやりたいことは、場所を追加することです。場所を追加するには、大陸、国、地域、都市のselect4 つの最初のものを用意します。optionsそして、たとえばselect都市タイプの場合、2 番目の選択で、都市を接続できる地域のみを表示したいと考えています。国を選択した場合、2 番目の選択で大陸のみを表示する必要があります。

これまでのところ、私はこれを持っています:

<p><label for="type_id">Tip de locatie:</label><br />

<select class="styled" name="type_id" id="type_id">
    <option value="0">Alege...</option>
    <?php
    foreach ($place_type as $key => $type) { ?>
        <option value="<?=$type['id']?>"><?=$type['name']?></option>
    <?php } ?>
</select>
</p>

<noscript>
<input type="submit" name="action" value="Load Parents" />
</noscript>

<p><label for="parent_id">Leaga de:</label> <br />

<select class="styled" name="parent_id" id="parent_id">
    <option value="0">Alege...</option>
    <?php
    foreach ($places as $key => $place) { ?>
        <option value="<?=$place['id']?>"><?=$place['name']?></option>
    <?php } ?>
</select>
</p>

私は codeigniter フレームワークを使用しており、コントローラーにこのメソッドがあります:

public function get_place_parent()
{
    $this->load->model('places_model');
    $places = $this->places_model->get_places();
    $places = json_encode($places);
    return $places;
}

そしてjQuery

<script type="text/javascript" charset="utf-8">
$(function(){
  $("select#type_id").change(function(){
    $.getJSON("<?=site_url('admin/get_place_parent')?>",{type_id: $(this).val(), ajax: 'true'}, function(j){
      var options = '';
      for (var i = 0; i < j.length; i++) {
        options += '<option value="' + i + '">' + j[i] + '</option>';
      }
      $("select#parent_id").html(options);
    })
  })
})
</script>

これを行う方法がよくわかりません。このチュートリアルに基づいています: http://remysharp.com/2007/01/20/auto-populating-select-boxes-using-jquery-ajax/

前もって感謝します！

4

2 に答える 2

1

以下は、私のアプリケーションの1つからの抜粋であり、まさにあなたが求めていることを実行します。

companyNamesは、最初のドロップダウンのIDであり、登録されている会社のリストです。それが変更されると、admin / getAddresses関数へのajax呼び出しを行い、companyNamesドロップダウンからIDを送信します。コントローラ機能も含めましたが、アプリケーションとは関係がないのでモデルがわかります。

次に、コントローラーは、ajaxcotnrolのsuccess関数によって入力される2番目のドロップダウンのデータを含むjson応答を返します。最初に、すでにそこにあるオプションをすべて削除し（そうでない場合は、最初のドロップダウンを変更するたびに追加し続けます）、次にコントローラーが返したjsonから新しいオプションを追加します。

意見 

$(document).on("change", "#companyNames", function() {
    $row = $(this).closest('tr');
    $.ajax({
        type: "GET",
        url: "<?=base_url()?>admin/getAddresses/",
        data: $row.find('input,select').serialize(),
    dataType: "json",
        success: function(content) {
            if (content.status == "success") {
            $("#companyAddresses").find('option').remove();
            $.each(content.message, function(key, val) {
            $("#companyAddresses").append(
            '<option value="' + key + '">' + val + '</option>'
            );
            });
            } else {                
                $("#error").html('<p>'+content.message+'</p>');
            }
        }
    });
    return false;
});

コントローラ

public function getAddresses()
{
    $data = $this->input->getArray();
    $this->load->model('companies');
    $data['companyAddresses']=$this->companies->getCompanyAddresses($data['addCompany']);
    print json_encode(array("status"=>"success", "message"=>$data['companyAddresses']));
}
于 2013-01-10T12:54:41.577 に答える
0

次の手順に従ってください

1) 選択ボックスから都市タイプを選択する場合、その onChange イベントで Ajax 呼び出しを行う必要があります。

2) 選択した都市の ID をコントローラー関数に渡します。

3) 都市の地域を DB またはどこからでも取得します。

4) 次に、コントローラー関数自体でオプションを構築するか、それを Ajax 関数に渡して、そこでオプションを構築することもできます。

5) 構築されたオプションを地域選択ボックスに追加します。

于 2013-01-10T12:30:00.720 に答える