您好!欢迎来到知速网

用PHP 与jQuery Ajax 存取资料库

  • 时间:2021-12-30 08:05 编辑: 来源: 阅读:89
  • 扫一扫,手机访问
摘要:首先在MySQL 建一个资料表pid_valid_date, 根据网友问题描述, 需要两个栏位 :pid : varchar(10) 储存身分证valid_date : varchar(10) 储存YYYY-MM-DD 格式之有效日期建资料表的SQL 指令如下 :---- 资料表结构`pid_valid_date`--CREATE TABLE `pid_valid_date` (  `pid` varchar(10) COLL

首先在MySQL 建一个资料表pid_valid_date, 根据网友问题描述, 需要两个栏位 :

  • pid : varchar(10) 储存身分证

  • valid_date : varchar(10) 储存YYYY-MM-DD 格式之有效日期


建资料表的SQL 指令如下 :

--

-- 资料表结构`pid_valid_date`

--

CREATE TABLE `pid_valid_date` (

  `pid` varchar(10) COLLATE utf8mb4_unicode_ci NOT NULL,

  `valid_date` varchar(10) COLLATE utf8mb4_unicode_ci NOT NULL

) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

建好后输入如下测试资料, SQL 指令为 :

--

-- 倾印资料表的资料`pid_valid_date`

--

INSERT INTO `pid_valid_date` (`pid`, `valid_date`) VALUES

('A123456789', '2021-02-13'),

('Q123456789', '2025-11-21'),

('S123456789', '2023-05-29'),

('T123456789', '2020-12-31');

mysql_pid_valid_date_test.jpg

下面是只用HTML5+jQuery 的范例: 


<!DOCTYPE html>

<html>

  <head>

    <title></title>

    <meta charset="utf-8">

    <meta http-equiv="cache-control" content="no-cache">

    <meta name="viewport" content="width=device-width,initial-scale=1">

    <script src="http://code.jquery.com/jquery-3.5.1.min.js"></script>

  </head>

  <body>

    <select id="pid" name="pid">

      <option value="">请选择身分证号码</option>

    </select>

    <input type="text" id="valid_date" name="valid_date">

    <button id="update">更新</button>

    <script>

      $(document).ready(function(){ 

        $.get({

          url: "http://tony1966.xyz/test/jquerytest/get_pid.php",

          dataType: "html",

          success: function(res) {

            $("#pid").append(res);

            }

          });

        $('#pid').on('change', function() {

          $.get({

            url: "http://tony1966.xyz/test/jquerytest/get_valid_date.php",

            dataType: "html",

            data: {pid: this.value},

            success: function(res) {

              $("#valid_date").val(res);

              }

            });

          });

        $("#update").on("click", function(e){

          $.get({

            url: "http://tony1966.xyz/test/jquerytest/update_valid_date.php",

            dataType: "text",

            data: {pid: $("#pid").val(), valid_date: $("#valid_date").val()},

            success: function(res) {alert(res);}

            });          

          });

        });

    </script>

  </body>

</html>

此例网页中有三个元件: 一个用来选择身分证字号的下拉式选单, 一个用来显示有效期限的单行文字栏位, 以及一个更新按钮. 下拉式选单初始仅有提示用的文字选项, 身分证选项是透过Ajax 向后端程式get_pid.php 从资料库取得, 此程式内容如下: 

<?php

header('Content-Type: text/html;charset=UTF-8');

$host="mysql.hostinger.co.uk"; 

$username="u137801000_test"; 

$password="a123456"; 

$database="u137801000_test"; 

$conn=mysql_connect($host, $username, $password); 

mysql_query("SET NAMES 'utf8'"); 

mysql_select_db($database, $conn); 

$SQL="SELECT pid FROM `pid_valid_date`"; 

$result=mysql_query($SQL, $conn); 

$arr=array(); 

for ($i=0; $i < mysql_numrows($result); $i++) { 

     $row=mysql_fetch_array($result); 

     $option="<option value='".$row["pid"]."'>".$row["pid"]."</option>";

     $arr[$i]=$option; 

     } 

echo implode(" ", $arr);  

?>

此PHP 程式会搜寻资料表pid_valid_date 的pid 栏位, 并在碟带回圈中制作option 元素组成的HTML 回应字串, 此字串会在回应给前端网页时传入append() 方法插入预设的option 后面. 结果如下: 

pid_valid_date_1.jpg

选取身分证字号会产生change 事件并携带pid 参数向后端程式 get_valid_date.php 提出Ajax 请求, 此程式会搜寻pid_valid_date 资料表中该pid 的valid_date 栏位值后传回, 前端网页收到回应后将其填入valid_date 单行文字栏位中, 程式内容如下 :

<?php

header('Content-Type: text/html;charset=UTF-8');

$host="mysql.hostinger.co.uk"; 

$username="u137801000_test"; 

$password="a123456"; 

$database="u137801000_test"; 

$conn=mysql_connect($host, $username, $password); 

mysql_query("SET NAMES 'utf8'"); 

mysql_select_db($database, $conn); 

$SQL="SELECT * FROM `pid_valid_date` WHERE pid='".$_REQUEST["pid"]."'"; 

$result=mysql_query($SQL, $conn);  

$row=mysql_fetch_array($result); 

echo $row["valid_date"]; 

?>

使用者可修改valid_date 后按更新钮, 这会向后端程式update_valid_date.php 提出Ajax 请求(携带pid 与valid_date 参数), 此程式会更新pid 的valid_date 栏位值, 成功传回OK, 失败传回NG, 前端网页收到回应后用alert() 显示结果, 此程式内容如下: 

<?php

header('Content-Type: text/html;charset=UTF-8');

$host="mysql.hostinger.co.uk"; 

$username="u137801000_test"; 

$password="a123456"; 

$database="u137801000_test"; 

$conn=mysql_connect($host, $username, $password); 

mysql_query("SET NAMES 'utf8'"); 

mysql_select_db($database, $conn); 

$SQL="UPDATE `pid_valid_date` SET valid_date='".$_REQUEST["valid_date"]."' ".

     "WHERE pid='".$_REQUEST["pid"]."'"; 

$result=mysql_query($SQL, $conn);  

if (mysqli_error($conn)) {$msg="NG";}

else {$msg="OK";}

echo $msg; 

?>


  • 全部评论(0)
上一篇:已是第一篇内容
下一篇:CodeCharge 做一个一对多的AUDI
最新发布的资讯信息
【计算机/互联网|】用PHP 与jQuery Ajax 存取资料库(2021-12-30 08:05)
【计算机/互联网|】CodeCharge 做一个一对多的AUDI(2021-12-30 08:03)
【计算机/互联网|】ScriptCase的多语系处理(2021-12-30 08:02)
【技术支持|】ScriptCase 的按钮php 与Ajax 有何不同(2021-12-30 08:01)
【技术支持|】php7.3->使用OpenSSL来代替Mcrypt加解密的function制作方法(2021-12-24 08:24)
【计算机/互联网|】个人存储百度网盘源码的安装方法(2021-11-09 08:38)
【计算机/互联网|】小红书账号交易要找靠谱的平台。(2021-09-18 10:28)
【计算机/互联网|】小红书账号转让要注意的流程(2021-09-17 10:56)
【技术支持|】认识__get及__set,并看看Laravel如何使用它们(2021-09-12 15:36)
【技术支持|】解决网站服务器遇到 Allowed memory exhausted 问题(2021-09-12 15:32)
联系我们
工作时间:8:00-23:30
客服 QQ:93613971
邮 箱:admin#zhisu.com
法律顾问:聊城瀚诚律师事务所