Question

我有一个包含时间输入的表单（具体来说，是一个开始和结束时间）。当按下提交按钮时，它会进入一个php页面，将这些输入添加到数据库中。我想在允许表单提交之前检查一些事情。例如，我想确保开始时间早于（小于）结束时间。这是表格：

            Opens:
            <select name="starthour1">
                <option value="00">12</option>
                <option value="01">1</option>
                <option value="02">2</option>
                <option value="03">3</option>
                <option value="04">4</option>
                <option value="05">5</option>
                <option value="06">6</option>
                <option value="07">7</option>
                <option value="08">8</option>
                <option value="09">9</option>
                <option value="10">10</option>
                <option value="11">11</option>
            </select> : 
            <select name="startminute1">
                <option value="00">00</option>
                <option value="15">15</option>
                <option value="30">30</option>
                <option value="45">45</option>
                <option value="59">59</option>
            </select> 
            <select name="startwhen1">
                <option value="am">am</option>
                <option value="pm">pm</option>
            </select>

            Closes:
            <select name="endhour1">
                <option value="00">12</option>
                <option value="01">1</option>
                <option value="02">2</option>
                <option value="03">3</option>
                <option value="04">4</option>
                <option value="05">5</option>
                <option value="06">6</option>
                <option value="07">7</option>
                <option value="08">8</option>
                <option value="09">9</option>
                <option value="10">10</option>
                <option value="11">11</option>
            </select> : 
            <select name="endminute1">
                <option value="00">00</option>
                <option value="15">15</option>
                <option value="30">30</option>
                <option value="45">45</option>
                <option value="59">59</option>
            </select> 
            <select name="endwhen1">
                <option value="am">am</option>
                <option value="pm">pm</option>
            </select>

我找到了如何检查单个表单元素的javascript代码，但我无法弄清楚如何在不提交的情况下组合多个。在我的php页面中，我有以下代码：

$starthour1=$_POST['starthour1'];
$startminute1=$_POST['startminute1'];
$startwhen1=$_POST['startwhen1'];
$endhour1=$_POST['endhour1'];
$endminute1=$_POST['endminute1'];
$endwhen1=$_POST['endwhen1'];

$start_time1=$end_time1="";

    if($startwhen1=="pm"){
        $starthour1=$starthour1+12;
    }
    if($endwhen1=="pm"){
        $endhour1=$endhour1+12;
    }
    $start_time1=$starthour1.":".$startminute1.":00";
    $end_time1=$endhour1.":".$endminute1.":00";
    if($end_time1=="00:00:00"){
        $end_time1="23:59:00";
    }

echo "<br>start time is ".$start_time1;
echo "<br>end time is ".$end_time1;

$startnum=str_replace(":", "", $start_time1);
$endnum=str_replace(":", "", $end_time1);
if($endnum<$startnum){
    echo "<br>start time can't be later than end time!";
}
else{
   //add to database
}

但是，提交后检查这些内容没有意义。我想如果发现错误，我可以重定向回初始页面，但这看起来效率不高。

另外，我想也许我可以在页面上有一些用于检查有效性的表格的php。如果它验证，它然后发布到插入数据库的东西的PHP页面。这有意义吗？有可能吗？

有更好的解决方案吗？我想有一些我可以用javascript做的事情，但我无法弄明白。

另外，我想告知用户输入框旁边显示文本的无效输入。一旦剩下的工作正常，我应该能够解决这个问题。

感谢。

Answer 1

让表单的onSubmit（）或动作调用JavaScript函数，如下所示：

<form id="form" onSubmit="return doSubmit();" action="#">

然后，在doSubmit（）中，您实际上可以执行任何验证（只有实际提交表单，如果它们通过）

function doSubmit(){       
    if (validationsPass()) {
         $('#form').submit();
    }
}

要通知用户实际表单字段旁边的无效输入，您可以在每个字段旁边隐藏div或spans，并使用Javascript取消隐藏它们，如果它们未通过某种验证。

if(!fieldNotValid){
     $('#field-error').show(); //Or use effects like .highlight()
}

Answer 2

总是在PHP级别检查用户输入，无论你是否在客户端使用javascript检查它。

在javaScript中，我建议您使用js库，例如jQuery，其plugin用于表单验证。非常有用且易于实施。

在PHP级别，我建议您使用filter_var函数。非常有效。

Answer 3

请考虑将表单数据转换为DateTime个对象。这将使比较比单独摆弄每个部分更容易。它还将确保放入数据库的DateTime字符串可以安全插入，因为您将从format()方法获取字符串。

Answer 4

感谢您的帮助！我最终使用了：

<form action="add.php" onsubmit="return validate_form()" method="POST" name="addform">

使用：

function validate_form(){
        var f = document.addform;
        var start, end, starthour, endhour;
        var valid=true;
        ..........

            starthour=f.starthour1.value;
            endhour=f.endhour1.value;
            if(f.startwhen1.value=="pm"){
                var starthournum = starthour * 1;
                starthournum = starthournum+12;
                starthour = starthournum.toString();
            }
            if(f.endwhen1.value=="pm"){
                var endhournum = endhour * 1;
                starthournum = starthournum+12;
                starthour = starthournum.toString();
            }
            start = starthour+f.startminute1.value;
            end = endhour+f.endminute1.value;

            if(end=="0000"){
                end="2359";
            }

        if(end<start){
            alert("Start time can't be later than end time!");
            valid=false;
        }

        return valid;
}

在提交之前验证表单（比检查空字段更复杂）

4 个答案: