Javascript 从下拉列表“选择”标记中获取值并存储在DB ASP.net中

Javascript 从下拉列表“选择”标记中获取值并存储在DB ASP.net中,javascript,jquery,html,asp.net,drop-down-menu,Javascript,Jquery,Html,Asp.net,Drop Down Menu,因此,我正在开发一个表单,它显然从用户那里获取值,包括文本值和他们从下拉列表中选择的项目。我在找到从下拉列表中选择的值并将其作为参数值之一存储在数据库中时遇到问题 下面是我的javascript和html代码,用于创建包含4项的下拉列表,如图所示 <script type="text/javascript"> $(document).ready(function () { $('#packageList').change(functi

因此,我正在开发一个表单,它显然从用户那里获取值,包括文本值和他们从下拉列表中选择的项目。我在找到从下拉列表中选择的值并将其作为参数值之一存储在数据库中时遇到问题

下面是我的javascript和html代码,用于创建包含4项的下拉列表,如图所示

    <script type="text/javascript">
        $(document).ready(function () {

            $('#packageList').change(function () {
                var value = $(this).val(); var toAppend = ''; var onePrice = 
        '$ 399';
                var threePrice = '$ 699'; var sixPrice = '$ 899'; var 
         twelvePrice = '$ 2999';

                if (value == 1) {
                    toAppend = "<input type='textbox'>"; 
    $("#container").html(onePrice); return;
                }
                if (value == 2) {
                    toAppend = "<text='$ 699'>"; 
    $("#container").html(threePrice); return;
                }
                if (value == 3) {
                    toAppend = "<text='$ 899 >"; 
    $("#container").html(sixPrice); return;

                }
                if (value == 4) {
                    toAppend = "<text='$ 2999'>"; 
   $("#container").html(twelvePrice); return;
                }
            });

        });
    </script>
这是我表单主体中的html代码

  <select id="packageList" name="D1">
    <option value="0">Select </option>
    <option value="1">1 Months </option>
    <option value="2">3 Months </option>
    <option value="3">6 Months </option>
    <option value="4">12 Months </option>
     </select> </p>
     &nbsp;<div id="container"></div>
当我的用户单击“提交表单”按钮时,输入的值将添加到我数据库中目标表中的参数中,我能够获得我的表单包含的文本框中所有参数的值,还有下拉列表,但是我在弄清楚如何从下拉列表中选择值并将其存储在数据库中时遇到了一个问题。请注意,上面代码中显示的下拉列表是使用标记创建的,我无法在后台的c代码中查看它的变量

非常感谢您的帮助。
谢谢。

乍一看,从val得到的值是字符串的类型,尽管in==比较1和1是可以的,但使用===的最佳实践将使您的陈述为假

在jQuery中,有一个叫做$.ajax的东西,您需要它异步发送回您的数据。任何方法,包括get、post、put等,都可以在ajax中使用;HTML表单通常只允许get和post

由于您没有显示另一个输入文本框,因此我只假设此输入的名称很简单

$text = $("#text");
$content = $("#content");
$packageList = $("#packageList");
var data = {
    "text": $text().val(),
    "D1": $packageList.val()
};
$.ajax({
    "url": "api-endpoint-accepting-post", // example: "/post-form", if your API endpoint is /post-form
    "type": "POST", // HTTP method, it is common to use GET, POST; and others such as PUT, DELETE, or some other WebDAV method, etc., that normally browser cannot do these method to pass request to server via HTML form
    "data": JSON.stringify(data),
    // other stuff you might need to configure
    "contentType": "application/json; charset=utf-8",
    "dataType": "json", // if you are receiving from server in json format
    //
    "success": function (result, textStatus, jqXHR) {
        console.log(result);
        // do whatever you want if post to server is a success, and server return something to you
        // maybe update another textbox
        var json = JSON.parse(result);
        $("#container").text(json["some-property-sent-back-from-server"]);
    },
    "error": function (jqXHR, textStatus, errorThrown) {
        // can also look at those parameters above for the reason
        console.error("error");
    }
});

此代码段假定服务器需要ajax中的JSON字符串数据对象;对于表单,您需要将ajax选项配置为与数据、类型、url等相同的级别

确保您的下拉列表位于表单中,然后检查请求。表单[D1]@AlexKudryashev您也在引用哪个表单,顺便说一句,上面的代码是表格的一部分。你能详细说明一下我如何在上面的代码中包含这些代码吗?不,在我的电脑前输入这些代码太难了。。。一旦可用,我会将我在问题中发布的代码替换为您答案中的代码吗?ajax部分?不是全部替换,而是放入$..更改,并对$进行一些必要的调整。ajax部分实际上我需要更多信息来了解ajax部分是放在doc…ready之后还是放在$packageList…change之后;我的直觉是将$packageList.change[…]放入其中,因为您可能只想在下拉框选择更改时“发布”到服务器