0

我正在制作一个我想成为 2 列的表格,但是,蛋糕在第一列之后关闭了表格。我正在使用蛋糕 2.3.8

第一列的样式很好,但第二列的输入间距更短。我检查了源代码,并且 cake 在第一列之后添加了结束表单标记,我猜这解释了第二列的样式问题。

<div class = "template_form_left">  
        <?php
            echo $this->Form->create('Template');

            echo $this->Form->input('bullet_1', array('label' => 'Bullet 1'));
            echo $this->Form->input('bullet_2', array('label' => 'Bullet 2'));
            echo $this->Form->input('bullet_3', array('label' => 'Bullet 3'));

            echo $this->Form->input('section_1_title', array('label' => 'Section 1 Title'));
            echo $this->Form->input('section_1_content', array('label' => 'Section 1 Content'));

            echo $this->Form->input('section_2_title', array('label' => 'Section 2 Title'));
            echo $this->Form->input('section_2_content', array('label' => 'Section 2 Content'));

     //when I check the source, a closing form tag is added here by cake    
        ?>
</div>
<div class = "template_form_right"> 
        <?php
            echo $this->Form->input('section_3_title', array('label' => 'Section 3 Title'));
            echo $this->Form->input('section_3_content', array('label' => 'Section 3 Content'));


            echo $this->Form->input('section_4_title', array('label' => 'Section 4 Title'));
            echo $this->Form->input('section_4_content', array('label' => 'Section 4 Content'));

            echo $this->Form->input('section_5_title', array('label' => 'Section 5 Title'));
            echo $this->Form->input('section_5_content', array('label' => 'Section 5 Content'));

            echo $this->form->submit('Submit');
        ?>
</div>

这是CSS

.template_form_left{
float:left;
width:50%
}

.template_form_right{
float:right;
width:50%
}

除了使用表格或手动编码表单之外,是否可以将表单拆分为两个 div,以便它们并排显示(2 列),同时仍然使用表单助手?

4

1 回答 1

3

这不是一个真正的 cakePHP 问题。

你想做的是拥有

<div class="left">
    <form>
    ...
</div>
<div class="right">
    ...
    </form>
<div>

这不是有效的 HTML 并且不合逻辑。假设您是在告诉浏览器:“启动一个包含壁橱的抽屉,然后完成抽屉,启动另一个并完成壁橱,然后完成抽屉”。

每个浏览器都将尝试挽救这一天并尽可能地对其进行格式化,但会产生不可预测的结果。

相反,您需要说的是:

<form>
    <div class="left">
        ...
    </div>
    <div class="right">
        ...
    </div>
</form>

或“启动壁橱启动抽屉,停止抽屉,启动抽屉,停止抽屉,停止壁橱”。这在您的代码中翻译为:

<?php echo $this->Form->create('Template'); ?>
<div class = "template_form_left"> 
<?php
    echo $this->Form->input('bullet_1', array('label' => 'Bullet 1'));
    echo $this->Form->input('bullet_2', array('label' => 'Bullet 2'));
    echo $this->Form->input('bullet_3', array('label' => 'Bullet 3'));

    echo $this->Form->input('section_1_title', array('label' => 'Section 1 Title'));
    echo $this->Form->input('section_1_content', array('label' => 'Section 1 Content'));

    echo $this->Form->input('section_2_title', array('label' => 'Section 2 Title'));
    echo $this->Form->input('section_2_content', array('label' => 'Section 2 Content')); ?>
</div>
<div class = "template_form_right">
<?php
    echo $this->Form->input('section_3_title', array('label' => 'Section 3 Title'));
    echo $this->Form->input('section_3_content', array('label' => 'Section 3 Content'));


    echo $this->Form->input('section_4_title', array('label' => 'Section 4 Title'));
    echo $this->Form->input('section_4_content', array('label' => 'Section 4 Content'));

    echo $this->Form->input('section_5_title', array('label' => 'Section 5 Title'));
    echo $this->Form->input('section_5_content', array('label' => 'Section 5 Content')); ?>
</div> 
<?php
echo $this->form->submit('Submit');
于 2013-09-13T19:19:55.063 回答