Verwenden von CakePHP FormHelper mit Bootstrap-Formularen


Answers

Hier ist eine Lösung für Bootstrap 3

<?php echo $this->Form->create('User', array(
'class' => 'form-horizontal', 
'role' => 'form',
'inputDefaults' => array(
    'format' => array('before', 'label', 'between', 'input', 'error', 'after'),
    'div' => array('class' => 'form-group'),
    'class' => array('form-control'),
    'label' => array('class' => 'col-lg-2 control-label'),
    'between' => '<div class="col-lg-3">',
    'after' => '</div>',
    'error' => array('attributes' => array('wrap' => 'span', 'class' => 'help-inline')),
))); ?>
<fieldset>
    <legend><?php echo __('Username and password'); ?></legend>
    <?php echo $this->Form->input('username'); ?>
    <?php echo $this->Form->input('password'); ?>
</fieldset>
<?php echo $this->Form->end(__('Login')); ?>

Falls ein Feld ein eigenes Label benötigt:

<?php echo $this->Form->input('username', array('label' => array('text' => 'Your username', 'class' => 'col-lg-2 control-label'))); ?>
Question

FormHelper von CakePHP ist, wie Sie Formulare generieren, wenn Sie CakePHP-Anwendungen erstellen. Wie man annehmen könnte, beinhaltet dies das Generieren von Eingabeelementen wie folgt:

$this->Form->input('abc');

Welche wird HTML so etwas produzieren:

<div class="input text">
  <label for="ModelAbc">Abc</label>
  <input name="data[Model][Abc]" class="" maxlength="250" type="text" id="ModelAbc">
</div>

Nun, leider, Bootstrap will etwas wie das Folgende:

<div class="control-group">
  <label for="ModelAbc" class="control-label">Abc</label>
  <div class="controls">
    <input name="data[Model][Abc]" class="" maxlength="250" type="text" id="ModelAbc">
  </div>
</div>

Wie kann ich CakePHP diese Ausgabe produzieren lassen?




Ihre Antwort ist korrekt, aber zum Nutzen anderer Nutzer können Sie noch weitere Optimierungen vornehmen, um den Fehler / Hilfetext zu nutzen:

Fügen Sie form-horizontal zur class in Form->create() für kompaktere Formulare hinzu (Beschriftungen links von der Eingabe statt oben)

So fügen Sie Hilfetext unter ein Feld ein (muss für jedes Feld gemacht werden) und vergessen Sie nicht, </div> .

echo $this->Form->input('field_name', array(
            'after'=>'<span class="help-block">This text appears 
               underneath the input.</span></div>'));

und um Fehler korrekt anzuzeigen:

// cake 2.0
echo $this->Form->input('abc', array(
    'error' => array('attributes' => array('class' => 'controls help-block'))
));

Ausgänge:

<div class="control-group required error">
  <label for="ModelAbc" class="control-label">Abc</label>
  <div class="controls">
    <input name="data[Model][Abc]" class="" maxlength="250" type="text" id="ModelAbc">
  </div>
  <!-- error message -->
  <div class="controls help-block">This is the error validation message.</div>
  <!-- error message -->
</div>

Es ist extra Markup und nicht so ordentlich wie Bootstrap, aber es ist eine schnelle Lösung. Die Alternative ist, jede Fehlermeldung einzeln zu machen.

und es ordnet sich gut an. Ich habe jedoch noch keine einfache Möglichkeit gefunden, inline Nachrichten zu verwenden.




klein für weitere Kommentare hinzufügen:

Wenn Sie eine Klasse hinzufügen und den Basistext der Beschriftung ändern möchten, können Sie als Nächstes schreiben.

<?php echo $this->Form->input('Fieldname', array(
    'label' => array('class' => 'control-label','text'=>'HERE YOU LABEL TEXT')
)); ?>



Um es mit einer horizontalen Form im Bootstrap mit bootswatch arbeiten zu können, musste ich verwenden:

echo $this->Form->create(
    'User',
    array(
        'action'        => 'add',
        'admin'         => 'false',
        'class'         => 'form-horizontal',
        'inputDefaults' => array(
            'format'  => array( 'before', 'label', 'between',
                                'input', 'error', 'after' ),
            'class' => 'form-control',
            'div'     => array( 'class' => 'form-group' ),
            'label'   => array( 'class' => 'col-lg-2 control-label' ),
            'between' => '<div class="col-lg-10">',
            'after'   => '</div>',
            'error'   => array( 'attributes' => array( 'wrap'  => 'span',
                                                       'class' => 'text-danger' ) ),
        )
    )
);

Dann können Sie es einfach wie gewohnt verwenden:

echo $this->Form->input( 'User.username' );