简体   繁体   中英

How to fetch database values in html text boxes on button press without refreshing page in php?

I want to fetch database values into text boxes without refreshing page. with page refresh it goes fine but I don't want to refresh it.

My code is shown below.

PHP

 <?php include 'Connection.php'; $sql=mysqli_query($connect,"select * from `registration`"); while ($row=mysqli_fetch_array($sql)) { echo "<tr> <td>".$row['Emp_Code']."</td> <td>".$row['Full_Name']."</td> <td>".$row['Permanent_Address']."</td> <td>".$row['Mobile_No']."</td> <tr>"; if (isset($_POST['Fetchdetails'])) { $userid = $_POST['userid']; $fetchquery = mysqli_query($connect,"select * from `registration` where `Emp_Code` = '$userid'"); if (mysqli_num_rows($sql)>0) { while ($row=mysqli_fetch_array($fetchquery)) { $employeecode=$row['Emp_Code']; $fullname=$row['Full_Name']; $permanentaddress=$row['Permanent_Address']; $mobileno=$row['Mobile_No']; } } } } ?> 

My HTML Code is

 <html> <body> <div align="center" id="div"> <table width="400" border="1"> <tr align="right" style="background-color:#FFF;"> <td width="100">Permanent Address :&nbsp;</td> <td width="100">&nbsp; <input type="text" name="permanentaddress" id="permanentaddress" placeholder="Permanent Address" size="15" value="<?php echo $permanentaddress;?>"/>&nbsp;</td> </tr> <tr align="right" style="background-color:#FFF;"> <td width="100">Employee Code :&nbsp;</td> <td width="100">&nbsp;<input type="text" name="employeecode" id="employeecode" placeholder="Employee Code" size="15" value="<?php echo $employeecode;?>"/>&nbsp;</td> </tr> <tr align="right" style="background-color:#FFF;"> <td width="100">Full Name :&nbsp;</td> <td width="100">&nbsp;<input type="text" name="fullname" id="fullname" placeholder="Full Name" size="15" value="<?php echo $fullname;?>"/>&nbsp;</td> </tr> <tr align="right" style="background-color:#FFF;"> <td width="100">Mobile No. :&nbsp;</td> <td width="100">&nbsp;<input type="text" name="mobileno" id="mobileno" placeholder="Mobile No." size="15" value="<?php echo $mobileno;?>"/>&nbsp;</td> </tr> </table> </div> <br> <div align="center"> <input type="submit" name="Fetchdetails" value="Fetch Details" id="Fetchdetails" /> </div> </body> </html> 

How can I fetch values from database into text boxes without refreshing web page?

You can use AJAX to achieve the dynamic loading of the data.An Example would be:

$.ajax({
  url: "yourscript.php",
  cache: false,
  success: function(html){
    $("#results").append(html);
  }
});

where yourscript.php is your backend script, where the database calls would be executed and returned back to your success on successful request.

Please note that the data should be exchanged in a serialized format(for AJAX requests the most common approach is JSON).

You can achieve this by json. Try the following code.

PHP Code

<?php
    include 'Connection.php';
    $userid = $_GET['userid'];
    $fetchquery = mysqli_query($connect,"select * from `registration` where `Emp_Code` = '$userid'");

    if (mysqli_num_rows($sql)>0)
    {
        while ($row=mysqli_fetch_array($fetchquery))
        {
            $return['employeecode']=$row['Emp_Code'];
            $return['fullname']=$row['Full_Name'];
            $return['permanentaddress']=$row['Permanent_Address'];
            $return['mobileno']=$row['Mobile_No'];
        }
    }

    echo json_encode($return);

Javascript Code

$("#Fetchdetails").click(function(e) {
    e.preventDefault();
    var userId = $(this).attr('data-user-id');
    $.ajax({
        type: "GET",
        url : 'http://localhost/test/get_data.php?userid='+userId,
        dataType : 'json',
        success : function(response) {
            $('#permanentaddress').val(response.permanentaddress);
            $('#employeecode').val(response.employeecode);
            $('#fullname').val(response.fullname);
            $('#mobileno').val(response.mobileno);
        },
        error : function() {
            alert('There was an error');
        }
    });
});

Note : you have to replace following line with your php file url.

url : ' http://localhost/test/get_data.php

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM