如何使用jquery将checkboxlist项的值复制到listbox

时间:2011-09-19 06:48:17

标签: jquery asp.net

我的页面中有一个复选框列表,其项目文本为某些语言(例如:c,c ++,java,c#sharp.net等)。我有一个名为所需技能的空列表框。人力资源招聘人员将选择一些语言(复选框列表项)并单击一个名为欲望的按钮来复制选定的ckeckbox,并且需要在列表框中填充。我想知道如何使用jquery实现这一点。这是我的控件:

<asp:CheckBoxList ID="cbxlang" runat="server">
                    <asp:ListItem Text="C" Value="C"></asp:ListItem>
                    <asp:ListItem Text="C++" Value="C++"></asp:ListItem>
                    <asp:ListItem Text="Java" Value="Java"></asp:ListItem>
                    <asp:ListItem Text="csharp" Value="csharp"></asp:ListItem>
                </asp:CheckBoxList>

这里的按钮:

<asp:Button ID="btnCheck" runat="server" Text="DesiredSkills" />

,列表框就像这样

 <asp:ListBox ID="lstDesired" runat="server"></asp:ListBox>

我想将所选复选框项目填充为我的列表框项目。我已经在代码隐藏页面中完成了这个,但是需要将页面发回然后再次加载它。请帮忙。我对jquery很新。

2 个答案:

答案 0 :(得分:0)

试试这个,

    <script type="text/javascript">
            $(document).ready(function () {
                $("#button1").click(function () {
                    txt = $("#cbxlang").find("input");

                    $("#lstDesired").children().remove();
                    txt.each(function (a, b) {
                        if (b.checked)
                            $("#lstDesired").append("<option>" + b.value + "</option>");
                    });

                });
            });
 </script>

标记

<asp:CheckBoxList ID="cbxlang" runat="server">
            <asp:ListItem Text="C" Value="C"></asp:ListItem>
            <asp:ListItem Text="C++" Value="C++"></asp:ListItem>
            <asp:ListItem Text="Java" Value="Java"></asp:ListItem>
            <asp:ListItem Text="csharp" Value="csharp"></asp:ListItem>
  </asp:CheckBoxList>
  <asp:ListBox ID="lstDesired" runat="server"></asp:ListBox>
  <input type="button" id="button1" value="Copy" />

答案 1 :(得分:0)

默认情况下,CheckBoxList控件不会生成任何音符的值属性。

用CheckBoxValueList自定义控件替换CheckBoxList:

using System;
using System.ComponentModel;
using System.IO;
using System.Text;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace YourSite.WebControls
{
    /// <summary>
    /// Adds the 'value' attribute to the <input /> element of each checkbox in the list
    /// </summary>
    [DefaultProperty("Text"),
    ToolboxData("<{0}:CheckBoxValueList runat=server></{0}:CheckBoxValueList>")]
    public class CheckBoxValueList : CheckBoxList
    {
        protected override void Render(HtmlTextWriter writer)
        {
            StringBuilder sb = new StringBuilder();
            TextWriter tw = new StringWriter(sb);

            HtmlTextWriter originalStream = new HtmlTextWriter(tw);
            base.Render(originalStream);
            string renderedText = sb.ToString();

            int start = 0;
            int labelStart = 0;
            int end = renderedText.Length;

            for (int i = 0; i < this.Items.Count; i++)
            {
                StringBuilder itemAttributeBuilder = new StringBuilder();

                end = renderedText.Length;
                start = renderedText.IndexOf("<input", start, end - start);
                labelStart = renderedText.IndexOf("<label", start, end - start);

                this.Items[i].Attributes.Render(new HtmlTextWriter(new StringWriter(itemAttributeBuilder)));

                renderedText = renderedText.Insert(labelStart + 7, itemAttributeBuilder.ToString() + " ");
                renderedText = renderedText.Insert(start + 7, String.Format("{0} value=\"{1}\" ", itemAttributeBuilder.ToString(), this.Items[i].Value));
                start = renderedText.IndexOf("/>", start, renderedText.Length - start);
            }

            writer.Write(renderedText);
        }
    }
}

请点击此处了解更多信息......

  

http://surinder.computing-studio.com/post/2011/08/10/ASPNET-CheckBoxList-Control-With-Value-Attribute.aspx

然后,您可以使用AVD的jQuery来完成这项工作。