Question

大家好，我想了解更多关于ajax的信息我试过制作一个textarea，在这个文本被提交然后发送到数据库，我还做了一个按钮来显示数据库中的所有内容，这个工作。但是，当提交单击全部显示按钮时，它只会给出此值[object HTMLTextAreaElement]这是我的代码：

选择代码/显示

ToDo: <textarea width='200px' height='300px' id='todo'></textarea>

<p id='dbinfo'>Info goes here</p>

<button id='btn'> Send </button>

<button id='request'> Request </button>

<script>
    document.getElementById('btn').onclick = function()
    {
       var dbinfo = document.getElementById('todo').value;


        alert(todo); //Here it gives a object htmlcollection ?

        var xmlhttp = new XMLHttpRequest();

        xmlhttp.onreadystatechange = function()
        {
            alert(xmlhttp.readyState + " | " + xmlhttp.status);
            var text = xmlhttp.responseText;
            alert(text); 
            document.getElementById('dbinfo').innerHTML = text;
        }

        xmlhttp.open("POST", "linktodata", true);
        xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.send("todo=" +todo);

    }

    document.getElementById("request").onclick = function()
    {
        alert("event works");
        var xmlhttp = new XMLHttpRequest();

        xmlhttp.onreadystatechange = function()
        {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
            {
                var result = xmlhttp.responseText;
                alert(result);

                document.getElementById("dbinfo").innerHTML = result; 
            }            
        }  

        xmlhttp.open("POST", "linktorequest", true);
        xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.send();       
    }
</script>

数据代码

<?php
    $servername = "localhost";
    $username = "root";
    $password = "";
    $databasename = "blok-1-am1a";

    try
    {
        if (isset($_POST['todo']))
        {
            $connection = new PDO("mysql:host=".$servername.";dbname=".$databasename, $username, $password);
            $connection->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

            $statement = $connection->prepare("INSERT INTO `database` (`id`, `item`) VALUES (NULL, :item)");
            $statement->bindParam(':item', $_POST['todo']);

            $statement->execute();
        }

    }
    catch(PDOException $e)
    {
        echo "Error occured : ".$e->getMessage();


    }




    echo "Success";   
?>

请求代码

    <?php
        $servername = "localhost";
        $username = "root";
        $password = "";
        $databasename = "blok-1-am1a";

        try
        {
                $connection = new PDO("mysql:host=".$servername.";dbname=".$databasename, $username, $password);
                $connection->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

                $statement = $connection->prepare("SELECT * FROM `database` ");
                $statement->bindParam(':id', $id);


                $statement->execute();

                $result = $statement->setFetchMode(PDO::FETCH_ASSOC);

                $data = "";
                foreach($statement->fetchAll() as $key => $value)
                {
                        $data .= $value['id']." | ".$value['item']."<br>"; 
                }
        }
        catch(PDOException $e)
        {
                echo "Error occured: ".$e->getMessage();


        }

        echo $data;


?>

所以，无论我做什么，请求代码都有效，但在提交时我总是得到[object HTMLTextAreaElement]

Answer 1

愚蠢的我，这是一个非常的简单修复，我犯了错误，使用与<p>标签相同的var，因此修复程序很容易将其更改为todo，一切正常。

ToDo: <textarea width='200px' height='300px' id='todo'></textarea>

<p id='dbinfo'>Info goes here</p>

<button id='btn'> Send </button>

<button id='request'> Request </button>

<script>
    document.getElementById('btn').onclick = function()
    {
       var todo = document.getElementById('todo').value; //This needed to be changed into todo
    }

Ajax - 将textarea中的值插入数据库

1 个答案: