質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

3回答

1849閲覧

お問い合わせフォームの入力内容を表示させたい。

princess_usagi

総合スコア13

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2018/07/09 13:26

編集2018/07/11 23:40
<main> <h2>お問い合わせ</h2> <from method="GET" action="result.html"> <div> <label for="kind">お問い合わせの種類</label><br> <select id="kind name="kind">  <option value="reservation">ご予約</option>  <option value="event">イベントについて</option>  <option value="contact">その他のお問い合わせ</option> </select> </div> <div>  KUJIRA Cafeにご来店いただいたことはありますか。<br>  <label><input type="radio" name="first" value="yes" checked> はい  </label>  <label><input type="radio" name="first" value="no" > いいえ</label> </div> <div> 当カフェをお知りになったきっかけは?<br> <label><input type="checkbox" name="how" value="friends">知り合いの紹介で</label> <label><input type="checkbox" name="how" value="magazine">雑誌、Webサイトで見て</label> </div> <div> <label>お問い合わせの件名<br> <input type="text" name="subject" placeholder="お問い合わせ"></label> </div> <div> <label>お問い合わせの具体的な内容<br> <textarea name="message"></textarea></label> </div> <div> <input type="submit" name="submit" value="送信"> </div> </from> </main> ``````ここに言語入力 html cssのきほんという本でお問い合わせフォームのコードの入力しました。送信ボタンを押すとお問い合わせの入力内容が出るようになっています。 ですが私のは送信ボタンを押してもお問い合わせフォームの入力内容が表示されません。 どこを直したらいいでしょうか? エラーは出ていません。 MAC OS X 10.8.5 確認したブラウザはグーグルクロム クロムのバージョンはバージョン 49.0.2623.112 (64-bit) 回答していただいた方みんなに、またコメントするにはここから入力していいんですかね? fromでなくformなんですね。今までずっと気づかなかった。ありがとうございます。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2018/07/09 14:26

質問文のコードはコードブロックで囲んでいただけませんか? ```(バッククオート3つ)で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。
princess_usagi

2018/07/09 14:56

コードボタンお押してその中に貼付けたと思うのですが。。コードブロックとはコードボタンと違うのですか?バックオート3つとはどこにあるのですか?コードボタンのならびにはそのようなボタンがないのですが。。
princess_usagi

2018/07/09 14:58

改めてコードボタン押したあと貼付けました。これでいいでしょうか?
kei344

2018/07/09 14:59

「コード」と自動で入る部分にコードを入れてください。PCであれば記入エリアの右部分あたりにリアルタイムに結果が表示されていると思うので、そこを見ながら調整してください。
guest

回答3

0

ベストアンサー

formタグのスペルが違います
selectタグのidが閉じられていません

投稿2018/07/09 23:36

SakuBlade

総合スコア375

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

princess_usagi

2018/07/10 04:01

selectタグのidが閉じられていません. <select id="kind" name="kind">わかりました。ありがとうございます。 fromのスペルはよくわかりませんでした。3行目と下から2行目ですよね。 何度見ても本で確認しましたが間違えていないです何がおかしいのでしょうか?
evilscope

2018/07/10 04:08

横から失礼いたします。 princess_usagiさんのスペルは<from>(フロム)になっています。 正しくは<form>(フォーム)です。
SakuBlade

2018/07/10 04:55

出来ればprincess_usagiさん自ら気付いて欲しかった所ですねw 入力補完や文法チェックのできるエディタの使用をおすすめします。
guest

0

そもそも form の体になっていないです。
また、form の受け取りにはサーバサイドの仕組みが必要になります。
html と css だけでは完結しません。

投稿2018/07/09 13:32

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

princess_usagi

2018/07/09 13:57

少し質問内容のコードを全体像に加筆しました。/fromも加筆しました。 本に注意書きがあり データの送信先として使用するresult.htmlには、手軽にHTMLのフォーム機能を体験できるようにつくられた簡易的なプログラムが埋め込まれています。このプログラムには入力内容を画面に表示するように作られていて、フォームの送信がうまくいっているかを確認出来るようになっています。 WEBサーバー側の処理プログラムを作る訳ではないため、本性で紹介する作業を最後まで行ってもお問い合わせフォームとして動作するページは完成しません。あらかじめご了承ください。 と書かれていました。 このプログラムには入力内容を画面に表示するように作られていて、フォームの送信がうまくいっているかを確認出来るようになって とあるので お問い合わせフォーム入力内容を表示出来ると思うのですが その表示をさせたいんです。
退会済みユーザー

退会済みユーザー

2018/07/09 15:22

result.html を実装すれば確認できますが、将来的にもあまり意味がありません。 それよりも、ブラウザの開発ツールで、リクエストとレスポンスが確認できるので、そちらの使い方を覚えるほうが実践的です。 今回のコードであれば GET の内容を確認すると良いです。
princess_usagi

2018/07/09 23:45

macの開発ツールを使おうとオプション+コマンド+|を押しても開発ツールがでてきません。オプション+コマンド+l ←これは小文字のエルもツールが出てきませんでした。これは小文字のエルですか?それとも右上の|¥マークと同じところにあるものですか?
dit.

2018/07/09 23:48

option + command + i じゃないですか?mac環境ないので試してませんが
princess_usagi

2018/07/10 03:48

iでした。ありがとうございます。
guest

0

いろいろなテクニックがあって絶対ではないですが、

<form method="GET" action="result.html">

つまり、素の状態のHTMLに対して、GET(またはPOST)する、という状況は、実践において「まず無い」とお考え下さい。(実際はWEBサーバの設定で、サーバーサイドのPGを、.htmlとみなすことは可能ですが)

おそらく、「html cssのきほん」という本の内容からして、入力フォームをhtmlで組む方法だけのレクチャーであり、その後は「注意書き」にもある通り、「動かない」と思った方がいいと思います。

先の回答の通り、ブラウザの開発ツールでモニタリングするか、formを受け取るPHPなどのPGをサーバ側に置いて、$_GET、$_POSTの結果を表示するか、になるかと思います。MacにWEBサーバの環境を整えるか、レンタルサーバでやるか、でしょう。

「$_GET、$_POST」自体が分からないようであれば、今後順を追って行けば必ず出て来る、と思います。

既にご承知のことであれば、失礼しました。

投稿2018/07/10 04:21

SaintKnowledge

総合スコア368

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問