Webformでテーブル形式にしたい

カテゴリ コンテンツの作成 コアバージョン 7.38 関連モジュール Webform

Webformはとても便利で、ある部分は標準ノード編集より使いやすい（ユーザーフレンドリー）なところがあり、U/Iの観点からノードを投稿するのではなく、一旦Webformで投稿し、自動的にノードを生成するような使い方もアリです。
Webform4からは、送信内容確認機能も追加され、Conditional（状態判定機能）、複数ページ機能と合わせると相当良いU/Iを作れます。

ただ、残念ながら、生成出力されるタグが<div>中心のため、表示崩れや、日本受けしないなどの理由から採用を躊躇してしまうこともあります。
CSSやテンプレートで頑張れば、それなりに対応できますが、Webform全てに対応するのは時間がかかります。

やはり、和風なテーブル表示形式に対応し、内容確認画面共々テーブル表示することで安定したフォームを作りたいものです。

コメント

ユーザー actbrain の写真

Submitted by actbrain on 2015/07/01 22:02.

Webformのテーブル化は、下記手法で実現します。

1．hook_form_alter()でsubmission（フォーム）とpreview（内容確認）全体をテーブルでラップする。
2．各フォームを<tr>〜</tr>でラップする。

参考）下記のようなコードになります。

/**
* Implement hook_form_alter() {
*/
function モジュール名_form_alter(&$form, $form_state, $form_id) {
if (strpos($form_id, 'webform_client_form_') === 0) { // Webform client form?
// フォームをテーブル化する。
foreach (array('submitted', 'preview') as $type) {
if (isset($form[$type]) && is_array($form[$type])) {
$form[$type]['#prefix'] = '<table><tbody>';
$form[$type]['#suffix'] = '</tbody></table>';
_モジュール名_erase_title_display($form);
foreach ($form[$type] as $field_name => &$field) {
if (strpos($field_name, '#') !== 0 && is_array($field)) {
$label = $required = $display = $visibility = '';
if (isset($field['#title'])) {
$label = $field['#title'];
}
$required = !empty($field['#required']);
if ($required) {
$label .= '<span class="form-required" title="このフィールドは必須です。">*</span>';
}
if (!$label) {
$display = 'display: none;';
}
// tr.class.
$tr_class = str_replace('_', '=', $field_name).'-tr';
// th, td.
foreach (array('#prefix', '#suffix') as $t) {
if (!isset($field[$t])) {
$field[$t] = '';
}
}
$field['#prefix'] = str_replace(
array('[tr_class]', '[tr_style]', '[th_style]', '[label]'),
array($tr_class, $display, $visibility, $label),
'<tr class="[tr_class]" style="[tr_style]"><th style="[th_style]">[label]</th><td>'
).$field['#prefix'];
$field['#suffix'] .= '</td></tr>';
}
}
}
}
}
}

function _モジュール名_taxonomy_parents_push($tid) {
static $tree = array();
$term_name = '';
if ($term = taxonomy_term_load($tid)) {
$term_name = $term->name;

if (!isset($tree[$term->vid])) {
$tree[$term->vid] = array();
$t = taxonomy_get_tree($term->vid);
foreach ($t as $obj) {
$tree[$term->vid][$obj->tid] = $obj;
}
}
if (!empty($tree[$term->vid][$term->tid]->parents[0])) {
$term_name = _モジュール名_taxonomy_parents_push($tree[$term->vid][$term->tid]->parents[0]).($term_name? '-'.$term_name: '');
}
}
return $term_name;
}

ページ

OTHER FAQ

Drupal開発・運用の疑問／質問の答えはここに

無料ユーザー登録すると質問できます。

カテゴリ Core Ver. 関連モジュール タイトル
サイトの環境設定 8.9.x 編集
コンテンツの管理 8.9.x 写真の変更を行いたい
Migrate 9.x drush config Upgrade source（環境） を 変更したときにやるべきこと
PHP 8.9.x drush drush sql:cli < が機能しない場合の対処
フォーム 8.9.x Views Views exposed filterのフォームに#default_valueを仕込む方法
テーマ 8.9.x スマホに向いたテーマについて
アップデート 8.9.x composer patch patch を composer に 組み込む方法
PHP-FPM 8.9.x PHP PHP-FPM 環境で .htaccess に php_value を 書いてもダメ
サイトの構築 8.9.x Webform drupalを使用した登録、一覧表示の方法について
アップデート 8.9.x Composer update Composer で drupal/core-8.9.7 に更新できなくなった場合の処置
サイトの構築 7.59 Drupal.ajax drupal 7 で Uncaught TypeError: Drupal.ajax is undefined となったときの対応方法
Proxy 7.59 Proxy Apache settings.php リバースプロキシ（Apache）＋バックグランドWeb（Drupal 7 ）でログインセッションを維持する方法
リバースプロキシ 8.9.x mod_proxy mod_proxy_http mod_ssl Apache2.4 から httpsサーバーへリバースプロキシする方法
コンテンツの作成 8.9.x node ノード保存時の前回値の参照方法
サイト情報 8.9.x api Drupal::request() メモ
テーマ 8.9.x Twig Twig で 月末日を算出する方法
SESSION 8.9.x api $_SESION操作のAPI
フォーム 8.9.x api GET/POSTされた情報を得る方法
テーマ 8.9.x patch パッチ 開発環境のファイル変更を本番環境にパッチでデプロイする方法（画像含まず）
コンテンツの作成 8.9.x vim nkf ファイルのエンコーディングを確認、変更する方法

ページ