如何实现保管箱在C＃中的列表 [英] How to implement a list of dropboxes in C#

问题描述

我目前正在使用ASP.NET C＃项目。我想实现保管箱的列表。因此，用户与Dropbox的开始，可以选择的方法和旁边的Dropbox是一个+和 - 按钮，这使得用户能够添加更多的收存箱。所以，我想知道我怎么能实现是有可能建立保管箱的一个列表，ASP.NET？

I am currently working on a C# project using ASP.NET. And I'd like to implement a list of dropboxes. So a User starts with a dropbox and can select a method and next to the dropbox is a + and - button, which enables a user to add more dropboxes. So I am wondering how can I implement that is it possible to build a List of dropboxes in ASP.NET?

推荐答案

您不需要任何服务器端code对于这一点，客户端脚本是适合您的需求的理想解决方案。

You don't need any server side code for this, client side scripting is ideal solution for your needs.

有这样的HTML：

<div id="MainPlaceholder">
    <div id="DropDownPlaceholder">
        <select name="myDropDown">
            <option value="1">First</option>
            <option value="2">Second</option>
            <option value="3">Third</option>
        </select>
        <button type="button" onclick="AddDropDown(this);">+</button>
        <button type="button" onclick="RemoveDropDown(this);">-</button>
    </div>
</div>

您需要以下纯JavaScript，使其工作：

You need the following pure JavaScript to make it work:

<script type="text/javascript">
var added_counter = 0;

function AddDropDown(sender) {
    var parent = sender.parentNode;

    //make fresh clone:
    var oClone = parent.cloneNode(true);

    //append to main placeholder:
    parent.parentNode.appendChild(oClone);

    //store change in global variable:
    added_counter++;
}

function RemoveDropDown(sender) {
    //don't allow to remove when there is only one left
    if (added_counter <= 0) {
        alert("One drop down must exist");
        return;
    }

    var parent = sender.parentNode;

    //disable so value won't be passed when form submitted:
    parent.getElementsByTagName("select")[0].disabled = true;

    //hide:
    parent.style.display = "none";

    //store change in global variable:
    added_counter--;    
}
</script>

在code的意见，但如果你需要任何进一步的解释，请随时问。

The code has comments, but if you need any further explanation please feel free to ask.

现场测试案例。

修改：当你需要阅读在服务器端code所选的值，更好的方法是改变每个克隆的下降将名称：

Edit: As you need to read the selected values on the server side code, better approach would be to change the name of each cloned drop down:

var totalAddedCounter = 0;

function AddDropDown(sender) {
    var parent = sender.parentNode;

    //make fresh clone:
    var oClone = parent.cloneNode(true);

    //assign unique name:
    oClone.getElementsByTagName("select")[0].name += "_" + totalAddedCounter;

    //append to main placeholder:
    parent.parentNode.appendChild(oClone);

    //store change in global variable:
    added_counter++;
    totalAddedCounter++;
}

现在棘手的部分是阅读这些值。除了纯 dropboxlistID.Text 你将不得不遍历所有公布值寻找你所需要的：

Now the tricky part is reading those values. Instead of plain dropboxlistID.Text you will have to iterate over all posted values looking for what you need:

foreach (string key in Request.Form.Keys)
{
    if (key.StartsWith("dropboxlistID"))
    {
        string text = Request.Form[key];
        //.....
    }

这篇关于如何实现保管箱在C＃中的列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！