Menambahkan placeholder formulir ke bidang input teks


22

Apakah ada cara untuk mengonversi formulir biasa dan menambahkan placeholder dengan modul, atau haruskah ini dilakukan dengan Templat formulir atau dengan jQuery?

Jawaban:


31

Itu adalah placeholder HTML5, Anda bisa menambahkannya sebagai atribut ke elemen apa pun dan browser yang diaktifkan HTML5 akan bereaksi sesuai itu:

function MYMODULE_form_alter(&$form, &$form_state, $form_id) {
  if ($form_id == 'some_form') {
    $form['some_element']['#attributes']['placeholder'] = t('Placeholder text');
  }
}

Fungsi rekursif singkat seperti ini mungkin berguna jika Anda ingin secara otomatis menambahkan placeholder untuk setiap bidang teks dalam formulir (berdasarkan judul bidang dalam contoh ini):

function MYMODULE_auto_placeholders(&$element) {
  if ( isset($element['#type']) && $element['#type'] == 'textfield') {
    // set placeholder
    $element['#attributes']['placeholder'] = $element['#title'];
    // hide label
    $element['#title_display'] = 'invisible';
  }
  foreach (element_children($element) as $key) {
    MYMODULE_auto_placeholders($element[$key]);
  }
}

Kemudian dalam bentuk Anda ubah fungsi panggil saja

MYMODULE_auto_placeholders($form);

Metode itu akan bekerja untuk hampir semua bidang teks pada formulir, dengan pengecualian yang ditambahkan dalam #processfungsi (misalnya alt dan judul bidang teks bidang gambar misalnya).


Hasil: Kesalahan: Panggil ke function_children function () yang tidak terdefinisi () di bla_auto_placeholder () (baris 605 tema / custom / BLA / bla.theme).
Thomas

15

Saya mencoba jawaban Clive:

function MYMODULE_form_alter(&$form, &$form_state, $form_id) {
  if ($form_id == 'some_form') {
    $form['some_element']['#attributes']['placeholder'] = t('Placeholder text');
  }
}

Tapi yang mengejutkan saya, saya mendapatkan placeholder di bungkus textfield, bukan textfield itu sendiri. Kemudian saya mencoba variasi sebagai berikut, itu berhasil!

function MYMODULE_form_alter(&$form, &$form_state, $form_id) {
  if ($form_id == 'some_form') {
    $form['some_element']['und'][0]['value']['#attributes']['placeholder'] = t('Placeholder text');
  }
}

Terima kasih! Saya mulai menjadi sedikit gila - bahkan tidak memikirkan hal ini.
Mike Crittenden

Apa itu "some_element"? Apakah ID elemen? Bagaimana saya bisa menemukan ini?
sokratis

@sokratis Anda bisa mendapatkan ID elemen dengan dpm ($ form), mereka muncul di level pertama dari $ form array. Berikut ini adalah contoh aktual dari mengubah bentuk komentar: <code> fungsi MYMODULE_form_alter (& $ form, & $ form_state, $ form_id) {if ($ form_id == 'comment_node_post_form') {$ form ['subject'] ['#] atribut '] [' placeholder '] = t (' Subjek '); $ form ['comment_body'] ['und'] [0] ['value'] ['# atribut'] ['placeholder'] = t ('Konten'); }} </code>
Henry

15

Tambahkan saja placeholder di larik #attributes untuk elemen bidang formulir, seperti dalam kode berikut.

   $form['my_textfield'] = array(
      '#type' => 'textfield',
      '#attributes' => array(
        'placeholder' => t('My placeholder text'),
      ),
    );

2
thx, ini bekerja untuk saya di Drupal 8.
No Sssweat

bekerja dengan baik di D8.
dresh

5

Menemukan ini dan berpikir jawaban Clive tampak bagus untuk secara otomatis menambahkan placeholder.

Anda, beberapa perubahan kecil diperlukan untuk melakukannya dengan benar di drupal 8, jadi inilah jawaban yang hampir sama, tetapi cocok untuk tema drupal 8 Anda.

/**
 * Implements hook_form_alter
 */
function THEME_form_alter(&$form, \Drupal\Core\Form\FormStateInterface $form_state, $form_id) {
  add_placeholders($form);
}


/**
 * Add placeholders to suitable form elements -> textfield, password, email, textarea
 */
function add_placeholders(&$element) {
  if(isset($element['#type']) && in_array($element['#type'], ['textfield', 'password', 'email', 'textarea'])) {
    $element['#attributes']['placeholder'] = $element['#title'];
  }
  foreach(\Drupal\Core\Render\Element::children($element) as $key) {
    add_placeholders($element[$key]);
  }
}

0

Jika Anda ingin menargetkan contoh formulir secara langsung menggunakan hook_form_FORM_ID_alter. Mungkin lebih rapi daripada menggunakan kondisional. Solusi saya untuk menargetkan contoh blok formulir pencarian saja.

function eyecare_form_search_block_form_alter(&$form, $form_state) {
  $form['keys']['#attributes']['placeholder'] = t('Search');
}
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.