如何通过使用PHP在一个文本框中输入输入来自动填充数据库中的所有输入字段？

XAMPP 是 Apache Friends 开发的一个免费开源的跨平台 Web 服务器解决方案，主要由 Apache HTTP Server、MySQL 数据库和用PHP编程语言编写的脚本解释器组成。 XAMPP 服务器帮助启动 Apache 和 MySQL 并将它们与PHP文件连接。

方法：我们需要使用 phpMyAdmin 工具在我们的 localhost 服务器中创建一个 MySQL 数据库。我们创建一个 HTML 表单，其中包含与PHP代码链接的输入字段。 PHP用于连接本地主机服务器并通过执行 MySQL 查询从数据库表中获取数据。参考 GFG 文章： PHP program to fetch data from localhost server database using XAMPP

考虑一下，我们有一个名为gfg的数据库，一个名为userdata的表。下面实现了从数据库中获取数据而无需重新加载页面或提交对应于一个字段的用户条目的其他输入字段。获取的数据显示在相同的 HTML 表单中。

创建数据库：

它是如何工作的？

XMLHttpRequest 对象可用于从 Web 服务器请求数据、更新网页而无需重新加载页面。您可以在向上键、向下键或第一个文本框模糊时触发调用。

示例：假设您在相应的输入字段中输入user_id 。如果user_id存在于数据库中，则 XMLHttpRequest 对象从数据库中获取与该user_id对应的first_name和last_name的值。它用您在响应中获得的数据替换其他输入文本框的innerHtml 。

执行步骤：

创建您的 HTML 网页

HTML

  

    
    
  
    
    
      
    
  
    
    

  

    
        GeeksForGeeks
        
            
                
                    User Id
                    
                
            
        
        
            
                
                    First Name:
                    
                
            
        
        
            
                
                    Last Name:
                    
                
            
        
    
    
  
        // onkeyup event will occur when the user 
        // release the key and calls the function
        // assigned to this event
        function GetDetail(str) {
            if (str.length == 0) {
                document.getElementById("first_name").value = "";
                document.getElementById("last_name").value = "";
                return;
            }
            else {
  
                // Creates a new XMLHttpRequest object
                var xmlhttp = new XMLHttpRequest();
                xmlhttp.onreadystatechange = function () {
  
                    // Defines a function to be called when
                    // the readyState property changes
                    if (this.readyState == 4 && 
                            this.status == 200) {
                          
                        // Typical action to be performed
                        // when the document is ready
                        var myObj = JSON.parse(this.responseText);
  
                        // Returns the response data as a
                        // string and store this array in
                        // a variable assign the value 
                        // received to first name input field
                          
                        document.getElementById
                            ("first_name").value = myObj[0];
                          
                        // Assign the value received to
                        // last name input field
                        document.getElementById(
                            "last_name").value = myObj[1];
                    }
                };
  
                // xhttp.open("GET", "filename", true);
                xmlhttp.open("GET", "gfg.php?user_id=" + str, true);
                  
                // Sends the request to the server
                xmlhttp.send();
            }
        }
    

  

2. 获取请求的user_id ，执行 MySQL 查询以从数据库表中获取该user_id的相应数据，并将数据以 JSON 形式打印回服务器 女朋友PHP文件。

输出：