AJAX结果评估

Question

我有一个html，我想在提交之前对其进行验证，并且我在验证中使用了ajax，我希望它提交表格，如果ajax结果为"确定"并且要显示警报，如果其他情况下，结果绝对是"确定"，但它没有提交表格，请帮助！

！

---

这是我使用的HTML代码

 <form action="newplan.php" onsubmit="return validateplan();" method="post">
                      <TABLE style="font-size: small;width: 100%;background:  #7cdafe;">
    <Tr>
    <td>
        Planer Name <input type="text" disabled value="<?=$me['name']?>">
    </TD>
    <td>
        Title
        <input type="text" id="title" name="title" placeholder="Title this plan">
             </td>
             <tD>
        <LABEL for="month">Month</LABEL>
        <SELECT id="month" name="month">
            <OPTION value="0">Choose</OPTION>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
            <option value="9">9</option>
            <option value="10">10</option>
            <option value="11">11</option>
            <option value="12">12</option>
        </SELECT>
        <LABEL for="week">Week</LABEL>
        <select name="week" id="week">
            <OPTION>Choose</OPTION>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
        </select>
    </td>
</tR>
</TABLE>
<div>
         <LABEL for="subdate">Submition Date</LABEL><input type="text" id="subdate"         name="subdate" value='<?=date("F d,Y")?>'></input>
         <input type="submit" name="go" value="Save">
         <input type="test" id="clar" value="0">
         <input type="submit" name="go" value="Submit">
         </div>
         </form>

---

这是JS，我已经链接了页面头的jQuery

JS

---

<script type="text/javascript">
    function validateplan(){
        var title = $("#title").val();
        var month = $("#week").val();
        var subdate = $("#subdate").val();
        var week = $("#week").val();
        $.ajax({
            url: 'ajax/plan_validate.php',
            data: {title: title,month: month,subdate: subdate,week: week},
            success: function(data){
                if (data == 'OK'){
                    alert("We are OK so far");
                    return true;
                }
                else
                {
                    alert(data);
                }
            },
            error: function(){
               alert("There is something wrong");
            }
        });
        return false;
    }
 </script>

Answer 1

ajax是异步的，因此在服务器端验证之前，它返回false。那就是为什么您的表格未提交的原因。

而不是<form action="newplan.php" onsubmit="return validateplan();" method="post">

您可以在AJAX成功函数中提交表单，否则显示警报；尝试这个 ：像这样更改您的表格标签和

<form action="newplan.php" method="post" id="myform">

在AJAX成功函数中调用提交

$( "#myform" ).submit();

Answer 2

这是您的代码看起来要做的：

_{请澄清一下这些假设中的任何一个是不正确的。}

1. 用户填写表格，单击提交。
2. javaScript validateplan()函数称为。
3. validateplan()将带有表单数据的AJAX请求发送给ajax/plan_validate.php
4. plan_validate.php处理输入并检查错误。返回响应。
5. 您的成功函数正在检查数据是否等于裸字符串"确定"。
6. 您的数据什么也没做。

plan_validate.php应该做什么？只是错误检查表格吗？还是实际上用数据做点什么？你说：

结果绝对是"确定"，但没有提交表格。

您是否看到alert("We are OK so far");？如果是，那么您将表格提交，但仅向plan_validate.php提交，而不是向您的表单newplan.php提交表单。如果您期望将表格提交给newplan.php，则需要程序来执行此操作。

您的代码在表单标签中说onsubmit="return validateplan();"告诉浏览器使用validateplan()的返回值来决定是否提交action属性。

validateplan()功能的最后一行是return false;，因此validateplan始终返回false，并且表单永远不会提交。当您从成功函数内部进行return true;时，您仅从该匿名函数， validateplan function >

如果您想在从plan_validate.php获得确定响应后将表格提交给newplan.php，则需要在success: function中添加该表格。

这个问题是弄清楚如何完成所需的工作的合理起点。由于您已经引用了jQuery（至少这就是我认为您的$呼叫的目的），因此您可以查看[ .ON（）][2] and [ .submit（）`] 3个助手，以适用于某些快捷方式，可以与JQuery一起使用。

注意：您可能不想将validateplan()更改为return true;，因为无论plan_validate.php的响应如何，这总是将您的表格提交给newplan.php。这是因为您的Ajax是异步的，并且在通过validateplan()的其余部分之外执行。

注2：如果要将表格更改为没有onsubmit=validateplan()的情况，而没有return，则某些浏览器会忽略validateplan的返回值并始终提交表单。只是要注意的东西。