我正在一个 spring mvc servlet 项目中工作。 我有一个表单，其中有 2 个下拉菜单
假设 a) 月份: b) 年:
和一个提交按钮。
现在，当用户在两个下拉列表中选择值并单击“提交”时:控件将转到ControllerGenerateForm的onSubmit函数。 这里我做了一个数据库查询，并假设该查询给了我一个值，我将其存储在变量 x 中。 现在
if (x>0){
give a confirmation popup in UI ASKING user ->
Do you want to continue ?
if( userClicks Yes){
delete database value
continue with normal flow ;
}else{
return null ;
}
}
else{
continue with normal flow ;
save into database
}
请帮助我我应该如何创建此确认弹出窗口？此时控件位于 Controller 中。请参阅下面的代码框架。
代码骨架:
模型类:
public class Report {
private String month;
private String year;
//getter setter here
}
Controller 类:
public class GenerateForm extends BaseFormController {
// declaration of other class objects here
public void afterPropertiesSet() {
// assert calls here
super.afterPropertiesSet();
}
protected Object formBackingObject(HttpServletRequest request) throws Exception {
Report rp = (Report)createCommand();
return rp;
}
protected ModelAndView onSubmit(HttpServletRequest request, HttpServletResponse response, Object command, BindException errors)
throws Exception {
Report rp = (Report) command;
x = Call_to_Manager_Class(rp); // Manager class in turn call DAO class
if (x>0){
give a confirmation popup in UI ASKING user ->
Do you want to continue ?
if( userClicks Yes){
continue with normal flow ;
return new ModelAndView(getSuccessView());
}else{
return null ; // stay on same page
}
}
else{
continue with normal flow ;
return new ModelAndView(getSuccessView());
}
}
protected void initBinder(HttpServletRequest request,
ServletRequestDataBinder binder) throws Exception {
// binding done here
}
protected Map referenceData(HttpServletRequest request, Object command,
Errors errors) throws Exception {
//code related to reference data here
return data;
}
}
.xml 文件
<bean id="generatForm" class="com.web.controller.GenerateForm">
<property name="commandName" value="generate" />
<property name="commandClass" value="com.domain.Report" />
formview,success view and cancel view defined here similarly
</bean>
所有 bean 均已正确定义。控件将转到 onSubmit 函数。现在帮助我如何在 UI 中生成确认弹出窗口，要求用户按"is"或“否”并进行相应处理。
编辑: 我按照建议进行了以下更改，但表单也随 Ajax 请求一起提交，尽管我正确获取了 ajax 响应以及确认弹出窗口。如何防止表单提交，并且我希望仅当用户在确认弹出窗口中按“确定”时才提交表单。
$(document).ready(function() {
$('#myForm').submit(function (ev) {
console.log(1);
var year = $('#year').val();
var month = $('#month').val();
console.log(year);
console.log(month);
$.ajax({
type: "GET",
url: 'ActionServlet',
data: "year=" + year + "&month=" + month,
success: function (data) {
console.log(data);
$('#ajaxDiv').text(data);
var result= parseInt(data, 10);
if (result > 0) {
if(!confirm("you sure about that?")){
ev.preventDefault();
}
}
},error : function(e) {
alert('Error: ' + e);
}
});
});
});
编辑2 即使我在开始时编写 e.preventDefault()，AJAX 调用仍然是异步的，并且当 ajax 响应到达时，该函数流将结束。我尝试这样做。
$(document).ready(function() {
$('#myForm').submit(function (ev) {
ev.preventDefault();
console.log(1);
var year = $('#year').val();
var month = $('#month').val();
console.log(year);
console.log(month);
$.ajax({
type: "GET",
url: 'ActionServlet',
data: "year=" + year + "&month=" + month,
success: function (data) {
console.log(data);
$('#ajaxDiv').text(data);
var result= parseInt(data, 10);
if (result > 0) {
if(confirm("you sure about that?")){
//$('form').unbind('submit').submit();
$('#myForm').submit();
//$(this).unbind('submit').submit();
//$('#submit').click();
//$(this).trigger(submit);
//$(this).submit();
}
}
},error : function(e) {
alert('Error: ' + e);
}
});
console.log(2);
});
});
但是一旦 ev.preventDefault() 阻止表单提交，我就无法根据确认弹出窗口再次提交它。我尝试了很多方法。如果我删除我的 Ajax 调用
$(document).ready(function() {
$('#myForm').submit(function (ev) {
ev.preventDefault();
console.log(1);
var year = $('#year').val();
var month = $('#month').val();
console.log(year);
console.log(month);
$(this).submit();
console.log(2);
});
});
它进入递归调用。我可以使用某个变量来停止该递归，但是如果我将其放入确认中，它不会再次调用提交事件。
<div id="pageButtons">
<button name="_submit" id="submit" > Generate</button>
</div>
这是我的提交按钮配置。 请帮我解决最后一个问题。
编辑 3:
我尝试了最后一个代码建议，它给了我这个控制台:
Uncaught TypeError: form.submit is not a function !!
然后对于提交按钮，我删除了 id="submit"。之后，当我重新运行我的代码时，一旦我点击“提交”按钮，我的表单就会被提交，并且这个 jQuery 事件也会被触发。确认弹出窗口出现，如果我选择“确定”，则再次提交表单。那么为什么表单会自动提交？在用户单击确认弹出窗口中的“确定”之前？
最佳答案
您可以引入 javascript 来执行此操作。我将使用 jQuery 进行演示:
$("#your-form").submit(function(e) {
if(!confirm("you sure about that?")){
e.preventDefault();
}
});
单击提交按钮时将弹出一个弹出对话框。如果用户不想提交，这将阻止表单提交到 Controller 。
根据OP的评论进行更新:
$(document).ready(function() {
$('#myForm').submit(function (ev) {
ev.preventDefault(); // prevent default action witch is form-submit
var form = this; // avoid using jQuery's selection.
console.log(1);
var year = $('#year').val();
var month = $('#month').val();
console.log(year);
console.log(month);
$.ajax({
type: "GET",
url: 'ActionServlet',
data: "year=" + year + "&month=" + month,
success: function (data) {
console.log(data);
$('#ajaxDiv').text(data);
var result= parseInt(data, 10);
if (result > 0) {
if(confirm("you sure about that?")){ //if yes is clicked (negation is removed)
form.submit(); // this won't trigger the jQuery's submission, so it will not cause infinite loop.
}
}
},error : function(e) {
alert('Error: ' + e);
}
});
});
});
关于javascript - Spring MVC Servlet 响应对象中的确认弹出(是或否)和处理是和否事件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42031081/