Ajaxで更新した部分から、Ajax呼び元の部分の値を操作する方法
例えば検索条件を親ページで設定し、検索結果をAjaxで表示させるとします。
<div>
<form name="isform" method="post">
検索条件をここに設定し、検索をAjaxで実行します
<input type="text" class="joken" />
<button>検索</button>
</form>
<div id="result">
Ajaxで検索結果をここに表示します
<a href="javascript:funcXXX();">ここから検索条件を変更</a>
※ここにJavaScriptを記述
</div>
</div>
Ajaxでresultを表示させ、そこから呼び元画面の検索条件を変更したいときは、resultのブロックのなかにJavaScriptを書き、親要素の指定にparent.documentを指定することで、呼び元の部分の要素を操作することができます。
<script>
function funcXXX() {
//呼び元ページのinputの値を変更する場合
$('.joken',parent.document).val("新しい値");
//呼び元のフォームの値を送信する場合
$('form[name="isform"]',parent.document).submit();
}
</script>
この記事が気に入ったらサポートをしてみませんか?