Question

实际上，当我的表单与提交按钮一起提交时，我希望执行javascript代码来检查数据，如果没有填充数据，打开一个弹出对话框，所以不要执行绑定到的操作形式。

不幸的是，即使javascript位于页面顶部，也不会执行javascript代码。

你有解决方案吗？

谢谢

我的表格：

@using (Html.BeginForm("AddRecipe", "AddRecipe", FormMethod.Post, new { data_ajax = "false"}))
{
//Set of components to submit
//etc
<input type="submit" data-theme="b" id="addRecipeBtn" onclick="checkDatas();" value="Ajouter ma recette" />
}

我要执行的javascript代码：

<script>
    function checkDatas() {
            alert("ici");
            var ok = $("#fakeInput").val().length != 0 &&
                 $("#title").val().length != 0 &&
                 $("#cookingTime").val().length != 0 &&
                 $("#preparationTime").val().length != 0 &&
                 $("#ingredientListArea").val().length != 0 &&
                 $("#preparationArea").val().length != 0;

            if (!ok) {
                $("#popupDialog").popup("open");
            }
    }
</script>

Answer 1

我们需要更多信息来确定它是否或为何没有执行。

但是为了防止在验证失败时提交表单，请使用event.preventDefault（）。当然，这将阻止按钮的默认行为执行...在您的情况下，它将阻止表单提交。

function checkDatas(event) {
        alert("ici");
        var ok = $("#fakeInput").val().length != 0 &&
             $("#title").val().length != 0 &&
             $("#cookingTime").val().length != 0 &&
             $("#preparationTime").val().length != 0 &&
             $("#ingredientListArea").val().length != 0 &&
             $("#preparationArea").val().length != 0;

        if (!ok) {
            event.preventDefault();
            $("#popupDialog").popup("open");
        }
}

Answer 2

我认为您会发现您的表单提交覆盖了您的onclick处理程序，我认为捕获表单onsubmit事件会更可靠，因为按钮类型为＆＃34;提交＆＃34;

<form onsubmit="checkDatas()">

删除按钮的onclick事件。

Answer 3

您是否阻止了html表单提交的默认提交操作？

我认为你需要这样的东西：

function checkDatas(e) {
  e.preventDefault();
  //the rest of your code

<input type =“submit”/>不执行javascript代码

3 个答案: