別<form>タグの値を取得する方法

Question

お世話になっております。
PHP/HTML初心者です。

//検索フォーム
<form name="form" method=POST action="{{$SCRIPT_NAME}}">
	<input type=hidden name=name value="検索">
        //検索パラメータ
        <input type="text" name="aaa" value="ユーザー入力値">
 　　　　<input type="checkbox" name="bbb" id="ccc" value="ユーザー入力値">					
</form>

//ダウンロードフォーム
<form name="form" method=POST action="{{$SCRIPT_NAME}}">
	<input type=hidden name=name value="ダウンロード">
        //ダウンロードパラメータ
</form>

上記、ダウンロードフォーム内のダウンロードパラメータに、
検索フォーム内の検索パラメータをそのまま渡したいと考えております。
（どちらもパラメータを引数にSQLを発行し結果を表示/ダウンロードいたします）

ここで疑問なのですが、
別form内のパラメータを引き継ぐことは可能なのでしょうか？

拙い日本語で申し訳ございません。
ご教示をお願いできますと幸いです。

Answer 1

引き継ぐというより２つのformから別のフォームを作るとよいです。

Comments

[yambejp]

<?PHP
print_r($_POST);
?>
<script>
window.addEventListener('DOMContentLoaded', ()=>{
document.querySelector('#f2').addEventListener('submit',e=>{
e.preventDefault();
var fd1=new FormData(document.querySelector('#f1'));
var fd2=new FormData(document.querySelector('#f2'));
var form=Object.assign(document.createElement('form'),{method:e.target.getAttribute('method')||"get"});
form.addEventListener('formdata',ev=>{
([...fd1].concat([...fd2])).forEach(([name,value])=>{
ev.formData.append(name,value);
});
});
document.querySelector('body').appendChild(form);
form.submit();
});
});
</script>
<form name="form" method="POST" id="f1">
<input type="hidden" name="name" value="検索">
<input type="text" name="aaa" value="ユーザー入力値">
<input type="checkbox" name="bbb" id="ccc" value="ユーザー入力値">
<input type="submit" value="send">
</form>

<form name="form" method="POST" id="f2">
<input type="hidden" name="name" value="ダウンロード">
<input type="submit" value="send">
</form>

[yambejp]

上記例のようにname=nameが競合する場合、PHPでは
あとから指定されたf2側の方が優先されます

[rrr_s]

yambejp様

ご回答ありがとうございます。
こちら見落としてしまっており、再度の質問をさせていただいていた次第です。

上記ですが、無知で大変恐縮なのですが、
「2つのformから別のformをつくる」とは、
JavaScriptを用いて何を行っているのでしょうか‥？

[yambejp]

f1の要素をf2に引き継ぐのではなく
f1とf2から新しいformをつくって送るという意味です
あとは挙動があっているかどうかで判断してください

[yambejp]

すみません、よく考えたら追加しないでもできました

<?PHP
print_r($_POST);
?>
<script>
window.addEventListener('DOMContentLoaded', ()=>{
document.querySelector('#f2').addEventListener('submit',e=>{
e.preventDefault();
var f=e.target;
var fd1=new FormData(document.querySelector('#f1'));
var fd2=new FormData(document.querySelector('#f2'));
f.addEventListener('formdata',e=>{
[[...fd1],[...fd2]].flat().forEach(([name,value])=>{
e.formData.append(name,value);
});
});
f.submit();
});
});
</script>
<form name="form" method="POST" id="f1">
<input type="hidden" name="name" value="検索">
<input type="text" name="aaa" value="ユーザー入力値">
<input type="checkbox" name="bbb" id="ccc" value="ユーザー入力値">
<input type="submit" value="send">
</form>

<form name="form" method="POST" id="f2">
<input type="hidden" name="name" value="ダウンロード">
<input type="submit" value="send">
</form>