Добавить выбор по клику - PullRequest
0 голосов
/ 02 апреля 2020

Этот код предназначен для заполнения ввода пользователей в базу данных. Я хочу отобразить строку выбора и некоторые входные выпадающие разделы при нажатии. Я не смог отобразить выпадающий список, но остальные разделы ввода могут отображаться правильно при нажатии. Как исправить код для отображения раскрывающегося списка и ввода?

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(e){
        //variables

        var html = '<p /><div> item: date:<input type="DATE" name="sales_date" id="childDate" /> quantity:<input type="NUMBER" name="sales_quantity" id="childQuantity" /> surcharge:<input type="NUMBER" name="sales_surcharge" id="childSurcharge" /> <a href="#" id="remove">remove</a></div>';

        var maxRows = 5;

        var x =1;

        //add rows to the form
        $("#add").click(function(e){
            if(x <= maxRows){
                $("#container").append(html);
                // $("#container").append(item_section);
                x++
            }
        });

        //remove rows to the form
        $("#container").on('click','#remove',function(e){
            $(this).parent('div').remove();
            x--;
        });
        //populate values from the first row
});
</script>
</head>
<body>
    <form method ="POST">
        <div id="container">
            item:<?php 
                $drop = '<select  class="drop" name="item_name" style="width:8em">';
while($row = $resultSet->fetch_assoc()){ $drop .= '<option value='.$row['item_name'].'>'.$row['item_name'].'</option>';
}
$drop .= '</select>';
echo $drop ?>
            date:<input type="DATE" name="sales_date" id="date" />
            quantity:<input type="NUMBER" name="sales_quantity" id="quantity" />
            surcharge:<input type="NUMBER" name="sales_surcharge" id="surcharge" />
            <a href="#" id="add">Add More</a>
        </div>
        <input type="SUBMIT" name="submit" />
    </form> 
</body>
...