Javascript和JSP的2个按钮和提交

Question

还不是真正的javascript爱好者，希望你能帮我解决这个可能的新手问题。我正试图用第二个按钮来扩展现有的工作jsp页面。它的类型是提交。我发现了一些半模拟的问题和答案，但我就是不明白。我为这个例子添加的按钮是button.doebi。它们在浏览器的屏幕上显示得很好。

在我的jsp文件中：

<td colspan="4" align="right">
<button id="sysBlaBlacControlSearchSubmit" type="submit" value="normal" class="standardButton">
<bean:message key="button.search" />
</button>
<button id="sysBlaBlaControlSearchReset" type="reset" class="standardButton">
<bean:message key="button.reset" />
</button>
<button id="sysBlaBlaControlSearchDoebi" type="submit" name="doebi" value="doebi" class="standardButton">
<bean:message key="button.doebi" />
</button>
</td>

在我的js文件中：

$('#SysBlaBlaControlSearchForm').submit(function(e) {
e.preventDefault();
sendAjaxForm('SysBlaBlaSearch', '/sysblabla/sysBlaBlaSearch.do', 'searchSysblabla', function (result) {
refreshTableData(systematicControlSearchResultTable, result);
sendAjaxGET('/blablabla/blablabla.do', 'getblablablaSearchWarning', undefined, function (result) {
$('div#SysBlaBlaBlaSearchWarning').text(result.value);
});
});
});  

现在我想看看开关按钮被按下了，因为很明显，这两个按钮都在.submit 中处理

在这里找到的例子中，比如if (request.getParameter("xxx"))，我喜欢在js文件中注入这样的代码：

$('#SysBlaBlaControlSearchForm').submit(function(e) {
if (request.getParameter("doebi") == null) {
e.preventDefault();
console.warn("NOT inside doebi click");
sendAjaxForm('SysBlaBlaSearch', '/sysblabla/sysBlaBlaSearch.do', 'searchSysblabla', function (result) {
...
} else {
console.warn("inside doebi click");
}   

但问题是编译器没有找到"请求"。我不知道请求指向哪里。

当我在浏览器中执行代码并进行检查时，我在请求中遇到了一个错误。我不得不用blabla来掩饰真正的methode名字，很抱歉。

Answer 1

您可以使用click事件来点击当前按钮，然后在submit上检查点击了哪个按钮，并执行与该按钮相关的进一步操作。

演示代码：

var $submit = null;
var $button = $('#SysBlaBlaControlSearchForm').find('button');
$('#SysBlaBlaControlSearchForm').submit(function(e) {
e.preventDefault();
//checking the value of button click
if ($submit.name == "normal") {
//normal buton is clicked
console.warn(" inside normal click");
//put your ajax code here
} else if ($submit.name == "doebi") {
//inside doebii
console.warn("inside doebi click");
//put your ajax code here
} else {
console.warn("reset button clicked");
}
});
//when button is clicked
$button.click(function(event) {
//putting current button clicked reference in variable $submit
$submit = this;
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="SysBlaBlaControlSearchForm">
<button id="sysBlaBlacControlSearchSubmit" type="submit" name="normal" class="standardButton">
<bean:message key="button.search" />Normal
</button>
<button id="sysBlaBlaControlSearchReset" type="reset" class="standardButton">
<bean:message key="button.reset" /> Reset
</button>
<button id="sysBlaBlaControlSearchDoebi" type="submit" name="doebi" namename="doebi" class="standardButton">
<bean:message key="button.doebi" />Doebi
</button>
</form>