时间戳

首页 > 解决方案 > 使用数据库中的选项添加新的选择表单

javascript - 使用数据库中的选项添加新的选择表单

问题描述

我一直在尝试使用 javascript 动态添加一个新的下拉列表表单。我不知道我应该如何进行。我现在拥有的是一个带有 javascript 的 html 表单页面，它允许我添加一行新的文本输入表单。html表单

这是我当前用于此页面的代码。

<?php
include('session.php');
?>

<?php 
$ItemID = "ItemID";
$ItemName = "ItemName";
$UnitPrice = "UnitPrice";

$sql = "SELECT ItemID,ItemName,UnitPrice FROM Item";
$result = $db->query($sql);
$sql2 ="SELECT BranchID,BranchLocation FROM Branch";
$result2 = $db->query($sql2);
$sql4 ="SELECT MemberID FROM Membership";
$result4 = $db->query($sql4);

?> 
<html>
<head>
    <title>Add Sales</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

</head>
<body>
    <div class="text-center">
        <h1>Add new Sales Record</h1>
    </div>
    <div class="container">
        <a href="sales.php"><button  class="w3-button w3-black w3-round-large">Back</button></a>
    </div>
    <div class="container" align="right">
        <table class="table-sm">
            <tbody>
                <tr class="table-primar">
                    <th scope="col" style="padding-right: 50px;">ItemID</th>
                    <th scope="col" style="padding-right: 50px">ItemName</th>
                    <th scope="col">UnitPrice</th>
                </tr>

                <?php 
                while($rows = $result->fetch_assoc()) { 
                    ?>
                    <tr class="contents">
                        <td><?php echo $rows[$ItemID]; ?></td>
                        <td><?php echo $rows[$ItemName]; ?></td>
                        <td><?php echo $rows[$UnitPrice]; ?></td>
                    </tr>
                    <?php   
                } 
                ?> 
            </tbody>
        </table>
    </div>
    <hr>
    <div class="container">
        <div class="row clearfix">
            <div class="col-md-12 column">
                <form action="addsales.php" method="post">
                    <table class="">
                        <table class="table table-bordered table-hover">
                            <thead>
                                <tr >
                                    <th class="text-center">
                                        Branch ID
                                    </th>
                                    <th class="text-center">
                                        MemberID
                                    </th>
                                </tr>
                            </thead>
                            <tbody>

                                <tr>
                                    <td>
                                        <select name="branchid">
                                          <option selected></option>
                                          <?php
                                           
                                            while($rows2 = $result2->fetch_assoc()){
                                                ?>
                                                
                                                <option value="<?php echo $rows2["BranchID"];?>"><?php echo $rows2["BranchLocation"];?></option>
                                                
                                                <?php
                                                
                                            }
                                        
                                        ?>
                                        
                                    </select>
                                    </td>
                                        <input type="hidden" value="<?php echo $login_session; ?>" name='employeeid' class="form-control"/>
                                    <td>
                                        <select name="memberid">
                                          <option selected></option>
                                          <?php
                                           
                                            while($rows4 = $result4->fetch_assoc()){
                                                ?>
                                                
                                                <option value="<?php echo $rows4["MemberID"];?>"><?php echo $rows4["MemberID"];?></option>
                                                
                                                <?php
                                                
                                            }
                                        
                                        ?>
                                        
                                    </select>
                                    </td>
                                </tr>
                                
                            </tbody>
                        </table>
                        <table class="table table-bordered table-hover" id="tab_logic">
                            <thead>
                                <tr >
                                    <th class="text-center">
                                        ItemID
                                    </th>
                                    <th class="text-center">
                                        Amount
                                    </th>
                                </tr>
                            </thead>
                            <tbody>

                                <tr id='addr0'>
                                    <td>
                                        <input type="text" maxlength ="10" name='item[0][itemid]' placeholder='ItemID' class="form-control"/>
                                    </td>
                                    <td>
                                        <input type="number" name='item[0][amount]' placeholder='Amount' class="form-control"/>
                                    </td>
                                </tr>
                                <tr id='addr1'></tr>
                            </tbody>
                        </table>
                        <input class="w3-button w3-black w3-round-large" type="submit" name='submit' value="Submit"/>
                    </form>
                    <button id="add_row" class="w3-button w3-black w3-round-large" style="position: absolute; right: 20px;">New row</button>
                </div>
            </div>
        </div>
        <script type="text/javascript"> 
          $(document).ready(function() {
              var i = 1;
              $("#add_row").click(function() {

                $('#addr' + i).html("<td><input name='item["+i+"][itemid]'  placeholder='ItemID' maxlength='10' class='form-control input-md'/></td><td><input type='text' name='item["+i+"][amount]' placeholder='Amount' class='form-control input-md'/></td>");

                $('#tab_logic').append('<tr id="addr' + (i + 1) + '"></tr>');
                i++;
            });
          });
      </script>
  </body>
  </html>

我想更改 javascript 代码，以便添加一个带有数据库选项的选择表单，而不是添加一个新的文本输入表单。类似的东西。

<td>
                                        <select name="memberid">
                                          <option selected></option>
                                          <?php
                                           
                                            while($rows4 = $result4->fetch_assoc()){
                                                ?>
                                                
                                                <option value="<?php echo $rows4["MemberID"];?>"><?php echo $rows4["MemberID"];?></option>
                                                
                                                <?php
                                                
                                            }
                                        
                                        ?>
                                        
                                    </select>
                                    </td>

我对所有这些 php 和 javascript 真的很陌生，所以我的代码可能看起来有点不对劲。提前谢谢你的帮助。

标签： javascriptphphtmlsql

解决方案

推荐阅读