【问题标题】:Problems With Dynamic Form Using JavaScript and PHP使用 JavaScript 和 PHP 的动态表单的问题
【发布时间】:2011-10-24 12:54:34
【问题描述】:

我在处理这些文件时遇到了问题,看看你们是否可以帮助我:) 我收到一个需要对象的错误..

index.php

<?php 
  //Start session
  session_start(); 
  //Require functions.php
  require("functions.php");
  //Require posts.php
  require("posts.php");
?>
<html>
<body>
<title>Log Into Booking System</title>
  <?php 
    //Call function to display login
    displayLogin();
  ?>
</body>
</html>

posts.php

<?php
if (isset($_POST['sublogin']))
{
    //Check that all fields were typed in and are not null
    if(!$_POST['user'] || !$_POST['pass'])
    {
        //Call function to display error
        printText("Please make sure all required fields are filled in.");
    }
    else
    {
        //Here is some database checking
    }
}
?>

functions.php

<?php   
function displayLogin()
{
    //Break php, then return to PHP
    ?> 
    <h1>Login</h1>
    <form action="" method="post">
    <table align="left" border="0" cellspacing="0" cellpadding="3">
    <tr><td>Username:</td><td><input type="text" name="user" maxlength="30"></td></tr>
    <tr><td>Password:</td><td><input type="password" name="pass" maxlength="30"></td></tr>
    <tr><td><div id='error'></div></td></tr>
    <tr><td colspan="2" align="right"><input type="submit" name="sublogin" value="Login"></td></tr> 
    </table>    
    </form>
    <?
}

function printText($txtmsg)
{
    ?>      
    <!-- Set up the displayError javascript function -->
    <script type="text/javascript">
        function displayError()
        {                   
            document.getElementById('error').innerHTML = <?echo $txtmsg;?>;
        }
    </script>
    <!-- Call function to Display the error -->
    <script type="text/javascript">
        displayError();
    </script>
    <?
}
?>

我很确定

document.getElementById('error').innerHTML

给我带来了问题,我认为这可能与我如何称呼它有关,就像它不知道它在寻找什么..

非常感谢大家,

珍妮

编辑:这是 jQuerybeast 尝试做的粘贴,http://pastebin.com/jj0RVMAd

解决方案:谁知道这么简单?您必须更改 post.php 所需位置的顺序,并确保您不在 functions.php 中调用 javascript 函数,因为这将执行表单上方的 javascript 并因此给出空对象错误。

Index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html>
<head>
<title>Log Into Booking System</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<?php 
//Start session
session_start(); 
//Require functions.php
require("functions.php");
?>
</head>
<body>
<?php 
//Call function to display login
displayLogin(); 
//Require posts.php
require("posts.php");
?>
</body>
</html>

posts.php

<?php
//POST: Main login page
if (isset($_POST['sublogin']))
{
    //Display error if feilds are not filled in
    if(!$_POST['user'] || !$_POST['pass'])
    {
        echo '<script type="text/javascript">document.getElementById("error").innerHTML = "Please make sure all required fields are filled in.";</script>';
        return false;
    }
    else
    {
        //Some database minipulation here....
        //...
        if ($_POST['user'] != $databaseUsername)
        {
        echo '<script type="text/javascript">document.getElementById("error").innerHTML = "Please make sure your username is correct.";</script>';
        return false;
        }
        elseif($_POST['pass'] != $databasePassword)
        {
        echo '<script type="text/javascript">document.getElementById("error").innerHTML = "Please make sure your password is correct.";</script>';
        return false;           
        }
    }
    return true;
}

?>

functions.php

<?php


//Function: Display main.php login
function displayLogin()
{

    //Break php, then return to PHP
    ?> 
    <div style="float: left; padding: 10px; width:20%;">
    <fieldset>
    <legend>
    <h1>Login</h1>
    </legend>
    <form name = "mainlogin" action="" method="post">
    <table align="left" border="0" cellspacing="0" cellpadding="3">
    <tr><td>Username:</td><td><input type="text" name="user" maxlength="30"></td></tr>
    <tr><td>Password:</td><td><input type="password" name="pass" maxlength="30"></td></tr>
    <tr><td colspan="2" align="left"><input type="checkbox" name="remember">
    <font size="2">Remember username and password</td></tr> 
    <tr><td><div id="error"></div></tr><td>
    <tr><td colspan="2" align="right"><input type="submit" name="sublogin" value="Login"></td></tr> 
    </table>    
    </form>
    </fieldset>
    </div>

    <?php

}

?>

【问题讨论】:

    标签: php javascript html forms error-handling


    【解决方案1】:

    我注意到的第一件事是 Javascript 函数中的 PHP 回显字符串周围没有引号。

    变化:

        function displayError()
        {                   
            document.getElementById('error').innerHTML = <?echo $txtmsg;?>;
        }
    

    收件人:

        function displayError()
        {                   
            document.getElementById('error').innerHTML = "<?echo $txtmsg;?>";
        }
    

    【讨论】:

    • 我现在收到这个错误:'document.getElementById(...)' is null or not an object
    • 如果在运行 javascript 时页面上不存在 ID 为“error”的&lt;div&gt; 元素,则会发生这种情况。另一个潜在问题是 require("posts.php"); 在 HTML 文档的 &lt;head&gt; 之前执行,并且它有效地输出 &lt;script&gt; 部分(当某些 POST 值不存在时)。这可能会产生一些意想不到的后果。
    • 我想如果你遵循我的代码,你会在代码运行时看到
      存在,因为我只有在点击提交后才会收到错误(那是当我调用 javascript 函数时)。跨度>
    【解决方案2】:

    我认为问题是由functions.php引起的,因为您以相反的方式打开和关闭PHP。

    Instead of ?>  <?
    Try: <?    ?>
    

    这是什么:

    function displayLogin()
    {
        //Break php, then return to PHP
        <?
        <h1>Login</h1>
        <form action="" method="post">
        <table align="left" border="0" cellspacing="0" cellpadding="3">
        <tr><td>Username:</td><td><input type="text" name="user" maxlength="30"></td></tr>
        <tr><td>Password:</td><td><input type="password" name="pass" maxlength="30"></td></tr>
        <tr><td><div id='error'></div></td></tr>
        <tr><td colspan="2" align="right"><input type="submit" name="sublogin" value="Login"></td></tr> 
        </table>    
        </form>
        ?>
    }
    
    
    function printText($txtmsg)
    {
        <?      
        <!-- Set up the displayError javascript function -->
        <script type="text/javascript">
            function displayError()
            {                   
                document.getElementById('error').innerHTML = <?echo $txtmsg;?>;
            }
        </script>
        <!-- Call function to Display the error -->
        <script type="text/javascript">
            displayError();
        </script>
        ?>
    }
    

    【讨论】:

    • 他的评论 //Break php, then return to PHP 表明这是故意的。他正在离开 PHP,然后重新进入。
    • 对不起,我忘了在这篇文章中添加 php 标签(我傻了)。也许你能找到另一个问题?
    • @vascowhite 啊,明白你的意思。抱歉,发布的代码不清楚。
    • @xoxo-jenny-shu-oxox 试试 而不是 。有些服务器没有启用短标签。
    • @jQuerybeast 短标签在我的服务器上工作,我以前用过
    【解决方案3】:

    改变

     document.getElementById('error').innerHTML = <?echo $txtmsg;?>;
    

    document.getElementById('error').innerHTML = '<?= $txtmsg; ?>';
    

    document.getElementById('error').innerHTML = '<?php echo $txtmsg; ?>';
    

    【讨论】:

    • 我得到的新错误是 'document.getElementById(...)' is null or not an object
    • 我认为您需要停止提交表单才能让您的 JS 正常工作。将onSubmit="return" 添加到您的提交按钮,看看是否有什么不同。
    【解决方案4】:

    使用这个

    document.getElementById('error').innerHTML = '<?php echo $txtmsg; ?>';
    

    您的服务器上似乎没有启用短标签。请确定。 或者总是使用&lt;?php ?&gt; 而不是&lt;? ?&gt;

    【讨论】:

    • 短标签可以工作,我在其他地方用过它们就好了。我现在收到'document.getElementById(...)' is null or not an object 错误。
    • 如果你得到一个空值是因为文档还没有通过脚本。尝试将所有 JS 放入 function docloaded() { 并将 更改为
    • @jQuerybeast 现在我得到两个错误,一旦页面完成加载,这些错误就是预期的对象。当我单击按钮时为空(我猜同样的错误?)
    • 你能更新一下你的问题或调整一下你目前拥有的东西吗?
    • @jQuerybeast 我在 index.php 上所做的只是将 替换为 。在functions.php 中,我创建了一个javascript 部分docloaded(),其中包含javascript 函数displayError(){document.getelement....}。 displayError() 的调用仍在 printText()
    猜你喜欢
    • 2011-10-04
    • 2011-05-03
    • 2011-03-30
    • 1970-01-01
    • 2010-10-28
    • 2015-07-18
    • 2012-08-24
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多