使用javascript / jquery / php

Question

我目前正在创建一个网页，我希望用户根据他们选择的结果查看不同的数据库结果。结果将通过按钮或通过手动输入到textarea中的查询来选择。

我有与数据库的连接以及在外部PHP脚本中设置的所有内容，我目前使用＆＃34; require＆＃34;链接到我的网站。 在这个PHP脚本中，我有一个＆＃34;查询＆＃34;变量。

我希望此变量取决于用户输入的任何值。

我认为这应该可以使用某种$ query = $ POST [＆＃39;条目＆＃39;]以及javascript中的某种Ajax调用？我只是不知道整个事情应该如何组合在一起。

如果我们假设我的菜单和容器看起来像这样，那么getData.php就是$ query变量所在的位置，以及返回数据库数据的内容。

<div id="menu">
    <textarea class="queryText" name="queryText" placeholder="Enter the query..."></textarea>
    <input class="menuButt" type="button" value="Submit" onclick="JavaScript:ChangeDivVal();"/>

</div>
<div id="container">
    <?php
        require 'getData.php';
    ?>
</div>

这是一张图片，如果这有助于我解释我想做什么。

我非常感谢我能得到的任何帮助！

//安布罗斯

Answer 1

有一些简洁的机制可以将textarea（查询字符串）的输入传递给php，并将数据库输出返回给javascript。然后，您可以轻松地将其附加到您希望的任何dom节点。

我个人用jQuery做事，因为它非常方便。您可能希望将加载函数用于简单目的：

$( document ).ready(function() {
    $('#querySubmitButton').click(function (evt)
    {
        evt.preventDefault(); // stops the submit taking place
        var myQuery = $('#queryText').val(); // get the query value

        // load data received from php script into the dom container
        $('#container').load('getData.php', { query:myQuery, anotherVar:null });
    });
});

load函数只是将所需脚本输出的所有内容加载到给定的domnode中。您可以在第二个参数中添加任意数量的参数，甚至可以使用回调来在加载后执行更多js。 有关详细信息，请参阅http://api.jquery.com/load/。

哦，顺便说一句，我把你的html更改为：

<div id="menu">
    <textarea id="queryText" name="queryText" placeholder="Enter the query..."></textarea>
    <input id="querySubmitButton" type="button" value="Submit"/>
</div>
<div id="container"></div>

在你的getData.php（我假设生成普通的html）中你可以使用php的$ _POST var来获取查询。

$query = $_POST['query'];