将项目从一个<asp:listbox>复制到另一个动态</asp:listbox>

时间:2012-06-20 13:27:55

标签: c# asp.net

这是我们的代码:

  <div>
 <table style="width: 349px">
    <tr>
    <td class="style1">
        <asp:ListBox ID="leftbox" runat="server" Height="114px" Width="212px" 
            SelectionMode="Multiple" AutoPostBack="True">
        </asp:ListBox>
    </td>
    <td>
        <asp:Button ID="Button1" runat="server" Text=">>" onclick="Button1_Click" /><br />
        <asp:Button ID="Button2" runat="server" Text="<<" onclick="Button2_Click" />
    </td>
    <td>
        <asp:ListBox ID="rightbox" runat="server" Height="117px" Width="231px" 
            SelectionMode="Multiple" AutoPostBack="True"></asp:ListBox>
    </td>

    </tr>
</table>
</div>    

背后的代码是:

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        List<string> list= GetNameList();
        leftbox.DataSource = list;
        leftbox.DataBind();             
    }
}

private static List<string> GetNameList()
{
    List<string> list = new List<string>();
    list.Add("keerthana");
    list.Add("sirisha");
    list.Add("anusha");
    list.Add("Anuradha");
    list.Add("Bhavani");
    list.Add("divya");
    list.Sort();
    return list;
}

请告诉我如何在leftboxrightbox之间逐个添加两个或多个所选项目,而不使用服务器端代码(如下所示):

protected void Button1_Click(object sender, EventArgs e)
{
    if (leftbox.SelectedIndex != -1)
    {
        rightbox.Items.Add(leftbox.SelectedItem.Text);
        leftbox.Items.Remove(leftbox.SelectedItem.Text);
    }
}

提前致谢...

3 个答案:

答案 0 :(得分:2)

使用客户端javascript执行此操作,因此每次有人移动时都不会回发,如果你有jquery,它可以像以下一样简单:

$("#Button1").button().click(function() {
  $("#leftbox option:selected").each(function() {
      $("#rightbox").append(this);
  });
});

答案 1 :(得分:1)

这是Linq获取选定项目形式ListBox的方式

var selectedItems =  leftbox.Items.OfType<ListItem>().Where(item => item.Selected).ToList();

然后您可以将所有选定的值添加到rightbox,最后从leftbox

中删除

修改

protected void Button1_Click(object sender, EventArgs e)
{
    List<ListItem> selectedItems = new List<ListItem>();
    if (leftbox.SelectedIndex >= 0)
    {
        for (int i = 0; i < leftbox.Items.Count; i++)
        {
            if (leftbox.Items[i].Selected)
            {
                    selectedItems.Add(leftbox.Items[i]);
            }
        }

    }

    for (int i = 0; i < selectedItems.Count; i++)
    {
        if (!rightbox.Items.Contains(selectedItems[i]))
            rightbox.Items.Add(selectedItems[i]);
        leftbox.Items.Remove(selectedItems[i]);
    }

}

答案 2 :(得分:0)

这将完成工作 但这里的问题是...... 转移项目后,单击“保存”按钮 它将在您的保存代码读取之前先提交 从Rightbox移动到Leftbox的所有项目都将返回到Rightbox viseversa

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script type="text/javascript">
            $(function () {
                $("#left").bind("click", function () {
                    var options = $("[id*=RIghtBox] option:selected");
                    for (var i = 0; i < options.length; i++) {
                        var opt = $(options[i]).clone();
                        $(options[i]).remove();
                        $("[id*=LeftBox]").append(opt);
                    } 
                });

                $("#right").bind("click", function () {
                    var options = $("[id*=LeftBox] option:selected");
                    for (var i = 0; i < options.length; i++) {
                        var opt = $(options[i]).clone();
                        $(options[i]).remove();
                        $("[id*=RIghtBox]").append(opt);

                    }
                });
            });


        </script>