Question

我知道你们可能已经回答了很多这样的问题，但我确实需要一些帮助。我找不到任何适合我的答案。

我在表单中有2个下拉列表（表单ID MapInitForm ）：

区域：已填充的区域列表（ID： zoneSelect ）
地区：我的地区列表（ID： territorySelect ）

我的Territories表中确实有 zone_id 。

因此，当我选择一个区域时，我需要获得所有相关的区域。当我选择一个领域时，我需要做一些PHP的东西;

感谢Mark的回答。

    $('#MapInitForm #zoneSelect').change(function(){
        var zone_id = $(this).val(); 

        var zone_id = $(this).val();
        var targeturl = $(this).attr('rel') + '?id=' + zone_id;
        $.ajax({
                type: 'get',
                url: targeturl,
                beforeSend: function(xhr) {
                        xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
                },
                success: function(response) {
                        if (response.content) {
                                $('#territorySelect').html(response.content);
                        }
                        else {
                            console.log(response.content);
                        }
                },
                error: function(e) {
                        alert("An error occurred: " + e.responseText.message);
                        console.log(e);
                }
        }); 

    });

在我的控制器中：

   public function zone_territories_ajax() {
    $this->request->onlyAllow('ajax');
    $id = $this->request->query('id');
    if (!$id) {
        throw new NotFoundException();
    }

    $this->loadModel('Territory');
    $data = $this->paginate('Territory', array('Territory.zone_id =' => $id));
    // $data = $this->Territory->find('all', array('condition' => array('Territory.zone_id =' => $id)));

    $this->set('zoneTerritories', $data);
}

在我看来：

   $url = $this->Html->url(array('controller' => 'zones', 'action' => 'zone_territories_ajax'));

        echo $this->Form->create('Map');
        echo $this->Form->input('zone_id', array(
            'options' => $zones, 
            'empty' => '--- Select one ---', 
            'id' => 'zoneSelect', 
            'rel' => $url
            ));
        echo $this->Form->input('zone_territory_id', array(
            'empty' => '--- Select one zone ---', 
            'id' => 'territorySelect', 
            ));
        echo $this->Form->end();

最后在我的zone_territories_ajax.ctp中：

    if (!empty($zoneTerritories)) {
        $k = 0;
    foreach($zoneTerritories as $zoneTerritory):
        echo '<option value="' . $k . '">' . $zoneTerritory['Territory']['name'] . '</option>';
        $k++;
        endforeach;
   }
   else {
       echo '<option value="0">' . __('noOptionAvailable') . '</option>';
   }

在我的控制台中， console.log（response.content）; 未定义 但是我得到了所选区域的正确值（我再次在控制台中看到了这些值），但第二个下拉列表中没有任何反应。

我做错了什么？

Answer 1

你很幸运，不久前我写了一些关于AJAX和CakePHP的文章： http://www.dereuromark.de/2014/01/09/ajax-and-cakephp

特别是，您可以在此处看到完整功能的完整示例： http://sandbox.dereuromark.de/sandbox/ajax_examples/chained_dropdowns

代码链接在底部 - see github

基本上：

    $('#source').change(function() {
            var selectedValue = $(this).val();

            var targeturl = $(this).attr('rel') + '?id=' + selectedValue;
            $.ajax({
                    type: 'get',
                    url: targeturl,
                    beforeSend: function(xhr) {
                            xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
                    },
                    success: function(response) {
                            if (response.content) {
                                    $('#target').html(response.content);
                            }
                    },
                    error: function(e) {
                            alert("An error occurred: " + e.responseText.message);
                            console.log(e);
                    }
            });
    });

CakePHP - 更新下拉列表

1 个答案: