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

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

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

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

2回答

1771閲覧

AタグでPOSTする方法

hellomikitty

総合スコア9

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2018/09/05 03:00

編集2018/09/05 05:34

いつも参考にさせていただいております。
Twitterのフォロー・フォロワーのようにユーザー一覧を表示し、クリックするとそのユーザーの詳細が表示されるような仕組みを作りたく試行錯誤しています。
DBの中身を一覧表示することと、次のページにPOSTする仕組みまでは独学ながらも理解したのですが
https://qiita.com/next1ka2u/items/9736ce2f9c7f3aa69d61
今回上記のサイトを参考にしてjavascriptとAタグを利用したPOSTを実装しようとしたところ、なかなかうまくいきません。
今の状態ではform[0]の内容だけがPOSTされているのは理解しているのですが、配列を使ってそれ以降をPOSTするにはどうしたら上手くいくでしょうか。
初めて質問させていただきますが、どなたかお答えいただければ幸いです。

<?php if ($result = mysqli_query($link, 'SELECT * FROM member WHERE '.$shop.' = shop ORDER BY sort')) { ?> <ul class="list-group sortable"> <?php while ($row = mysqli_fetch_assoc($result)) { echo '<form action="staffsetting.php" method="POST" name="sampleform"><input type="hidden" name="id" value="' . $row['id'] .'"><li class="list-group-item" id=item-' . $row['id'] .'><div align="left"><a href="#" onclick="javascript:document.forms.sampleform.submit();return false;"><img src="upfiles/'.$row['images'].'" class="thumbnail-a img-responsive">' . $row['account'] . '</a></div></li></form>'; } ?></ul>

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

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

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

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

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

guest

回答2

0

aタグを分だらformをサブミットするようjavascriptを組めばよいでしょうけど
aタグやめてlabelでやればjavascriptいらないかも

css

1.anchor{text-decoration:underline;color:blue;} 2.anchor:hover{color:red;}

HTML

1<label for="sbmt" class="anchor">ほげ</label> 2<form method="post"> 3<input type="text" name="hoge" value="1"> 4<input type="submit" value="go" id="sbmt"> 5</form>

追記

フォームを表示しない

PHP

1<style> 2.anchor{text-decoration:underline;color:blue;} 3.anchor:hover{color:red;} 4#f1{position:absolute;top:-9999px;} 5</style> 6<label for="sbmt" class="anchor">ほげ</label> 7<form method="post" id="f1"> 8<input type="text" name="hoge" value="1"> 9<input type="submit" value="go" id="sbmt"> 10</form> 11<?PHP 12print_r($_POST); 13?>

javascriptバージョン

PHP

1<style> 2#f1{position:absolute;top:-9999px;} 3</style> 4<script> 5window.addEventListener('DOMContentLoaded', function(e){ 6 document.querySelector("#a1").addEventListener('click',function(e){ 7 e.preventDefault(); 8 document.querySelector("#f1").submit(); 9 }); 10}); 11</script> 12<a href="#" id="a1">ほげ</a> 13<form method="post" id="f1"> 14<input type="text" name="hoge" value="1"> 15</form> 16<?PHP 17print_r($_POST); 18?>

投稿2018/09/05 03:07

編集2018/09/05 04:27
yambejp

総合スコア114585

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

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

hellomikitty

2018/09/05 03:38

早速のご回答ありがとうございます。 試してみたところ、無事に項目ごとに別のページが表示されました。 出来ればsubmitボタンを表示せずにリンクを設置したかったのでAタグを採用したのですが、今回の場合でもそのようにできますでしょうか。 (<input type="submit" style="display:none" id="sbmt">と安直に挿入してみたのですが、その場合だとリンク後のページ分岐が出来なくなりました。)
yambejp

2018/09/05 03:48

ブラウザの種類やバージョンにもよりますが formまるごとdisplay:noneにしてしまえばよいのでは?
yambejp

2018/09/05 03:48 編集

かぶった
hellomikitty

2018/09/05 04:15

そちらも試してみましたが、結果は同じのようです。 Javascriptでの方法も模索してみます。
yambejp

2018/09/05 04:27 編集

追記しました(ついでなのでjsバージョンも)
hellomikitty

2018/09/05 04:36

沢山ご回答頂きありがとうございます。1つ1つ検証してみたいと思います。
guest

0

ベストアンサー

jQueryならこんな感じ。

jquery

1 2 $('aタグのid').click( function() { 3 $('フォームのid').submit(); 4 } );

追記

やりたい動き的には '''<form id="form_a1"><a id="a1"></a></form>''' みたいなくくりで数字部分をインクリメントして繰り返しという形だと思うので、

jquery

1 2 $('a').click( function() { 3 // id指定 4 var submitform = '#form_' + $(this).attr('id') 5 $(submitform).submit(); 6 7 // name指定 8 var submitformN = 'form[name="form_' + $(this).attr('id') + '"]' 9 $(submitformN).submit(); 10 } );

という感じ?(違ったらご指摘ください)
普通の<a>タグもあるだろうから、$('a')の部分は$('.クラス名')にしてください。

投稿2018/09/05 04:31

編集2018/09/05 06:09
yukihisa

総合スコア672

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

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

hellomikitty

2018/09/05 05:21

ご回答ありがとうございます。 いくつか方法を調べているとsampleformの名前をsampleform[0],sampleform[1],sampleform[2]...と自動で変更されるようなコードを書くのが最適なようなのですが、お答えいただいた方法だとsampleform(フォームのidの部分)だけが送信されませんか…?
yukihisa

2018/09/05 05:59

名前での指定もできますよ。 追記したのでご確認ください。 ただ、そもそもidは一意なので、idを使用したほうが良いような気はします。
hellomikitty

2018/09/05 12:13

無事に機能を実装出来ました。htmlでのidとJQueryでのidの繋がりでつまづいたのですが、自分で書いた<li>内のidの書き方がヒントとなりました。 見た目を崩さずにすぐ適用できましたのでBAとさせて頂きます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問