2013-06-05 2 views
0

Я использую TwitterBootstrap Plugin для CakePHP2.x. И я не могу получить комбинацию горизонтальной формы с вложенной встроенной формой для работы.CakePHP & Twitter Бутстрап горизонтальная форма с вложенной встроенной формой

часть моего кода:

<?php 
    echo $this->Form->create('Event', array('class' => 'form-horizontal')); 
    echo $this->Form->input('Event.short_name',array(
     'label' => 'Short name', 
     'type' => 'text', 
     'class' => 'span5' 
    )); 
?> 
<div class="control-group"> 
    <div class="control-label">Date & Time</div> 
    <div class="controls form-inline"> 
     <div class=" input-append"> 
      <?php 
       echo $this->Form->input('Event.start_date', array(
        'label' => false, 
        'type' => 'text', 
        'class' => 'span2 start_date', 
        'after' => '<span class="add-on datetime"><span class="icon-calendar"></span></span>' 
       )); 

       echo $this->Form->input('Event.end_date', array(
        'label' => false, 
        'type' => 'text', 
        'class' => 'span2 end_date', 
        'after' => '<span class="add-on"><span class="icon-calendar"></span></span>' 
       )); 
      ?> 
     </div> 
    </div> 
</div> 

В приведенном выше примере это происходит: capture

и сгенерированный HTML

<div class="control-group"> 
    <div class="control-label">Date & Time</div> 
    <div class="controls form-inline"> 
     <div class=" input-append"> 
      <div class="control-group"> 
       <div class="controls"> 
        <input name="data[Event][start_date]" class="span2 start_date" type="text" value="2013-06-15" id="EventStartDate" required="required"><span class="add-on"><span class="icon-calendar"></span></span> 
       </div> 
      </div> 
      <div class="control-group"> 
       <div class="controls"> 
        <input name="data[Event][end_date]" class="span2 end_date" type="text" value="2013-06-22" id="EventEndDate" required="required"><span class="add-on"><span class="icon-calendar"></span></span> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

Когда я добавляю 'DIV' -> ложно два поля формы даты, они перемещаются внутри, но прокладка и т. д. ушла. capture

и сгенерированный HTML

<div class="control-group"> 
    <div class="control-label">Date & Time</div> 
    <div class="controls form-inline"> 
     <div class=" input-append"> 
      <input name="data[Event][start_date]" class="span2 start_date" type="text" value="2013-06-15" id="EventStartDate" required="required"><span class="add-on"><span class="icon-calendar"></span></span> 
      <input name="data[Event][end_date]" class="span2 end_date" type="text" value="2013-06-22" id="EventEndDate" required="required"><span class="add-on"><span class="icon-calendar"></span></span> 
     </div> 
    </div> 
</div> 

Я думаю, что это связано с тем, что все поля формы помещаются в элементы управления дивы ... Кто-нибудь знает, как решить эту проблему?

Я также разместил это как проблему на GitHub page, так как я думаю, что это связано с плагином, но я надеюсь, что кто-то знает временный рабочий стол.

ответ

0

Возможно, это может сработать. Я использовал его раньше, и это выглядит следующим образом:

enter image description here

<?php echo $this->Form->create('Event', array(
'class' => 'form-horizontal', 
'inputDefaults' => array(
    'format' => array('before', 'label', 'between', 'input', 'error', 'after'), 
    'div' => array('class' => 'control-group'), 
    'label' => array('class' => 'control-label'), 
    'between' => '<div class="controls">', 
    'after' => '</div>', 
    'error' => array('attributes' => array(
      'wrap' => 'span', 'class' => 'help-inline' 
    )), 
)));?> 
<fieldset> 
    <?php echo $this->Form->input('Event.start_date', array(
     'label' => array('class' => 'control-label', 
      'text' => 'start date'), 
    ));?> 
</fieldset> 
<?php echo $this->Form->end();?> 
+0

Спасибо за ваш ответ, но вопрос с частью формы инлайн. Горизонтальная форма отлично работает. –

0

Вопрос может быть конфликт между туберкулезом и Cake о поплавке и ясно, потому что cake.generic.css наборами для формы DIV ясно: оба, которые перемещает элементы ниже, а не рядом.

Попробуйте это:

div.form-inline div{ 
    clear: none; 
} 
+0

Я отошел от Торта из-за того, как они боятся форм. В настоящее время я изучаю Laravel. Спасибо за помощь. –

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