Yatay form öğeleri


12

Formu tarif ettim, ama oradaki her element bir öncekinin altında bulunuyor. Tüm öğelerin yatay olarak yerleştirileceği ancak dikey olarak yerleştirilmeyeceği formu açıklamam gerekiyor. Bu benim formum:

function contact_register_form($form, &$form_state) {
  $form['description'] = array(
    '#type' => 'item',
    '#title' => t('Sign up to be notified when your community launches:'),
  );

  $form['email'] = array(
    '#type' => 'textfield',
    '#title' => t('Email'),
  );

  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => 'Add me',
  );    

  return $form;
}

Yanıtlar:


17

İçindeki Düğüm modülü tarafından kullanılan, aşağıdakine benzer bir kod kullanabilirsiniz node_filter_form().

  // Build the 'Update options' form.
  $form['options'] = array(
    '#type' => 'fieldset', 
    '#title' => t('Update options'), 
    '#attributes' => array('class' => array('container-inline')), 
    '#access' => $admin_access,
  );

  // ...

  $form['options']['operation'] = array(
    '#type' => 'select', 
    '#title' => t('Operation'), 
    '#title_display' => 'invisible', 
    '#options' => $options, 
    '#default_value' => 'approve',
  );

Anahtar "#attributes" özniteliğinin "container-inline" satır ayarlarıdır.

Bu kod Drupal 7 içindir; Drupal 6 için eşdeğer kod aşağıdaki kodla başlar:

  $form['options'] = array(
    '#type' => 'fieldset', 
    '#title' => t('Update options'), 
    '#prefix' => '<div class="container-inline">', 
    '#suffix' => '</div>',
  );

Drupal 6 kullandığınızı varsayarsak, kodunuz aşağıdakine benzer bir şekilde değiştirilmelidir:

function contact_register_form($form, &$form_state) {
  $form['description'] = array(
    '#type' => 'item',
    '#title' => t('Sign up to be notified when your community launches:'),
  );

  $form['email'] = array(
    '#type' => 'textfield',
    '#title' => t('Email'),
    '#prefix' => '<div class="container-inline">', 
  );

  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => 'Add me',
    '#suffix' => '</div>',
  );    

  return $form;
}

"Öğe" form alanı kullandığından, doğru bir şekilde oluşturulmayacağı için açıklamayı satır içine koymadım. Ayrıca, açıklamayı satır içine almanın formun çok fazla yer kaplamasına neden olacağını da buldum. (Satır içi açıklama daha uzun ve tek bir satıra yerleştirilirse ne olacağını hayal edin.)

Drupal 7'nin kapsayıcı satır içi öğelere eklediği CSS stilleri şunlardır.

/**
 * Inline items.
 */
.container-inline div,
.container-inline label {
  display: inline;
}
/* Fieldset contents always need to be rendered as block. */
.container-inline .fieldset-wrapper {
  display: block;
}

Bunlar system.base.css dosyasından eklenir .


1
Ve sınıfa floatCSS'de uygulamayı unutmayın container-inline.
tostinni

Bunu kod olmadan yapmanın bir yolu var mı? Formlar ekranında çok iyi bir kontrole sahibim, ancak DS'de birkaç sütun hariç, ancak form giriş verileri için webform düzen modülü gibi ayrıntılı bir şey yok
Bruno Vincent
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.