使用AJAX从数据库中检索与用户输入匹配的数据

时间:2017-01-09 07:55:02

标签: php jquery mysql ajax

下面给出的是我的php代码,我想从数据库中提取与用户在文本字段中使用AJAX单击提交按钮时插入的文本相匹配的值。

以下是代码:

<!doctype html>
<html>
    <head>
        <title>Bootstrap Table</title>
        <link rel="stylesheet" href="bootstrap/bootstrap-4.0.0-alpha.6-dist/css/bootstrap.min.css">
        <script src="bootstrap/jquery-3.1.1.min.js"></script>
        <script src="bootstrap/bootstrap-4.0.0-alpha.6-dist/js/bootstrap.min.js"></script>
        <style>
            .container{margin:auto;}
        </style>
     </head>
     <body>
         <div class="container">
         </div>
         <div class='col-sm-3' style='margin-left:10%;'>
             <form class='navbar-form' action='' method='POST'>
                 <div class='input-group'>
                     <input type='text' class='form-control' placeholder='Search' name='srch-term' id='search_data'>
                     <div class='input-group-btn'>
                         <input class='btn btn-search' type='submit' id='search_button' style='cursor:pointer;'>Search</button>
                     </div>
                 </div>
             </form>
         </div>
         <div class="result">
         </div>
         <script id="source" language="javascript" type="text/javascript">
             $('#search_button').click(function() {
                 var search_data = 'input[name=srch-term]'.val();
                 $.ajax({
                     type: "POST",
                     url: 'bootstrap_table_db2.php',
                     data: {search: search_data},
                     success: function(result) {
                         for (var i in result) {
                             var row = result[i];
                             var employee_name = row[1];
                             var email = row[2];
                             var message = row[3];
                             var date = row[4];
                             result+= "<tr>" +
                                 "<td width='25%'>" + employee_name + "</td>" +
                                 "<td width='25%'>" + email + "</td>" +
                                 "<td width='25%'>" + message + "</td>" +
                                 "<td width='25%'>" + date + "</td>" +
                             "</tr>";                  
                         }     
                         $(".result").html(result);
                     }
                 });
             });
         </script>
    </body>
</html>

以下给出的是bootstrap_table_db2.php。

<?php 
mysql_connect("localhost", "root", "password") || die(mysql_error());
mysql_select_db("emp") || die(mysql_error());

if(isset($_POST['search']) && !empty($_POST['search'])) {
    $result2 = mysql_query("SELECT * FROM employee WHERE Employee_name = 'search'");
    $data2 = array();
    while ( $row = mysql_fetch_row($result2) ) {
        $data2[] = $row;
    }
    echo json_encode( $data2 );
}
?>

0 个答案:

没有答案