PHP和Javascript和SQL创建表单输入框

时间:2018-02-08 10:03:22

标签: javascript php jquery html

我花了很多时间试图弄清楚如何使用SQLi数据库中的值来获取自动完成输入框。我可以获得显示的值,但我不知道如何将其变成可以处理输入的html表单。

我需要找到一种方法来获取要分配给ID的值。我不太确定怎么说。

这是我的剧本,

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Autocomplete - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
  $( function() {
    var availableTags = [
      <?php
        $servername = "localhost";
        $username = "root";
        $password = "";
        $dbname = "timedRun";
        $conn = new mysqli($servername, $username, $password, $dbname);

        $sql = "select firstName, lastName from students";
        $result = $conn->query($sql);
        $selected_name="";

        if ($result->num_rows > 0) { 
            while ($row = $result->fetch_assoc()){
                echo "\"".$row['firstName']." ".$row['lastName']."\" ,";
            };
        };
      ?>
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  } );
  </script>
</head>
<body>
<?php
echo "test";
?>
<div class="ui-widget">
  <label for="tags">Tags: </label>
  <input id="tags">
</div>


</body>
</html>

提前致谢。

1 个答案:

答案 0 :(得分:0)

问题是你实际上并没有创建表单,只是回显输出。 以下是使用所需值显示表单的简单第一步。 小心使用表单封装和所有php开始和结束标记,以及开始和结束表单的位置。这一切对于它是否能按预期发挥作用起着重要作用。

 <!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Autocomplete - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
  $( function() {
    var availableTags = [
      <?php
        $servername = "localhost";
        $username = "root";
        $password = "";
        $dbname = "timedRun";
        $conn = new mysqli($servername, $username, $password, $dbname);

        $sql = "select firstName, lastName from students";
        $result = $conn->query($sql);
        $selected_name="";

        if ($result->num_rows > 0) { 
            ?>
            <form>
            <?php
            while ($row = $result->fetch_assoc()){
            ?>
            First name:<br>
            <input type="text" name="firstname" placeholder="<?php echo $row['firstName']; ?>"><br>
            Last name:<br>
            <input type="text" name="lastname" placeholder="<?php echo $row['lastName']; ?>"><br>
            <input type="submit" name="submit" value="Submit">
            <?php
            };
            ?>
            </form>
            <?php
        };
      ?>
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  } );
  </script>
</head>

如果您不想将名字和姓氏作为占位符而是作为输入框的值,那么您应该用“值”替换输入的“占位符”atrribute。