Question

我正在创建一个我希望成为2列的表单，但是，cake正在关闭第一列之后的表单。我正在使用Cake 2.3.8

第一列样式很好，但第二列的输入间距较短。我检查了源和蛋糕是在第一列之后添加结束表单标记，我猜这解释了第二列的样式问题。

<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列），同时仍然使用表单助手？

Answer 1

这不是一个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');

使用CakePHP分割2个div

1 个答案: