-1

我有一个html表格：

<form method="POST" action="MyServletName1" enctype="multipart/form-data">
    //Other html code
    <input type="submit" value="Next" onclick="return Check();"/>
</form>

检查功能如下，它进行简单的验证以检查用户是否在文本字段中输入了 id，如果用户在文本字段中输入了值，那么我将返回 true，它将提交上述表单：

function Check()
{
    var myID = document.getElementById('myID').value;
    if(myID!=null && myID.length>0)
        return true;
    else
    {
        alert('Please enter ID!');
        return false;
    }
}

上述功能工作正常。现在我想在数据库中检查这个 ID 是否已经存在。如果 ID 存在，那么我不想提交表单。

所以现在 Check() 函数看起来像：

function Check()
{
    var myID = document.getElementById('myID').value;
    if(myID!=null && myID.length>0)
    {
        $.post('MyServletName2',{ action: "checkID",myID:myID}).done(function(data) 
        {
            if(data=="OK")
                return true;
            else
            {
                return false;
                alert(data);
            }
        }
    }
    else
    {
        alert('Please enter ID!');
        return false;
    }
}

现在，如果用户输入 ID，那么它正在向 servlet 发送请求，但是现在即使 servlet 返回了其他值，也提交了表单OK。

任何建议将不胜感激。

4

3 回答 3

1

尝试这样的事情

    $.ajax({
        url: 'MyServletName2',
        data : { action: "checkID",myID:myID},
        async: false,
        }).done(function() {
            if(data=="OK"){
                   return true;
            }
               else
               {
                   return false;

               }
        });

默认情况下，所有请求都是异步发送的（即默认设置为true）。如果您需要同步请求，请将 async 选项设置为 false。

您的表单是在您的 ajax 获得响应之前提交的，因此它不会对其进行验证。

于 2013-11-08T05:29:46.763 回答
1

发布是异步的。因此，在异步发布完成之前，您的方法不会返回 false。因此，您的表单帖子正常执行。

您可能需要执行其他操作，例如将输入提交更改为按钮。然后，您的回调按钮会发布跳过检查的表单。就像是...

<form method="POST" action="MyServletName1" enctype="multipart/form-data" id="form1">
    //Other html code
    <input type="button" value="Next" onclick="Check();"/>
</form>

请注意，我更改了按钮，在表单中添加了一个 idform1并更改了 onlick（删除了返回）。

下一步是处理您的帖子。这是一个简单的改变。

function Check()
{
    var myID = document.getElementById('myID').value;
    if(myID!=null && myID.length>0)
    {
        $.post('MyServletName2',{ action: "checkID",myID:myID}).done(function(data) 
        {
            if(data=="OK")
                document.getElementById('form1').submit();
            else
            {
                alert(data);
            }
        }
    }
    else
    {
        alert('Please enter ID!');
    }
}

请注意，唯一真正的变化是删除return false \ true并添加

document.getElementById('form1').submit();

手动提交表单。现在这只是一个选项，希望对您有所帮助。

于 2013-11-08T05:31:02.903 回答
1 
function Check()
{
    var myID = document.getElementById('myID').value;
    var valid = false;
    if (myID != null && myID.length > 0)
    {
        $.ajax({
            url: 'MyServletName2',
            data: {action: "checkID", myID: myID},
            async: false,
            success: function() {
                if (data == "OK") {
                    valid =  true;
                }
                else
                {
                   valid = false;
                }
            }
        });
        return valid;
    }
    else
    {
        alert('Please enter ID!');
        return false;
    }
}
于 2013-11-08T05:33:15.203 回答