フレンド 機能は次のとおりです。ユーザーがボタンをクリックすると、チェックボックスを含むポップアップ ページが開き、ユーザーがチェックボックスから値を選択すると、ポップアップで送信がクリックされ、それらの値が親ページに表示されます。私が直面している問題は、ユーザーがポップアップ値を送信すると、親ページで値が無効になり、ページがリロードされることです。
ポップアップのコードは
<a href="#" id="pop" >Select Language</a>
<br />
<form action= "" id ="overlay_form" method= "post" style="display:none">
<h3>Select Language</h3>
<br /><br />
<input type="checkbox" name="countryCheckbox[]" value="English" /> English <br/>
<input type="checkbox" name="countryCheckbox[]" value="French" /> French <br/>
<input type="checkbox" name="countryCheckbox[]" value="Norwagian" /> Norwagian <br/>
<input type="checkbox" name="countryCheckbox[]" value="Swedish" /> Swedish <br/>
<input type="checkbox" name="countryCheckbox[]" value="Hindi" /> Hindi <br/>
<input type="checkbox" name="countryCheckbox[]" value="Chinese" /> Chinese <br/>
<br /><br />
<div class="row-fluid grid-footer">
<div class="span8"></div>
<div class="span5">
<input class="btn btn-primary btn-primary-secondary" type="submit" name="saveDepartmentBtn" id="saveOrg" value="Submit" onclick="this.disabled='disabled'; document.getElementById('saveOrg').disabled='disable';this.form.submit(); ">
</div>
<div class="span1">
<button class="btn btn-secondary" type="button" cancel-action="/admin/role/list" ><spring:message code="common.cancel" /></button>
</div>
</div>
</form>
<p id="text">
The selected Languages are:
</p>
そしてJqueryコードは
$(document).ready(function(){
$('#saveOrg').click(function(){
if(!$("#saveOrg").hasClass("notTwice")) {
alert('Inside new 2');
$("#saveOrg").addClass("notTwice");
var arr = [];
alert('Inside 3');
$('input:checkbox:checked').each(function(){
$("#text").text($("#text").text() + $(this).val()+ " ,");
});
alert('Inside 5');
$('#overlay_form').fadeOut(500);
return false;
}
});
});
チェックされた値は、alert('Inside 5'); の後に消えます。上記のコードで。 そして最後のcss部分は
<style>
#overlay_form{
position: absolute;
border: 5px solid gray;
padding: 10px;
background: white;
width: 270px;
height: 380px;
}
#pop{
display: block;
border: 1px solid gray;
width: 65px;
text-align: center;
padding: 6px;
border-radius: 5px;
text-decoration: none;
margin: 0 auto;
}
</style>
ポップアップから選択した値を保持するための回避策を提案してください。