javascript - 使用文本框中的 jquery 将产品名称添加到下拉列表

Question

嗨，我有一个下拉列表和一个文本框，我想要将文本框中写入的产品动态添加到下拉列表中，它也不应该重复这些值。

我创建了一个包含 id 和 product 列的表 [products]，因此添加到下拉列表的产品应该添加到该表中。

任何关于如何使它工作的想法，任何帮助和建议都将不胜感激

<div id="dropdown-container">
    <asp:TextBox ID="txtProduct" runat="server"></asp:TextBox><a id="add"
        href="javascript:void(0)">Add</a>
    <select id="product">
    <option>please select</option>
 </select>
</div>

Answer 1

一些可能让您入门的代码。很难在没有看到实际来源的情况下帮助您。

在文本框 keyup 事件中：

$(function(){

    $('#add').click(function(){

         var $productTextbox = $('#txtProduct');

         $.get('producthandler.ashx', 
               {  productName: $productTextbox.val() 

                     /* try to make use of 
                     an ID instead of name here */
               })
               .done(function(response){

                   var $option = 
                             $('<option>' + $productTextbox.val() + '</option>');

                   if(response.productDoesNotExist)
                       $('#product').append($option);
               }
         });


    });

});

如果您向我提供实际数据源的外观，我可以给您一个更详细的示例。