Question

我以cakephp形式拥有这三个控件：

echo $this->Form->control('recurring', ['empty' => true]);
echo $this->Form->control('recurring_months', ['options' => $months, 'empty' => true]);
echo $this->Form->control('recurring_start_date', ['empty' => true]);

如果未选中字段recurring_months-true，我希望隐藏字段recurring_start_date和recurring。

因此，我尝试使用此javascript代码，但无法正常工作。我该如何解决？

<script>
    //hide recurring options if its not recurring
    $(document).ready(function() {  
        $('#recurring').on('change', function(e){ 
            if($(this).is(':checked')) { 
                $('#recurring_months').show();
                $('#recurring_start_date').show();
            }
            else{ 
                $('#recurring_months').hide();
                $('#recurring_start_date').hide();
            }
        });
    });
</script>

Answer 1

这样的事情怎么样，将输入内容包装在div中并隐藏起来，而不是分别隐藏字段：

echo $this->Form->control('recurring', ['empty' => true]);
echo $this->Html->tag('div',
    $this->Form->control('recurring_months', ['options' => $months, 'empty' => true]) .
    $this->Form->control('recurring_start_date', ['empty' => true]),
    ['id' => 'recurring_fields']
);

<script>
    //hide recurring options if its not recurring
    $(document).ready(function() {  
        $('#recurring').on('change', function(e){ 
            if($(this).is(':checked')) { 
                $('#recurring_fields').show();
            }
            else{ 
                $('#recurring_fields').hide();
            }
        });
    });
</script>

CakePHP：基于复选框状态显示/隐藏表单控件

1 个答案: