Twitter BootStrap提交按钮仍然提交表单

时间:2014-04-09 20:54:28

标签: javascript jquery ajax twitter-bootstrap

我有以下Bootstrap提交按钮和onclick功能。

@Html.Bootstrap().SubmitButton().Text("Submit Final").Id("btnSubmitBottom").Style(ButtonStyle.Primary).HtmlAttributes(new { onclick = "return SubmitCheck('Submit Final')", name = "command", value = "Submit Final" }).Disabled(blnButtonsDisabled)

SubmitCheck有这个调用另一个函数的ajax代码并返回一个文本值。根据该值,我向用户显示一个确认框(true)或一个Bootbox模式(false)。

               $.ajax({
                    type: "GET",
                    url: "professionalismSubmitFinal",
                    data: { teacherID: CurrentTeacherID },
                    dataType: "text",
                    error: function (xhr, status, error) {
                    },
                    success: function (textVal) {
                        if (textVal == 'True') {
                            if (confirm("Are you sure you want to submit this as final?")) {
                                $('#IsPublic').val(true);
                                $('#IsFinal').val(true);
                                submitFormOkay = true;
                                return true;
                            }
                            else {
                                $('#IsFinal').val(false);
                                return false;
                            } //cancelled from modal
                        } else {
                            bootbox.alert("You cannot Submit until this has been Submitted as Final.");
                            return false;
                        }
                    }
                });

问题是当Ajax调用返回'False'时,bootbox警报会正确显示,但表单也会提交。

我做错了什么?我以为onclick = return SubmitCheck会阻止这种行为吗?

1 个答案:

答案 0 :(得分:2)

按钮点击事件上的event.preventDefault();可能会帮助您

$("#yourButton").click(function(event) {
    event.preventDefault();
});

希望我能正确理解你的问题。