【问题标题】:Get the Echo from PHP into a Div with Ajax使用 Ajax 将 PHP 中的 Echo 放入 Div
【发布时间】:2017-04-09 21:17:30
【问题描述】:

我在服务器上有一个简单的数据库(用于测试)。 这个 PHP 文件在服务器上,当我打开 URL 时可以工作。 (http://**.com/search.php?id=abc) Echo 回馈“30”

<?php
$pdo = new PDO('mysql:host=*com; dbname=*test1', '*', '*');
$idV = $_GET['id']; 
$statement = $pdo->prepare("SELECT position FROM idtabelle WHERE idnumber = :idV");
$statement->bindParam(':idV', $idV);
$statement->execute();
 while ($row = $statement->fetch(PDO::FETCH_ASSOC))
{ $posV = $row['position']; };
echo $posV;
?>

HTML 仅用于测试

<input type="text" id="txt1">
<button type="button" class="btn btn-info" id= "bt1">Info Button</button>
<div id= "div1"> </div>

我希望当我在文本字段中输入代码并按下按钮时,来自 PHP 的 Echo 会显示在 Div 中。 我知道我应该使用 Ajax GET,但我尝试了很多东西,但没有任何效果。 你能帮我吗?

编辑:最后一次尝试:https://jsfiddle.net/qz0yn5fx/

    <input type="text" id="txt1">
  <button type="button" class="btn btn-info" id="bt1">Info Button</button>
      <div id="div1">Here </div> 

      <script>
          $(document).ready(function() {

    $("#bt1").click(function() {                
      $.ajax({   
         //create an ajax request to load_page.php
        type: "GET",
        url: "http://**.com/search.php?id=a10 ",             
        dataType: "html",   //expect html to be returned      

        success: function(response){                    
            $("#div1").html(response); 
            alert(response);
        }

    });
});
});
      </script>

最好不要看下一个小提琴,我只是复制了所有第一次尝试:

https://jsfiddle.net/jqv1ecpj/

【问题讨论】:

  • 你需要命名你的输入并使用一个表单,如果你想使用纯 php,你需要一个 href。
  • 如果您能展示您的尝试,我们可以提供帮助。
  • 相关:Using Jquery Ajax to retrieve data from Mysql。尽管使用您已经拥有的 PDO 准备语句,但后端比您在该链接中找到的 mysql_*() 函数更安全。
  • 我发布了我尝试的小提琴。
  • 在处理数据库时,您应该先清理输入,然后再分配给 php 中的变量。

标签: javascript php html mysql ajax


【解决方案1】:

您可以只使用简单的 POST 请求而不是 GET 请求。

  <form id="search" name="search" method="post">
    <input type="text" id="txt1" name="search_input">
  <button type="submit" class="btn btn-info" id="bt1">Info Button</button>
  </form>
    <div id="div1">Here </div>

$(document).ready(function(){
    $("#search").on("submit", function(e){
    e.preventDefault();
    $.post("/search.php", $("#search").serialize(), function(d){
        $("#div1").empty().append(d);
    });
  });
});

然后在您的 PHP 中,(不要忘记使用 try{}catch{}):

    try {
    $pdo = new PDO('mysql:host=*com; dbname=*test1', '*', '*');
    $pdo -> setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    $idV = (isset($_POST['search_input'])) ? $idV = $_POST['search_input'] : exit('The search was empty'); 
    $statement = $pdo->prepare("SELECT position FROM idtabelle WHERE idnumber = ?");
    $statement->bindParam(1, $idV);
    $statement->execute();
    foreach($statement -> fetchAll() as $row){
    echo $row['position'];
    }

    $pdo = null;
    } catch (PDOException $e) {
    die($e -> getMessage());
    }

我认为这应该可行(尚未测试)。如果它不起作用,请告诉我,我会测试并纠正它。

【讨论】:

  • 当我在服务器上打开 html 文档并输入一个数字然后按下按钮它只是刷新页面。与按下按钮相同。什么都没发生。当我直接使用 ?id=abc 打开 php 时,它总是说“搜索空”我的其他 php 文件以这种方式工作
  • 是的。如果你使用我的例子,它只会监听一个发布请求。如果您希望它运行,即使您直接转到文件并将 ?id=abc 附加到地址,您可以将简写的 if 语句更改为:$idV = (isset($_POST['search_input'])) ? $idV = $_POST['search_input'] : $idV = $_GET['id']; 但是,出于安全原因,我不建议这样做.
  • 我的错,我在服务器上使用本地 html 文件和 php 进行了尝试。将相同的html文件上传到服务器后,它就可以工作了。所以我猜没有办法在本地测试它?
  • 您可以使用名为 WAMP 的东西在本地测试 PHP 代码 -> wampserver.com/en 。使用 WAMP,您可以运行“本地服务器”并在那里测试您的 PHP,这也让您可以在 phpmyadmin (MySQL) 中玩耍
  • 我知道,但我想过在服务器上安装 DB 和 php,并在本地使用 php 文件的完整 url 的 html 文件
猜你喜欢
  • 1970-01-01
  • 2014-06-05
  • 1970-01-01
  • 2016-03-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多