Php 使用jQuery插入数据库并获得反馈_Php_Jquery_Html_Mysql

Php 使用jQuery插入数据库并获得反馈

php jquery html mysql

Php 使用jQuery插入数据库并获得反馈,php,jquery,html,mysql,Php,Jquery,Html,Mysql,我在服务器上有一个MySQL数据库。这就是我的HTML在数据库中存储东西的方式 var shV = localStorage.getItem("PersName"); var idV = localStorage.getItem("codeQR"); var posV = localStorage.getItem("position"); window.open('http://*.es/insert.php?sh='+shV+'&id='+idV+'&pos='+posV,

我在服务器上有一个MySQL数据库。这就是我的HTML在数据库中存储东西的方式

var shV = localStorage.getItem("PersName");
var idV = localStorage.getItem("codeQR");
var posV = localStorage.getItem("position");

window.open('http://*.es/insert.php?sh='+shV+'&id='+idV+'&pos='+posV,
'blank','location=no,hidden=yes,closebuttoncaption=Done,toolbar=no');

Insert.PHP文件

<?php
try {
$pdo = new PDO('mysql:host=mysql.**');
    $shortV = $_GET['sh'];
    $idnumberV = $_GET['id'];
    $positionV = $_GET['pos'];
$statement = $pdo->prepare("INSERT INTO idtabelle (short, idnumber, position) 
VALUES (:sh, :id, :pos)");
$statement->execute(array('sh' => $shortV, 'id' => $idnumberV, 'pos' => $positionV));  
echo "$idnumberV eingetragen"; 
    $pdo = null;
    } catch (PDOException $e) {
    die($e -> getMessage());
    }
?>

我想在不打开新页面或显示插入Url的情况下存储它们。在数据库中输入数据后，我希望只有当它们真正在数据库中时，才会收到类似“您的数据已输入”的反馈

在另一个HTML中，我通过在文本字段中输入ID来搜索位置。就像我想要的那样。并给出了反馈

Search.html

<form id="search" name="search" method="post">
    <input type="text" id="txt1" name="search_input">
  <button type="submit" class="btn btn-info" id="bt1">Get Position</button>
  </form>
    <div id="div1">Testing</div>
      <div id="div2"> Here </div>
  <script>
            $(document).ready(function(){
                $("#search").on("submit", function(e){
                    e.preventDefault();
                    $.post("/search3.php", $("#search").serialize(), function(d){
                        if (!$.trim(d)){   
                            alert("Nothing found !");   }
                        else{   
                            $("#div1").empty().append(d);
                            localStorage.setItem("PosGet",d);   
                            document.getElementById("div2").innerHTML=(d);
                                }
                        });
                    });
            });


获得位置
测试
在这里
$（文档）.ready（函数（）{
$（“#搜索”）。关于（“提交”，函数（e）{
e、 预防默认值（）；
$.post（“/search3.php”，$（“#search”）.serialize（），函数（d）{
如果（！$.trim（d））{
警报（“未找到任何内容！”；}
否则{
$（“#div1”）.empty（）.append（d）；
setItem（“PosGet”，d）；
document.getElementById（“div2”）.innerHTML=（d）；
}
});
});
});

Search.PHP文件

<?php
 try {
$pdo = new PDO('mysql:host=mysql.**');
    $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, short 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());
    }
?>

我如何才能做到插入像上面页面中的搜索一样，并带有反馈？

谢谢。

在您的第一个示例中，代码运行一个新窗口（但隐藏），因此您没有机会从初始窗口获得结果。您应该像提供的第二个示例中那样进行操作

如果您可以使用jQuery（示例如下），那么您可以使用jQuery.ajax（）函数

您还可以进行成功和失败回调。例如：

$.ajax({
  method: "POST",
  url: "some.php",
  data: { name: "John", location: "Boston" },
  function(){
      console.log("success");
  },
  function(){
      console.log("error")
  }
})


桌子{
宽度：100%；
边界塌陷：塌陷；
}
表，td，th{
边框：1px纯黑；
填充物：5px；
}
th{文本对齐：左；}

Html

<html>
<head>
<script>
function showUser(str) {
    if (str == "") {
        document.getElementById("txtHint").innerHTML = "";
        return;
    } else {
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                document.getElementById("txtHint").innerHTML = this.responseText;
            }
        };
        xmlhttp.open("GET","getuser.php?q="+str,true);
        xmlhttp.send();
    }
}
</script>
</head>
<body>

<form>
<select name="users" onchange="showUser(this.value)">
  <option value="">Select a person:</option>
  <option value="1">Peter Griffin</option>
  <option value="2">Lois Griffin</option>
  <option value="3">Joseph Swanson</option>
  <option value="4">Glenn Quagmire</option>
  </select>
</form>
<br>
<div id="txtHint"><b>Person info will be listed here...</b></div>

</body>
</html>


函数showUser（str）{
如果（str==“”）{
document.getElementById（“txtHint”）.innerHTML=“”；
返回；
}否则{
if（window.XMLHttpRequest）{
//IE7+、Firefox、Chrome、Opera、Safari的代码
xmlhttp=新的XMLHttpRequest（）；
}否则{
//IE6、IE5的代码
xmlhttp=新的ActiveXObject（“Microsoft.xmlhttp”）；
}
xmlhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
document.getElementById（“txtHint”）.innerHTML=this.responseText；
}
};
open（“GET”、“getuser.php？q=“+str，true”）；
xmlhttp.send（）；
}
}
选择一个人：
彼得·格里芬
路易斯·格里芬
约瑟夫·斯旺森
格伦泥潭


人员信息将在此处列出。。。

这是一个使用PostgreSQL的简单示例，让您了解基本知识。如果您需要更多帮助，开始编程，如果您有任何困难，请咨询社区

在上面的示例中，当用户在上面的下拉列表中选择一个人时，将执行一个名为“showUser（）”的函数

该函数由onchange事件触发

代码说明：

首先，检查是否选择了人员。如果未选择任何人（str==“”），请清除txtHint的内容并退出该函数。如果选择了一个人，请执行以下操作：

1）创建XMLHttpRequest对象

2）创建服务器响应就绪时要执行的函数

3）将请求发送到服务器上的文件

请注意，一个参数（q）被添加到URL（带有下拉列表的内容）

上面JavaScript调用的服务器上的页面是一个名为“getuser.PHP”的PHP文件

“getuser.php”中的源代码在PostgreSQL数据库上运行preaper execute，并在HTML表中返回结果

说明：当查询从JavaScript发送到PHP文件时，会发生以下情况：

1） PHP打开到PostgreSQL服务器的连接

2）找到了正确的人

3）将创建一个HTML表格，填充数据并发送回“txtHint”占位符。

您也可以像在选择步骤中一样使用ajax

<!DOCTYPE html>
<html>
<head>
<style>
table {
    width: 100%;
    border-collapse: collapse;
}

table, td, th {
    border: 1px solid black;
    padding: 5px;
}

th {text-align: left;}
</style>
</head>
<body>

<?php
$q = intval($_GET['q']);

$dbconn = pg_connect('localhost','peter','abc123','my_db');
if (!$con) {
    die('Could not connect');
}



$query = "SELECT * FROM user WHERE id = $1";
$result = pg_prepare($dbconn, "my_query", $query);

$data = array($q);
$result = pg_execute($dbconn, "my_query", $data);


echo "<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
<th>Hometown</th>
<th>Job</th>
</tr>";
while($row = pg_fetch_row($result)) {
    echo "<tr>";
    echo "<td>" . $row[0] . "</td>";
    echo "<td>" . $row[1] . "</td>";
    echo "<td>" . $row[2] . "</td>";
    echo "<td>" . $row[3] . "</td>";
    echo "<td>" . $row[4] . "</td>";
    echo "</tr>";
}
echo "</table>";
pg_close($dbconn);
?>
</body>
</html>

<html>
<head>
<script>
function showUser(str) {
    if (str == "") {
        document.getElementById("txtHint").innerHTML = "";
        return;
    } else {
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                document.getElementById("txtHint").innerHTML = this.responseText;
            }
        };
        xmlhttp.open("GET","getuser.php?q="+str,true);
        xmlhttp.send();
    }
}
</script>
</head>
<body>

<form>
<select name="users" onchange="showUser(this.value)">
  <option value="">Select a person:</option>
  <option value="1">Peter Griffin</option>
  <option value="2">Lois Griffin</option>
  <option value="3">Joseph Swanson</option>
  <option value="4">Glenn Quagmire</option>
  </select>
</form>
<br>
<div id="txtHint"><b>Person info will be listed here...</b></div>

</body>
</html>