CakePHP - 从下拉列表中选择后如何动态更改表单中的字段

时间:2014-11-19 08:33:40

标签: ajax cakephp

我无法获取所选下拉列表(package_id)的值以填充下一个字段,尤其是包模型中的出发时间和价格。

以下是我在View / Reservations / package.ctp中的代码:

<?php echo $this->Form->create('Reservation'); ?>
        <table cellspacing="10">
            <?php
                echo $this->Html->tableCells(array(
                    array(
                        'Date: ',
                        $this->Form->input('date', array('label' => false, 'type' => 'text', 'class' => 'datepicker'))
                        ),
                    array(
                        'Package Name:', 
                        $this->Form->input('package_id', array('label' => false, 'options' => $name, 'id' => 'PackageID', 'empty' => '-- Select Package --'))
                        ),
                    array(
                        'Departure Time:', 
                        $this->Form->input('departure_time', array('label' => false, 'type' => 'label', 'id' => 'test'))
                        ),
                    array(
                        'Price:', 
                        $this->Form->input('price', array('label' => false, 'id' => 'test'))
                        ),
                    array(
                        'Number of Person:', 
                        $this->Form->input('number_of_people', array('label' => false))
                        ),
                    array(
                        'Total Price:', 
                        $this->Form->input('price', array('label' => false))
                        ),
                    array(
                        '',
                        $this->Form->Submit('Book Now', array('class' => 'button'))
                        ),
                ));
            ?>
        </table>

以下是我在public function package()中的代码:

$options = $this->Packages->find('list'); //or whatever conditions you want
$this->set('name', $options);

我试图使用JS助手,但我无法在这里找到它是我的代码:

$this->Js->get('#PackageID');
$this->Js->event('change',
    $this->Js->request(array(
        'controller'=>'Reservation',
        'action'=>'getPackage'
        ), array(
        'update'=> '#test',
        'async' => true,
        'method' => 'post',
        'dataExpression' => true,
        'data'=> $this->Js->serializeForm(array(
            'isForm' => true,
            'inline' => true))
        )
    )
);

随意提出问题以便澄清。提前谢谢你:)

1 个答案:

答案 0 :(得分:0)

试试这个: 在.ctp视图中,添加此js函数:

<script language="JavaScript">
      jQuery(document).ready(function() {
       $("#PackageID").chosen().bind('change', function() {
            $.post('/project_name/controller_name/listDeparetementByPackage/'+$(this).val(), function(data) {
            $("#test").empty().append(data);
            $("#test").trigger("liszt:updated");
            }, 'html'); 

        });
     });   
</script>

在您的控制器中,这是通过pacakge id获取部门的功能:

function listDeparetementByPackage($package = null ) {


    $this->layout = 'ajax';
    $this->beforeRender();
    $this->autoRender = false;

    $data = $this->Package->Departement->find('list', array('fields' => array('Departement.id', 'Departement.libelle'), 
                                        'conditions' => array('Departement.package_id' => $package),     
                                        'recursive' => 0    ));
    if(count($data)>0){
        foreach($data as $key => $val) {
            echo "<option value=$key>$val</option>";
        }
    }else{
    echo "<option></option>"; // if the result is empty , show a select empty
    }

}

希望它有所帮助。

相关问题