0

在下面的代码中，我有两种类型的验证。我使用 javascript 验证，当用户在课程文本输入中没有输入任何内容时，它会显示错误消息。

然后我有一个php验证，如果它不包含查询结果的行，该查询检查用户在课程文本输入中输入的课程中是否有任何评估，然后它会显示一条消息，说明没有找到评估。

我遇到的问题是，如果用户没有在“课程”文本输入中输入任何内容并且他们单击提交按钮，它会同时显示 javascript 验证和 php 验证。

这是不正确的，应该发生的是：

  • 如果用户在课程文本输入中没有写任何东西，那么它应该只显示 javascript 验证而不是 php 验证。

    • 如果用户在课程文本输入中写了一些东西并提交了表单，但是它无法从查询中找到任何结果，那么它应该只显示 php 验证。

我的问题是我需要在代码中进行哪些更改才能不能同时显示两个验证消息，并且在应该显示正确的验证消息时只显示它们？

换句话说，如果 javascript 验证失败，我如何阻止表单提交？然后很明显我如何确保如果javascript验证成功，那么它确实提交了表单。

Javascript

function validation() {

    var isDataValid = true;

    var courseTextO = document.getElementById("coursesDrop");

    var errModuleMsgO = document.getElementById("moduleAlert");

    if (courseTextO.value == "") {
        $('#targetdiv').hide();
        $('#assessmentForm').hide();
        $('#updateForm').hide();
        $('#submitupdatebtn').hide();
        errModuleMsgO.innerHTML = "Please Select a Course";
        isDataValid = false;
    } else {
        errModuleMsgO.innerHTML = "";
    }
    return isDataValid;

}​

PHP/HTML

<?php

// connect to the database
include('connect.php');


/* check connection */
if (mysqli_connect_errno()) {
    printf("Connect failed: %s\n", mysqli_connect_error());
    die();
}


$sql = "SELECT CourseId, CourseNo, CourseName FROM Course ORDER BY CourseId"; 

$sqlstmt=$mysqli->prepare($sql);

$sqlstmt->execute(); 

$sqlstmt->bind_result($dbCourseId, $dbCourseNo, $dbCourseName);

$courses = array(); // easier if you don't use generic names for data 

$courseHTML = "";  
$courseHTML .= '<input type="text" name="courses" id="coursesDrop" />' . PHP_EOL; 

?>

<form action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post" onsubmit="return validation();">
    <table>
        <tr>
            <th>Course: <?php echo $courseHTML; ?></th>
        </tr>
    </table>
    <p>
        <input id="moduleSubmit" type="submit" value="Submit Course and Module" name="moduleSubmit" />
    </p>
    <div id="moduleAlert"></div>
    <div id="targetdiv"></div>
</form>


<?php

if (isset($_POST['moduleSubmit'])) {    

    $sessionquery = "
    SELECT SessionId, SessionName, SessionDate, SessionTime, CourseId, SessionActive
    FROM Session
    WHERE (CourseId = ? AND SessionActive = ?)
    ORDER BY SessionName 
    ";

    $active = 1;

    $sessionqrystmt=$mysqli->prepare($sessionquery);
    // You only need to call bind_param once
    $sessionqrystmt->bind_param("si",$course, $active);
    // get result and assign variables (prefix with db)

    $sessionqrystmt->execute(); 

    $sessionqrystmt->bind_result($dbSessionId,$dbSessionName,$dbSessionDate,$dbSessionTime, $dbCourseId, $dbSessionActive);

    $sessionqrystmt->store_result();

    $sessionnum = $sessionqrystmt->num_rows();   

    if($sessionnum == 0) {
        echo "<p><span style='color: red'>Sorry, You have No Assessments under this Module</span></p>";
    } 
    else 
    { 
        echo "";
    }

    ...

}
?>
4

4 回答 4

2

尝试彻底停止提交事件（您正在遭受jQuery-itis，导致您滥用return false）：

method="post" onsubmit="return validation(event);">

在 JS 中：

function validation(e)
{
    //your checks
    if (isDataValid === false)
    {
        if (e.preventDefault)
        {
            e.preventDefault();
            e.stopPropagation();//VERY important
        }
        e.returnValue = false;
        e.cancelBubble = true;
    }
    return isDataValid;
}

要了解这两种方法的作用，请查看MDN必须说的内容
。要了解您在调用stopPropagation（或设置cancelBubble为true）时要停止的内容，我建议您使用quirksmode：事件顺序非常容易遵循，相当全面的描述，以及，以防万一：他们也介绍了 JS 事件。

更新
针对您的评论：

<?php

// connect to the database
include('connect.php');


/* check connection */
if (mysqli_connect_errno()) {
    printf("Connect failed: %s\n", mysqli_connect_error());
    die();
}


$sql = "SELECT CourseId, CourseNo, CourseName FROM Course ORDER BY CourseId"; 

$sqlstmt=$mysqli->prepare($sql);

$sqlstmt->execute(); 

$sqlstmt->bind_result($dbCourseId, $dbCourseNo, $dbCourseName);

$courses = array(); // easier if you don't use generic names for data 

$courseHTML = "";  
$courseHTML .= '<input type="text" name="courses" id="coursesDrop" />' . PHP_EOL; 
$pHTML = '&nbsp;';//default paragraph inner
if (isset($_POST['moduleSubmit'])) {    
        $sessionquery = "
    SELECT SessionId, SessionName, SessionDate, SessionTime, CourseId, SessionActive
    FROM Session
    WHERE (CourseId = ? AND SessionActive = ?)
    ORDER BY SessionName 
    ";
    $active = 1;
    $sessionqrystmt=$mysqli->prepare($sessionquery);
    // You only need to call bind_param once
    $sessionqrystmt->bind_param("si",$course, $active);
    // get result and assign variables (prefix with db)
    $sessionqrystmt->execute(); 
    $sessionqrystmt->bind_result($dbSessionId,$dbSessionName,$dbSessionDate,$dbSessionTime, $dbCourseId, $dbSessionActive);

    $sessionqrystmt->store_result();

    $sessionnum = $sessionqrystmt->num_rows();   

    if($sessionnum == 0) {//error msg?
        $pHTML =  "<span style='color: red'>Sorry, You have No Assessments under this Module</span>";
    } 
}

?>
    <p id="warnings"><?php echo $pHTML;?></p><!-- echo the innerHTML created server-side -->
<form id="myForm" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post" onsubmit="return validation(event);">
    <table>
        <tr>
            <th>Course: <?php echo $courseHTML; ?></th>
        </tr>
    </table>
    <p>
        <input id="moduleSubmit" type="submit" value="Submit Course and Module" name="moduleSubmit" />
    </p>
    <div id="moduleAlert"></div>
    <div id="targetdiv"></div>
</form>

调整 JS - 因为您使用的是 jQuery，所以我将使用它，因为在 IE 中委派更改事件很痛苦：

$('#myForm').delegate('change','select',function()
{
    $('#warnings').html('');//clears current warnings
});

或者，更有效但更复杂的方法：

$('#myForm').delegate('change','select',(function(warnings)
{
    return function()
    {
        warnings.html('');
    };
}($('#warnings'))));

别忘了把它包起来$(document).ready(function(){[here]});

于 2012-11-28T15:36:24.440 回答
1

我相信action并且onsubmit都会触发，即使return falseonsubmit 函数中有一个。我建议删除该操作并将表单 POST 移动到 Javascript 函数，以便在成功的前端验证时调用。

于 2012-11-28T15:14:51.440 回答
0

我认为这是因为您缺少 .value

var courseTextO = document.getElementById("coursesDrop").value;
// add line of debug
alert(courseText0);
于 2012-11-28T15:11:53.183 回答
0

它必须同时返回，因为您的操作是调用 php 验证，并且您还有一个调用 javascript 验证的 onsubmit。

发生的情况是，您的代码首先执行 javascript，然后执行 php.ini。

解决问题的最佳方法是在 from-tag 中完全不设置任何操作，并根据结果在 javascript 验证函数中设置表单的操作。

于 2012-11-28T15:12:37.617 回答