フォーム内に商品の購入ボタンがあります。同じフォーム内に商品名でグーグルのサイト内を検索させるボタンを設置し、横に並べることは可能ですか?
フォームの入れ子はよくないようなので、検索をJava scriptでできればよいのですが・・・
スタイルシートではデザイン上無理でした。
<form id="fm" name="fm" action="URL" method="POST">
<input type="hidden" name="shouhinmei" value="商品名">
<input type="hidden" name="kakaku" value="500">
<input type="image" src="kounyuu.gif value="購入">
<form method=get action="http://www.google.co.jp/search">
<input type=hidden class="q" name=q value="商品名"><input type=hidden name=ie value=UTF-8><input type=hidden name=oe value=UTF-8><input type=hidden name=hl value="ja"><input name=btnG type="image" src="検索.gif value="検索"><input type=hidden name=sitesearch value="サイトのURL"></form>
</form>
</form>
+----+ +----+
|購入| |検索|
+----+ +----+
No.4ベストアンサー
- 回答日時:
では、以下のような感じで。
なるべく多くのブラウザで動くように書いたつもりですが検証は充分行ってください。
<html>
<head>
<title></title>
<script type="text/javascript">
<!--
function searchGoogle(q) {
document.forms['searchForm'].elements['q'].value=q;
document.forms['searchForm'].submit();
return false;
}
//-->
</script>
</head>
<body>
<form action="URL">
~~
<input type="image" src="kounyuu.gif value="購入">
<a href="http://www.google.co.jp/" onclick="return searchGoogle('商品名')"><img src="検索.gif" border=0></a>
</form>
<form action="http://www.google.co.jp/search" id="searchForm" style="display:none;">
<input type=hidden name="q">
<input type=hidden name=ie value="UTF-8">
<input type=hidden name=oe value="UTF-8">
<input type=hidden name=hl value="ja">
<input type=hidden name=sitesearch value="サイトのURL">
</form>
</body>
</html>
steel_grayさん。お返事遅くなってすみません。
教えていただいた内容で希望通りのものができあがりました。
本当にありがとうございます。
document.form.submitを使って試行錯誤していましたが、<script>内がうまく書けませんでした。
なるほどここはこうやって書くのですね。
formもスタイルシートのdisplay:none;で見えなくするという発想も驚きでした。
まだまだ勉強することが多そうです。
なるべく自力で解決するよう頑張りますが、行き詰ったときにはまた教えていただければ幸いです。
No.3
- 回答日時:
> スタイルシートでは無理でした。
ということですが無理ではないと思います。
もう一度挑戦してみては?
以下は一例ですが他にもやりようはあると思います。
<form action="URL">
<input type="submit" value="購入" style="float:left;">
</form>
<form action="URL" style="display:inline;">
<input type="submit" value="検索">
</form>
この回答への補足
steel_grayさん、いつも回答いただきありがとうございます。
確かにボタンだけならfloatを使うことができますね。
しかし今回はデザインの都合上、購入ボタンのあるformは大きなボックスとなってボタンを包んでいるのです。
検索ボタンをtop: -25px; left: 150px; のようにしたりもしましたが、IE6でブラウザ上は問題なく見えるもののDreamweaverのプレビューで大きく崩れてしまうのです。
PCに不慣れなクライアントがDreamweaverで更新作業させますのでこれだと作業場所と見栄えが一致せず支障があります。
できればフォームの中に入れてしまいたいのです。
何かよい解決方法がありましたら教えてください。
No.2
- 回答日時:
一旦他のページに飛ばして、そこで分岐させてはどうでしょう?
以前PHP(+Java Script)でそういう構造のを書きましたが、飛ばした後の分岐はCGIやJAVAでも可能でしょう。飛ばす先は他のページではなく自ページでも良いです。
この回答への補足
yambejpさん、早速の回答ありがとうございます。
分岐のコードを製作するのはJava Script初心者の私にとっては質問の内容と同じかそれ以上に難しく感じられます。
いろいろ検索してみたところ、document.form.actionかdocument.form.submitでできそうな気がします。もう少し調べてみます。
No.1
- 回答日時:
formにidを振って、actionを書きかえればできる
とは思いますが、極端なクライアント依存で、
あまりお勧めできません。
例えば、検索と購入をラジオボタンで選ばせて
submitは「実行」とするとか、
検索をおすとhiddenに指定されたsearchという
項目にtrueをいれるとか、そういうパラメータで
受け取ったaction側が判断するのがあるべき
フォームの使いか方かとおもいます。
この回答への補足
yambejpさん、早速の回答ありがとうございます。
せっかく教えていただいたのですが、内容が高度過ぎて残念ながら半分程度しか理解できませんでした。
>例えば、検索と購入をラジオボタンで選ばせて
>submitは「実行」とするとか、
これは購入するにも検索するにもユーザが2度クリック(ラジオボタンと実行ボタン)しなければならず、不親切ではありませんか?
フォームの使い方としては正しいのでしょうが・・・
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- PHP PHPで画像の渡しが上手く行きません。 1 2023/02/02 09:39
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- HTML・CSS ただいま勉強始めたての初心者です。フォームを縦並べにしたいです。 2 2022/11/20 17:18
- PHP 入力した部分を表示させたまま(保持)するにはどうすれば良いでしょうか? 1 2023/01/25 11:14
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
このQ&Aを見た人はこんなQ&Aも見ています
-
あなたの「必」の書き順を教えてください
ふだん、どういう書き順で「必」を書いていますか? みなさんの色んな書き順を知りたいです。 画像のA~Eを使って教えてください。
-
大人になっても苦手な食べ物、ありますか?
大人になっても、我慢してもどうしても食べれないほど苦手なものってありますよね。 あなたにとっての今でもどうしても苦手なものはなんですか?
-
遅刻の「言い訳」選手権
よく遅刻してしまうんです…… 「電車が遅延してしまい遅れました」 「歯医者さんが長引いて、、、」 「病院が混んでいて」 などなどみなさんがこれまで使ってきた遅刻の言い訳がたくさんあるのではないでしょうか?
-
いけず言葉しりとり
はんなりと心にダメージを与える「いけず言葉」でしりとりをしましょう。 「あ」あら〜しゃれた服着てはりますな 遠くからでもわかりましたわ
-
【大喜利】【投稿~11/22】このサンタクロースは偽物だと気付いた理由とは?
【お題】 ・このサンタクロースは偽物だと気付いた理由とは?
-
1つのform内に2つのsubmitボタンがあり、action属性がそれぞれで異なる場合
JavaScript
-
form actionで二つ送信先を指定する方法を教えて下さい。
PHP
-
フォーム上で押されたボタンによってサーブレットの処理を変えたい
Java
-
-
4
jspからServletを呼び、元のjspページに戻るにはどうしたらよいですか?
Java
-
5
webアプリを作ってます。エラーがあります。
Java
-
6
日付型のフィールドに空白を入れる方法を教えてください
その他(データベース)
-
7
ページング
Java
-
8
2つの列が同じ値の行を取得するSQL
Oracle
-
9
javascriptでセレクトボックスのselected"を動的につ"
JavaScript
-
10
JSPの中にhtmlファイルを埋め込みたい。
Java
-
11
重複するキーから一番古い年月日のデータのみ取得したい
PostgreSQL
-
12
1つのformで複数のactionをボタン1つで
JavaScript
-
13
DBを10件毎に表示ページング処理方法
Java
-
14
JSPのクラスをコンパイルできない問題
Java
-
15
javaで質問です。 文字列2023/2/3(一桁の場合、0埋めなし)の場合にyyyyMMddに変換
Java
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・【大喜利】【投稿~11/22】このサンタクロースは偽物だと気付いた理由とは?
- ・お風呂の温度、何℃にしてますか?
- ・とっておきの「まかない飯」を教えて下さい!
- ・2024年のうちにやっておきたいこと、ここで宣言しませんか?
- ・いけず言葉しりとり
- ・土曜の昼、学校帰りの昼メシの思い出
- ・忘れられない激○○料理
- ・あなたにとってのゴールデンタイムはいつですか?
- ・とっておきの「夜食」教えて下さい
- ・これまでで一番「情けなかったとき」はいつですか?
- ・プリン+醤油=ウニみたいな組み合わせメニューを教えて!
- ・タイムマシーンがあったら、過去と未来どちらに行く?
- ・遅刻の「言い訳」選手権
- ・好きな和訳タイトルを教えてください
- ・うちのカレーにはこれが入ってる!って食材ありますか?
- ・おすすめのモーニング・朝食メニューを教えて!
- ・「覚え間違い」を教えてください!
- ・とっておきの手土産を教えて
- ・「平成」を感じるもの
- ・秘密基地、どこに作った?
- ・【お題】NEW演歌
- ・カンパ〜イ!←最初の1杯目、なに頼む?
- ・一回も披露したことのない豆知識
- ・これ何て呼びますか
- ・初めて自分の家と他人の家が違う、と意識した時
- ・「これはヤバかったな」という遅刻エピソード
- ・これ何て呼びますか Part2
- ・許せない心理テスト
- ・この人頭いいなと思ったエピソード
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・好きなおでんの具材ドラフト会議しましょう
- ・餃子を食べるとき、何をつけますか?
- ・あなたの「必」の書き順を教えてください
- ・ギリギリ行けるお一人様のライン
- ・10代と話して驚いたこと
- ・大人になっても苦手な食べ物、ありますか?
- ・14歳の自分に衝撃の事実を告げてください
- ・家・車以外で、人生で一番奮発した買い物
- ・人生最悪の忘れ物
- ・あなたの習慣について教えてください!!
- ・都道府県穴埋めゲーム
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
CookieをWebStoeageに変える
-
最小二乗法
-
GASでチェックボックスを一括of...
-
jsonテキストデータの並び替え...
-
Adobe acrobat proでフォームを...
-
Outlookのアカウントがあるとメ...
-
jqueryのselect2で検索欄の文字...
-
読み込んだQRコードをフォーム...
-
その要素がjQueryでremove()済...
-
スマホ上で、左右スワイプで次...
-
二次元配列の中の各行の要素を...
-
セレクトを全て選択されていな...
-
イラストレーター、縦中横のシ...
-
【GAS】WEBアプリでハイパーリ...
-
jQueryで同じクラス名のものを...
-
<tr>指定した表の行要素をボ...
-
食材の期限を管理するためにGAS...
-
前回の質問の続き function mov...
-
このプログラムに、王手をかけ...
-
前回の質問の続き function mou...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
1つのformで複数のactionを実...
-
javaScriptで検索結果の保持
-
C#でHTML操作
-
javasqliptで複数のテキストボ...
-
gooぶろぐに
-
「アドオンを実行しようとして...
-
動的にnema属性が変化する場合...
-
同一ページの複数フォームを一...
-
inputタグのclass名にコロン「:...
-
一括で値を入力するには?
-
フォームのValue値
-
今日の日付をセットしたいのですが
-
商品ページのフォームのテキス...
-
テキストボックスの初期値について
-
ハッシュの要素を別ファイルに...
-
リクエストパラメータの値によ...
-
Document.Writeの使い方を教え...
-
インフォシーク翻訳リクエスト...
-
フォームのテキストボックス内...
-
googleの検索を自分のHPにつけ...
おすすめ情報