2013-09-13 2 views
0

Я делаю форму, что я хотел бы быть 2 столбцами, однако торт закрывает форму после первого столбца. Я использую Cake 2.3.8Разделить форму на 2 divs с CakePHP

Первый столбец оформлен в порядке, но второй столбец имеет меньшее расстояние между входами. Я проверил источник, и торт добавляет тег закрывающей формы после первого столбца, который, как я предполагаю, объясняет проблему стилизации второго столбца.

<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% 
} 

Помимо использования таблицы или вручную кодирования форму, можно разделить форму вверх через две дивы, так что они появляются бок о бок (2 колонки), а все еще используя хелпер формы?

ответ

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'); 
+0

Спасибо, я закончил переход на поля, а не на divs, после изучения того, что вы сказали. Думаю, я не знаю HTML, как и думал. – user2443591

+0

И если вы хотите, чтобы кнопка отправки в другом месте, просто нажмите кнопку «echo $ this-> Form-> (« Отправить »);' в том месте, где вы хотите, чтобы кнопка отправки была. Таким образом, вы можете иметь кнопку во втором столбце, например. – Jelmer

Смежные вопросы