フォームを持つモーダル ダイアログがあります。ユーザーがダイアログの送信ボタンをクリックすると、フォームが送信され、正常に動作します。しかし問題は、フォームを送信した後、ダイアログが閉じず、更新後にデータのみがグリッドに追加されることです。ここに私のダイアログボックスがあります
$(document).ready(function(){
$("#dialog-form").dialog({
autoOpen : false,
height : 400,
width : 800,
modal : true,
title: "Currency Details",
close : function() {
$(this).dialog("close");
}
});
});
ここに私の ajaxSubmit があります
function saveCurrencyAjax() {
var str = $("#enumCurrency").serialize();
$.ajax({
type : "POST",
url : "../currency/saveEnumCurrency.action",
data : str,
success : function(response) {alert("success call");
$('#dialog-form').dialog('close');
$('#currencyGrid').flexReload();
},
error : function(e) {
alert('Error: ' + e);
}
});
};
これは私のコントローラーです
@RequestMapping( value="/currency/saveEnumCurrency.action", method=RequestMethod.POST)
public ModelAndView saveEnumCurrency(@ModelAttribute EnumCurrency enumCurrency, Errors errors) throws Exception {
ModelAndView mvc = null;
try{
List<EnumCurrency> enumCurrencys = new ArrayList<EnumCurrency>();
enumCurrencys.add(enumCurrency);
List<EnumCurrency> enumCurrencyList =enumCurrencyService.create(enumCurrencys);
mvc = new ModelAndView("setup/enumCurrencyList");
} catch (Exception e) {
e.printStackTrace();
}
return mvc;
}
私のjspページはこちらです....
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Currency </title>
<link rel="stylesheet" type="text/css" media="all"
href="<c:url value='/styles/style.css'/>" />
<link rel="stylesheet" type="text/css" media="all"
href="<c:url value='/scripts/jquery/css/jquery.ui.all.css'/>" />
<link rel="stylesheet" type="text/css" media="all"
href="<c:url value='/scripts/jquery/css/flexigrid.css'/>" />
<link rel="stylesheet" type="text/css" media="all"
href="<c:url value='/scripts/jquery/css/flexigrid.pack.css'/>" />
<script type="text/javascript" src="<c:url value='/scripts/script.js'/>"></script>
<script type="text/javascript"
src="<c:url value='/scripts/jquery/flexigrid.js'/>"></script>
<script type="text/javascript"
src="<c:url value='/scripts/jquery/flexigrid.pack.js'/>"></script>
<script type="text/javascript"
src="<c:url value='/scripts/jquery/jquery-ui.js'/>"></script>
<script type="text/javascript"
src="<c:url value='/scripts/jquery/jquery.ui.core.js'/>"></script>
<script type="text/javascript"
src="<c:url value='/scripts/jquery/jquery.validate.js'/>"></script>
<script src="../scripts/setup/enumCurrencyList.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#dialog-form").dialog({
autoOpen : false,
height : 400,
width : 800,
modal : true,
title: "Currency Details",
close : function() {alert("close....jsp");
$(this).dialog("close");
}
});
});
function submitForm() {
validation part is here........
};
function saveCurrencyAjax() {
var str = $("#enumCurrency").serialize();
$.ajax({
type : "POST",
url : "../currency/saveEnumCurrency.action",
data : str,
success : function(response) {alert("success call");
$('#dialog-form').dialog('close');
alert("after close.....jsp");
$('#currencyGrid').flexReload();
alert("gridcall");
},
error : function(e) {
alert('Error: ' + e);
}
});
};
</script>
</head>
<body>
<div id="dialog-form" ></div>
<fieldset>
<div id="currencyGrid" />
</fieldset>
</body>
</html>
事前に感謝します。