表をフォームを設置する

表をフォームを設置する

表組みの作成

<table>
    <tr>
        <td>1-1のセル</td>
        <td>1-2のセル</td>
    </tr>
    <tr>
        <td>2-1のセル</td>
        <td>2-2のセル</td>
    </tr>
</table>

「table」は【表組みデータ全体のエリア】 「tr」は【行】 「td」は【セル】を表している。

1-1のセル1-2のセル
2-1のセル2-2のセル

アンケートフォームの作成

<form id="フォーム名" action="データ送信のパス" method="データ送信方式"></form>

  • ▼id属性
    どこのフォームから送られてきたのかを判別するための名前
  • ▼action属性
    データ送信先のパス
  • ▼method属性
    データ送信方式。
    get(データをURLの一部として送信)
    post(データを本文として送信)

フォーム部品の種類と用途

  • テキストフィールド(シングルライン)
    <input type="text" name="text">
    
  • テキストフィールド(マルチライン)
    <textarea name="NAME" id="ID" cols="30" rows="10">ここに入力してください。</textarea>
    
  • テキストフィールド(パスワード)
    <input type="password" name="password">
    
  • ラジオボタン
    <input type="radio" name="radio" value="1" checked>aaa
    <input type="radio" name="radio" value="2">bbb
    
    aaa bbb
  • チェックボックス
    <input type="checkbox" name="check1" value="1">aaa
    <input type="checkbox" name="check2" value="2">bbb
    <input type="checkbox" name="check3" value="3" checked>ccc
    
    aaa bbb ccc
  • ファイルアップロード
    <input type="file" name="file">
    
  • 非表示フィールド
    画面上には表示しない隠しデータを設置するための要素
    <input type="hidden" name="hidden" value="1">
  • 送信ボタン
    <input type="submit" value="送信">
    
  • リセットボタン
    <input type="reset" value="リセット">
    
  • 汎用ボタン
    JavaScriptなどで機能をもたせる
    <input type="button" value="ボタン">
    
  • 画像ボタン
    <input type="image" src="画像URL" alt="送信">
    
  • セレクトメニュー(単一)
    <select name="select">
    <option value="1">メニュー1</option>
    <option value="2">メニュー2</option>
    <option value="3" selected>メニュー3</option>
    </select>
    
  • セレクトメニュー(複数)
    <select name="select" multiple>
    <option value="1">メニュー1</option>
    <option value="2" selected>メニュー2</option>
    <option value="3" selected>メニュー3</option>
    </select>
    
  • ラベル
    for属性に対象となるフォーム部品のid属性値を指定すると、ラベルテキストが対象のフォーム部品に関連付けされ、ラベルクリックでフォームが選択できるようになる。
    <input type="checkbox" name="checkbox1" id="checkbox1">
    <label for="check1">aaa</label>

トラブルが発生した場合はすぐにお電話(050-5532-9970)ください。
迅速なトラブル解決だけでなく、パソコン購入アドバイスもしております。

パソコンレスキュー
三鷹市周辺のパソコン修理・トラブル解決ならお任せください!

返信を残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA