デザインフォーム用のサンプル-表組み（マトリクス）フォーム

アンケートなどで、下記のように表組みで表示したい場合があります。

これはクライゼルにご用意している、差込記号の【選択肢】という、選択肢を個別に設定する機能を利用することで実現できます。

＜サンプルソース（抜粋）＞

form_table_2.jpg.jpg

［サンプルソース］

##html:doctype##

##html:html##
<head>
##html:content_type##
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>##msg:title##</title>
<style type="text/css">
body{
	font-size:14px;
	}
h3{
	width:250px;
	margin:0 auto;
	text-align:center;
	padding:5px 0;
	border-bottom: 1px solid #666;
	}
div#main{
	margin-top:15px;
	}
.sample_table{
	padding:15px 0;
	margin-top:15px;
	width: 500px;
	border-collapse: collapse;
	margin:0 auto;
	}
.sample_table th{
	width: 35%;
	padding: 6px;
	color: #333;
	background-color: #eee;
	border: 1px solid #b9b9b9;
	}
.sample_table td{
	text-align:center;
	background-color: #fff;
	border: 1px solid #b9b9b9;
	}
.error{
	color:#F00;
	}
div#btn{
	text-align:center;
	margin-top:20px;
	}
</style>
</head>
<body>
<h3>お客様満足度アンケート</h3>

##form##
##form:errors##
<div id="main">
    <table class="sample_table">
        <tbody>
            <tr>
                <th>&nbsp;</th>
                <td>満足</td>
                <td>普通</td>
                <td>不満</td>
            </tr>
            <tr>
                <th>言葉遣い##e_24:errors##</th>
                <td>##e_24:1##</td>
                <td>##e_24:2##</td>
                <td>##e_24:3##</td>
            </tr>
            <tr>
                <th>対応の丁寧さ##e_25:errors##</th>
                <td>##e_25:1##</td>
                <td>##e_25:2##</td>
                <td>##e_25:3##</td>
            </tr>
            <tr>
                <th>知識の正確さ##e_26:errors##</th>
                <td>##e_26:1##</td>
                <td>##e_26:2##</td>
                <td>##e_26:3##</td>
            </tr>
        </tbody>
    </table>   
</div>
<div id="btn"><input type="submit" name="__send" id="__send" value="##msg:send_button##" /></div>
##/form## 
</body>
</html>

ご注意

- 差込記号を個別に設定した場合は、十分に入力確認を行ってください。
- サンプルのソースを変更したい、カスタマイズしたい、といったご要望は、有償にてトライコーンの代行サービス「IMOSSS（アイモス）」にて承ります。お気軽にご相談ください。
- 管理者ニュースでご紹介したマトリクスフォームをリッチエディタで作成する方法もご参照いただけます。「マトリクス形式のアンケートフォーム作成解説」

sample_01.txt2 KB