cakePHP display Элементы формы inline

Question

Я пытаюсь отобразить элементы формы inline, созданные с помощью хелпера формы cakePHP. Кажется, он имеет отношение к классам, которые он создает вокруг элементов. Я уверен, что это может быть исправлено с помощью CSS, но если есть другой путь, я предпочел бы сделать это правильно:

<?php 
      echo $this->Form->create("users"); 
      echo $this->Form->input("username",array("label" => false, "class" => false, "value" => "Username", "class" => "loginCredentials")); 
      echo $this->Form->input("password",array("label" => false, "class" => false, "value" => "Password", "class" => "loginCredentials")); 
      echo $this->Form->input("loginBtn",array("label" => false, "class" => false, "value" => "LOGIN", "class" => "loginCredentials", "type" => "submit")); 
      echo $this->Form->end(); 
      ?> 

Answer 1

По умолчанию CakePHP ставит <div> сек вокруг входов. Вы можете добавить опцию 'div'=>false для каждого входа:

echo $this->Form->input("username",array("label" => false, "div"=>false, "class" => false, "value" => "Username", "class" => "loginCredentials")); 

Или, вы можете установить inputDefaults для самой формы:

echo $this->Form->create('whatever', array(
    'inputDefaults'=>array('div'=>'false', 'label'=>false))); 

Answer 2

Моя форма имеет только 4 необходимые поля и порождается следующий вид:

<div class="users form"> 
<?php echo $form->create('User', array('class'=>'form'));?> 
<p class="formtitle">Sign Up</p> 
<fieldset> 
    <legend class="formtitle">Please complete the form below.</legend> 
    <?php 
     echo $form->input('username', array(
      'label' => 'Login', 
      'div'=>'formfield', 
      'error' => array(
       'wrap' => 'div', 
       'class' => 'formerror' 
       ) 
      )); 
     echo $form->input('password', array(
      'label' => 'Password', 
      'div'=>'formfield', 
      'error' => array(
       'wrap' => 'div', 
       'class' => 'formerror' 
       ) 
      )); 
     echo $form->input('password_confirm', array(
      'label' => 'Confirm password', 
      'type'=>'password', 
      'div'=>'formfield', 
      'error' => array(
       'wrap' => 'div', 
       'class' => 'formerror' 
       ) 
      )); 
     echo $form->input('name', array(
      'label' => 'Name', 
      'div'=>'formfield', 
      'error' => array(
       'wrap' => 'div', 
       'class' => 'formerror' 
       ) 
      )); 
     echo $form->input('surname', array(
      'label' => 'Surname', 
      'div'=>'formfield', 
      'error' => array(
       'wrap' => 'div', 
       'class' => 'formerror' 
       ) 
      )); 
     echo $form->input('email', array(
      'label' => 'E-mail', 
      'div'=>'formfield', 
      'error' => array(
       'wrap' => 'div', 
       'class' => 'formerror' 
       ) 
      )); 
     echo $form->input('city_id', array(
      'label' => 'City', 
      'div'=>'formfield', 
      'error' => array(
       'wrap' => 'div', 
       'class' => 'formerror'))); 
    ?> 
</fieldset> 
<?php echo $form->end('Submit');?> 
</div> 

Некоторые пояснения:

Для того, чтобы добавить класс в виде тега:

$form->create('User', array('class'=>'form')) 
generates: 


<form class="form" id="UserAddForm" method="post" action="/kultura/users/add"> 

Для того, чтобы добавить класс к входу:

echo $form->input('username', array(
      'label' => 'Login', 
      'div'=>'formfield', 
      'error' => array(
       'wrap' => 'div', 
       'class' => 'formerror' 
       ) 
      )); 

генерирует следующее:

<div class="formfield required"> 
<label for="UserUsername">Login</label> 
<input name="data[User][username]" type="text" maxlength="20" value="" id="UserUsername" /> 
</div> 

Ошибка в этом случае будет отображаться в:

<div class=”formerror”></div> 

Стиль CSS образец может выглядеть следующим образом:

.form{ 
    font-family: Verdana; 
    font-size:1em; 
    margin:1em; 
    padding:1em; 
} 

.form p.formtitle{ 
    color: #026475; 
    font-size:1.3em; 
    font-weight: bold; 
} 

.form fieldset{ 
    width:40em; 
    border:1px solid #FFE545; 
    background-image: url(../img/Contact.png); 
    background-position: bottom right; 
    background-repeat: no-repeat; 
} 

.form fieldset legend{ 
    color: #026475; 
} 

.formfield{ 
    width:30em; 
    padding:5px; 
} 

.formfield label{ 
    display:block; 
    float:left; 
    width:12em; 
    padding:1px; 
    color:#C2A34F; 
    text-align:right; 
} 

.formfield input, .formfield select{ 
    padding:0.15em; 
    width:14em; 
    border:1px solid #ddd; 
    background:#FEFBAF; 

    font-family: Verdana; 
    font-size:1em; 

    -moz-border-radius:0.4em; 
    -khtml-border-radius:0.4em; 
} 

.formfield input:hover, input:focus { 
    border-color:#c5c5c5; 
    background:#f6f6f6; 
} 

.required input { 
    border:1px solid #FBB829; 
} 

.form .submit input{ 
    font-family: Verdana; 
    font-size:1em; 
    margin-top: 0.3em; 
} 

.formerror{ 
    position:relative; 
    left:12.1em; 
    color:#FBB829; 
} 

Результат:

Answer 3

Не поймите меня неправильно, я думаю, вы могли бы попробовать это, что должно помочь Aswell

echo $form->create('Job', 
     array( 'type'=>'file', 
       'class' => 'form-horizontal', 
       'inputDefaults' => array(
        'div' => array('class' => 'form-group'), 
        //needs to be redefined due to restrictions of the text element we need to define for each input.. 
        'label' => array('class' => 'col-sm-4 col-md-3 control-label'), 
        'class' => 'form-control', 
        'between' => '<div class="col-sm-8 col-md-9">', 
        'after' => '</div>' 
       ) 
     ) 
    ); 

то вы можете просто:

echo $form->input('taskfield_id', 
     array( 'label'=> array('text' => 'Aufgabenbereich *','class' => 'col-sm-4 col-md-3 control-label'), 
       'empty'=>'Bitte wählen' 
     ) 
    ); 

этот выход будет что-то вроде этого

<div class="form-group required"> 
    <label for="JobTaskfieldId" class="col-sm-4 col-md-3 control-label">Aufgabenbereich&nbsp;*</label> 
    <div class="col-sm-8 col-md-9"> 
     <select name="data[Job][taskfield_id]" class="form-control" id="JobTaskfieldId"> 
      <option value="">Bitte wählen</option> 
     </select> 
    </div> 
</div> 

теперь у вас есть форма, которая даст вам всегда эту форму ввода

<div> <label> </label> <div> <input /> </div> </div> 

, поскольку мне нужно, чтобы перевести некоторые метки мне нужно массив ярлыков extea для каждого входа, который не должен быть необходим, если вы сохраните имена полей в своей базе данных.

редактировать: это сделано с начальной загрузки и торт, вы можете также стиль его самостоятельно, так как у вас есть полный проверочные классов и этикетки или без классов

label{float:left;width:25%} 
label+div input{float:left;width:75%}