How to drag and drop from listbox to specific list box in a table?

2 posts, 0 answers
  1. mohamed
    mohamed avatar
    4 posts
    Member since:
    Mar 2011

    Posted 10 Jun 2013 Link to this post

    I want to drag and drop from a RadListBox To another RadListBox in a table ?

    and persist this server side but it not works :

    My .cs :

    protected void Page_Load(object sender, EventArgs e)
            {
                // Total number of rows.
                int rowCnt = 4;
                // Current row count.
                int rowCtr;
                // Total number of cells per row (columns).
                int cellCtr;
                // Current cell counter
                int cellCnt = 7;

               // rowCnt = int.Parse(TextBox1.Text);
               // cellCnt = int.Parse(TextBox2.Text);

                for (rowCtr = 1; rowCtr <= rowCnt; rowCtr++)
                {
                    // Create new row and add it to the table.

                    HtmlTableRow tRow = new HtmlTableRow();
                    Table1.Rows.Add(tRow);
                    for (cellCtr = 1; cellCtr <= cellCnt; cellCtr++)
                    {
                        // Create a new cell and add it to the row.
                        HtmlTableCell tCell = new HtmlTableCell();
                       // tCell.Text = "Row " + rowCtr + ", Cell " + cellCtr;
                        RadListBox rr = new RadListBox();
                        rr.ItemTemplate = new RadListBoxTemplate();
                        rr.SelectionMode = ListBoxSelectionMode.Multiple;
                        rr.AllowReorder =true;
                        rr.AutoPostBackOnReorder =true;
                        rr.EnableDragAndDrop =true;
                       
                        List<int> i = new List<int>();
                        i.Add(1);
                        i.Add(2);
                        i.Add(3);
                        rr.DataSource = i;
                        rr.DataBind();
                        tCell.Controls.Add(rr);
                        tRow.Cells.Add((tCell));
                    }
                }
            }
            ////
            class RadListBoxTemplate : ITemplate
            {
                public void InstantiateIn(Control container)
                {
                    Label id = new Label();
                    id.ID = "idLabel";
                    id.CssClass = "idClass";
                    id.DataBinding += new EventHandler(id_DataBinding);
                    container.Controls.Add(id);
                    Label name = new Label();
                    name.ID = "nameLabel";
                    name.CssClass = "list";
                    name.DataBinding += new EventHandler(name_DataBinding);
                    container.Controls.Add(name);
                    HyperLink details = new HyperLink();
                    details.ID = "details";
                    details.CssClass = "list";
                    details.Text = "Details";
                    details.DataBinding += new EventHandler(details_DataBinding);
                    container.Controls.Add(details);
                }
                private void id_DataBinding(object sender, EventArgs e)
                {
                    //Label target = (Label)sender;
                    //RadListBoxItem item = (RadListBoxItem)target.BindingContainer;
                    //string id = Convert.ToString((int)DataBinder.Eval(item.DataItem, "ID"));
                    //target.Text = id;
                }
                private void name_DataBinding(object sender, EventArgs e)
                {
                    //Label target = (Label)sender;
                    //RadListBoxItem item = (RadListBoxItem)target.BindingContainer;
                    //string name = (string)DataBinder.Eval(item.DataItem, "Name");
                    //target.Text = name;
                }
                private void details_DataBinding(object sender, EventArgs e)
                {
                    //HyperLink target = (HyperLink)sender;
                    //RadListBoxItem item = (RadListBoxItem)target.BindingContainer;
                    //string id = Convert.ToString((int)DataBinder.Eval(item.DataItem, "ID"));
                    //target.NavigateUrl = "Details.aspx?ID=" + id;
                }
            }
    My .aspx like this :

      <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" CssClass="example-panel">
            <telerik:RadListBox ID="RadListBox1" CssClass="RadListBox1" runat="server" Width="200px"
                Height="200px" SelectionMode="Multiple" AllowTransfer="true" AutoPostBackOnTransfer="true"
                AllowReorder="true" AutoPostBackOnReorder="true" EnableDragAndDrop="true" Skin="Office2010Blue"
                OnDropped="RadListBox1_Dropped" OnDropping="RadListBox1_Dropping" OnTransferring="RadListBox1_Transferring">
                <Items>
                    <telerik:RadListBoxItem Text="Argentina"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="Australia"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="Brazil"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="Canada"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="Chile"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="China"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="Egypt"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="England"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="France"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="Germany"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="India"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="Indonesia"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="Kenya"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="Mexico"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="New Zealand"></telerik:RadListBoxItem>
                    <telerik:RadListBoxItem Text="South Africa"></telerik:RadListBoxItem>
                </Items>
            </telerik:RadListBox>
            <table id="Table1" runat="server" rules="Both">
            </table>
        </telerik:RadAjaxPanel>
  2. Nencho
    Admin
    Nencho avatar
    1457 posts

    Posted 13 Jun 2013 Link to this post

    Hello Mohamed,

    Please refer to this KB article, demonstrating how to achieve a multiple transfer of the RadListBoxes, using grad and drop.

    Regards,
    Nencho
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top