複数の選択ボックスを持つ HTML/PHP フォームがあります。フォームを送信するときに、jquery 関数を呼び出して、選択ボックスの変数とその他の変数を使用してクエリ文字列を作成し、このクエリ文字列を jQuery Tools Overlay に渡して外部から読み込みます。
オーバーレイは適切に読み込まれ、適切なクエリ文字列を含むページが表示されます。オーバーレイを閉じ、いくつかの選択ボックスの値を変更してフォームを再送信すると、問題が発生します。外部ページは引き続き読み込まれますが、クエリ文字列は更新されず、オーバーレイを開いた最初のインスタンスと同じままです。
以下は私のjqueryコードです:
$(function(){
$('#form').submit(function(){
. //code to get $str which contains the querystring Example $str="page='abc'&sub='xyz'"
.
$go='displaygroups.php?'+$str;
alert($go);//just to check if querystring is correct.
dispgrps($go);
return false;
});
function dispgrps($go){
$("#overlay").overlay({
// custom top position
top: 100,
// some mask tweaks suitable for facebox-looking dialogs
mask: {
color: '#d1eaf1',
loadSpeed: 10,
opacity: 0.9
},
// load it immediately after the construction
load: false,
onBeforeLoad: function() {
// grab wrapper element inside content
var wrap = this.getOverlay().find(".contentWrap");
// load the page specified in the trigger
wrap.load($go);
},
onClose:function(){
$('.contentWrap').html('Loading...');
}
});
$("#overlay").overlay().load();
}
});
初めて選択ボックスから page='1' で送信した場合、select の値を page='2' に変更してフォームを再送信しても、外部ページ displaygroups.php はページを 1 として反映します。
テストのために、displaygroups.php の値を単純にエコーしています。
if(isset($_GET['page'])) echo $_GET['page'];
オーバーレイCSS要素は
<div class="apple_overlay" id="overlay">
<!-- the external content is loaded inside this tag -->
<div class="contentWrap">Loading...</div>
</div>
助けてください。ありがとうございました。
編集: 理解できなかったので、コードを変更して、フォーム送信ではなくリンクにしました。それは今動作します。