Fatal编程技术网
  • csharp/
  • C# 如何在动态创建的MVC中获取下拉列表值

C# 如何在动态创建的MVC中获取下拉列表值

c# asp.net-mvc asp.net-mvc-4 asp.net-mvc-3

C# 如何在动态创建的MVC中获取下拉列表值,c#,asp.net-mvc,asp.net-mvc-4,asp.net-mvc-3,C#,Asp.net Mvc,Asp.net Mvc 4,Asp.net Mvc 3,嗨，我创建了一个逻辑，在点击按钮时添加了多个下拉列表。下面是我的视图代码 <body> @using (Html.BeginForm("Index", "Home", FormMethod.Post)) { <input id="btnAdd" type="button" value="Add" onclick="AddTextBox()" /> <br /> <br />

嗨，我创建了一个逻辑，在点击按钮时添加了多个下拉列表。下面是我的视图代码

<body>
    @using (Html.BeginForm("Index", "Home", FormMethod.Post))
    {
        <input id="btnAdd" type="button" value="Add" onclick="AddTextBox()" />
        <br />
        <br />
        <div id="DropdownContainer">
            <!--Textboxes will be added here -->
        </div>
        <br />
        <input type="submit" value="Submit" />
    }
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        function GetDynamicTextBox(value) {
            var div = $("<div />");
            var textBox = '<div class="col-xs-2"><select  name="From" class="form-control">';
            textBox = textBox + '<option value="">From</option>';
            textBox = textBox + '<option value="1 AM">1 AM</option>';
            textBox = textBox + '<option value="1.30 AM">1.30 AM</option>';
            textBox = textBox + '<option value="2 AM">2 AM</option>';
            textBox = textBox + '<option value="2.30 AM">2.30 AM</option>';

            textBox = textBox + '</select></div>';

            textBox = textBox + '<div class="col-xs-2"><select  name="To" class="form-control">';
            textBox = textBox + '<option value="">To</option>';
            textBox = textBox + '<option value="1 AM">1 AM</option>';
            textBox = textBox + '<option value="1.30 AM">1.30 AM</option>';
            textBox = textBox + '<option value="2 AM">2 AM</option>';
            textBox = textBox + '<option value="2.30 AM">2.30 AM</option>';                
            textBox = textBox + '</select>  </div>';

            //textBox.val(value);
            div.append(textBox);

            var button = $("<input />").attr("type", "button").attr("value", "Remove");
            button.attr("onclick", "RemoveTextBox(this)");
            div.append(button);

            return div;
        }
        function AddTextBox() {
            var div = GetDynamicTextBox("");
            $("#DropdownContainer").append(div);
        }

        function RemoveTextBox(button) {
            $(button).parent().remove();
        }

        $(function () {
            var values = eval('@Html.Raw(ViewBag.Values)');
            if (values != null) {
                $("#DropdownContainer").html("");
                $(values).each(function () {
                    $("#DropdownContainer").append(GetDynamicTextBox(this));
                });
            }
        });
    </script>
    @if (ViewBag.Message != null)
    {
        <script type="text/javascript">
            $(function () {
                alert("@ViewBag.Message")
            });
        </script>
    }
</body>
但是，当我单击提交时，我无法获得所选的两个下拉列表值

请查看下面的图片

我需要为所有选中的多个下拉列表值获取值，以及如何对下拉列表id进行验证没有选择任何内容

在提交时，单击我需要在数据库中保存下拉列表的选定值

验证代码为

 function validate() {
            var values = [];
            $('#DropdownContainer option').each(function () {
                var e = $(this);
                console.log(e);               
                return false;
            });
            return false;
     }
如何获取所选值？

问题不在于创建这些下拉框。控制器中的模型绑定不正确。这些名称为的多个下拉框分别为From和To。例如，您的操作应如下所示：

[HttpPost]
public ActionResult Index(string[] from, string[] to)
{
   // your code            
}
更新：在客户端添加了验证代码

    function validateByInputName(name) {
        var isValidate = true;
        $("select[name='" + name+"']").each(function (index, item) {
            var selectedValue = $(item).val();
            if (selectedValue == "") {
                isValidate = false;
                return;
            }
        });

        return isValidate;
    }

    function validate() {
        return validateByInputName('From') && validateByInputName('To');
    }
我想你现在就可以得到这些想法。

如果没有选择，有没有办法验证多重下拉列表？我更新了代码。你可以得到多个值。不，我已经得到了，我要求对多个下拉列表进行验证。验证是什么意思？如果没有选择，它们将是空字符串否我想限制客户端的空字符串 
    function validateByInputName(name) {
        var isValidate = true;
        $("select[name='" + name+"']").each(function (index, item) {
            var selectedValue = $(item).val();
            if (selectedValue == "") {
                isValidate = false;
                return;
            }
        });

        return isValidate;
    }

    function validate() {
        return validateByInputName('From') && validateByInputName('To');
    }