如何在php中使用jQuery在页面上显示错误消息?

时间:2015-03-31 22:15:02

标签: javascript php jquery html css

我有一个带有提交按钮的HTML表单,当用户单击提交按钮而不在表单字段中输入任何内容时,该表单将在页面上发布状态。我希望php在同一页面上回显一个非常简单的错误消息。在这种情况下,“此状态更新似乎为空。请写一些东西......”

简而言之......我的需求可以在Facebook上看到;当您单击帖子而不在状态字段中写入内容时,屏幕中间会弹出一个div,并显示一些错误消息。我认为这可以用jQuery完成。我尽我所能。拜托,有人可以帮助我实现这个目标吗?

下面是我的PHP脚本,我希望在else条件下写入操作 - 我的代码的第42行。

<?php 




//setting connection variables
$hostname = "localhost";
$username= "root";
$password ="";
$db= "cemembers";

$_SESSION['Email'] = "FirstName"; $_SESSION['FirstName'] = 1; 

$globalstatus = $_POST['globalstatus'];
$post_name =$_POST["postname"];

//connect to database
$mysqli_db = new mysqli( $hostname, $username, $password, $db);


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

if(!empty($globalstatus) ){

    $sql='INSERT INTO user_post(user_post,post_name) VALUES 
(?,?)';

$requery = $mysqli_db->prepare($sql);
$requery->bind_param("ss", $post_name, $globalstatus);


    if ($requery->execute()){

        header("location:go.php");

        }
    }
    else{

        $post_fail = "<div class='postfail'>"."Post field appears to be blank. Please Write something"."</div>";
        echo $post_fail;
        echo header("location:go.php");
        };



?>

1 个答案:

答案 0 :(得分:0)

如果您在使用JavaScript / jQuery提交之前检查(正式)正确,您会更容易:

$(".errpopup").click(function() {
    $(this).remove();
});

function toBeCalledOnSubmit() {
    if (!$("#commentbox").val()) {
        $("#commentbox").addClass("submiterr");
        //You can also use alert(); instead of the following line
        $(body).append("<div class=\"errpopup\">Put error message here</div");
        return false;
    else {
        $("#commentbox").removeClass("submiterr");
        return true;
    }
}

和CSS:

.submiterr {
    border: 2px solid red;
}
.errpopup {
    position: absolute;
    z-index: 42; /* higher than all the other z-indices */
    width: 300px; height: 150px; /* or what you like*/
    top: auto; bottom: auto; left: auto; right: auto;
}