Multi Column Rad Combo Box, How to Hide the item 1st then Put that Item on Top of list.

5 posts, 0 answers
  1. gc_0620
    gc_0620 avatar
    246 posts
    Member since:
    Feb 2008

    Posted 29 Jan 2013 Link to this post

    Folks,

    Using VS 2010 with RadControls for ASP.NET AJAX Q3 2012 SP2. Using this below link as a Prototype (the 1st example: Grid-like multi-column):

    http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/multicolumncombo/defaultcs.aspx

    My question is: How to hide an item alongwith it's other attribute columns from that Multi Column RadCombo Box and Put that item along with its attributes always on top of the list. Example: I would like the Item with Customer id BONAP will always be the 1st Item (i.e. apprear before Customer Id: ALFKI). Attached is my desired result.

    In the past I was able to hide and insert the item on the Top with Single Column in Item Databound event with below code.


    protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
       {
           if (e.Item is GridEditableItem && e.Item.IsInEditMode && e.Item.OwnerTableView.Name == "MainClientAddress")
           {
               string defaultstate = "New York";
     
               GridEditableItem itm = e.Item as GridEditableItem;
     
               RadComboBox rb = (RadComboBox)itm.FindControl("RadComboBoxState");
     
               RadComboBoxItem citem = rb.Items.FindItemByText(defaultstate);
     
               rb.Items.Remove(citem);
     
               rb.Items.Insert(0, citem);
           }
       }

     
    But here I am dealing with Multi- Column Rad ComboBox. Below is my complete declaration, Any help will be appreciated.

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="ServerItemAddTemplateCombo.aspx.cs"
      
    Inherits="ServerItemAddTemplateCombo" %>
     
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     
     
        <head id="Head1" runat="server">
     
            <title></title>
     
            <link href="StyleSheet.css" rel="stylesheet" type="text/css" />
     
        </head>
     
        <body>
     
            <form id="form1" runat="server">
     
                <div>
     
                    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
     
                    </telerik:RadScriptManager>
     
                    <telerik:RadComboBox runat="server" ID="RadComboBox1" Height="190px" Width="520px" AutoPostBack = "true" AppendDataBoundItems="true"
      
                                         MarkFirstMatch="true" DataSourceID="SqlDataSource1" EnableLoadOnDemand="true"
      
                                         HighlightTemplatedItems="true" OnClientItemsRequested="UpdateItemCountField"
      
                                         OnDataBound="RadComboBox1_DataBound" OnItemDataBound="RadComboBox1_ItemDataBound"
      
                                         OnItemsRequested="RadComboBox1_ItemsRequested" Label="Grid-like multi-column:">
     
                        <HeaderTemplate>
     
                            <ul>
     
                                <li  class="col1">Customer Id</li>
     
                                <li  class="col1">Contact Name</li>
     
                                <li class="col2">City</li>
     
                                <li class="col3">Title</li>
     
                            </ul>
     
                        </HeaderTemplate>
     
                        <ItemTemplate>
     
                            <ul>
     
                                <li class="col1">
     
                                <%# DataBinder.Eval(Container.DataItem, "CustomerId") %></li>
     
                                <li class="col1">
     
                                <%# DataBinder.Eval(Container.DataItem, "ContactName") %></li>
     
                                <li class="col2">
     
                                <%# DataBinder.Eval(Container.DataItem, "City") %></li>
     
                                <li class="col3">
     
                                <%# DataBinder.Eval(Container.DataItem, "ContactTitle") %></li>
     
                            </ul>
     
                        </ItemTemplate>
     
                        <FooterTemplate>
     
                            A total of
     
                            <asp:literal runat="server" id="RadComboItemsCount" />
     
                            items
     
                        </FooterTemplate>
     
                    </telerik:RadComboBox>
     
                </div>
     
                <asp:SqlDataSource ID="SqlDataSource1" runat="server"
      
                                   ConnectionString="<%$ ConnectionStrings:NorthWindConnectionString %>"
     
                                   SelectCommand="SELECT *  FROM [Customers] ORDER BY [CustomerID]"></asp:SqlDataSource>
     
                <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
     
                    <script type="text/javascript">
     
                        function UpdateItemCountField(sender, args) {
                            //Set the footer text.
                            sender.get_dropDownElement().lastChild.innerHTML = "A total of " + sender.get_items().get_count() + " items";
                        }
                    </script>
     
                </telerik:RadScriptBlock>
     
            </form>
     
        </body>
     
    </html>

    __________

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
    using System.Data;
    using System.Data.SqlClient;
    using System.Configuration;
     
    public partial class ServerItemAddTemplateCombo : System.Web.UI.Page
    {
        protected void RadComboBox1_DataBound(object sender, EventArgs e)
        {
            //set the initial footer label
            ((Literal)RadComboBox1.Footer.FindControl("RadComboItemsCount")).Text = Convert.ToString(RadComboBox1.Items.Count);
        }
     
        protected void RadComboBox1_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
        {
            //get all customers whose name starts with e.Text
            string sql = "SELECT * from Customers WHERE ContactName LIKE '" + e.Text + "%'";
     
            SqlDataSource1.SelectCommand = sql;
     
            RadComboBox1.DataBind();
        }
     
        protected void RadComboBox1_ItemDataBound(object sender, RadComboBoxItemEventArgs e)
        {
            //set the Text and Value property of every item
            //here you can set any other properties like Enabled, ToolTip, Visible, etc.
            e.Item.Text = ((DataRowView)e.Item.DataItem)["ContactName"].ToString();
     
            e.Item.Value = ((DataRowView)e.Item.DataItem)["CustomerID"].ToString();
        }
     
        
    }

    Thanks

    gc_0620




  2. Nencho
    Admin
    Nencho avatar
    1864 posts

    Posted 01 Feb 2013 Link to this post

    Hello Ghulam,

    Thank you for contacting Telerik Support.

    Regarding the desired functionality you attempt to achieve, I can suggest you to use the combo's OnDataBound event. In the handler of the event, you could find the item by its value or text and insert it at the first position. Please consider the following approach, in order to achieve the desired functionality:

    protected void RadComboBox1_DataBound(object sender, EventArgs e)
       {
           //set the initial footer label
           ((Literal)RadComboBox1.Footer.FindControl("RadComboItemsCount")).Text = Convert.ToString(RadComboBox1.Items.Count);
           RadComboBoxItem firstItem = RadComboBox1.Items.FindItemByValue("BONAP");
           RadComboBox1.Items.FindItemByValue("BONAP").Remove();
           RadComboBox1.Items.Insert(0, firstItem);
       }

    Hope this would help. I will be glad to assist  you any further.

    All the best,
    Nencho
    the Telerik team
    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 their blog feed now.
  3. gc_0620
    gc_0620 avatar
    246 posts
    Member since:
    Feb 2008

    Posted 02 Feb 2013 Link to this post

    Hi Nencho,

    I am sorry to say that you missed my Point. My question was: How to hide an item alongwith it's other attribute columns from that Multi Column RadCombo Box and Put that item along with its attribute columns always on top of the list. The solution you provided only inserting the Customer Id not related attribute columns.

    Another ward I would like to remove Customer Id BONAP from the list and insert it on top of the list along with its other attribute column values (i.e. show:  Customer Id = BONAP, Contact Name=  Laurence Lebihan, City= Marseille, Title = Owner in 1st row). In my original post, my attached file (MultiColumnCombo.jpg) specified the desired intention.

    Thanks

    gc_0620
  4. Nencho
    Admin
    Nencho avatar
    1864 posts

    Posted 06 Feb 2013 Link to this post

    Hello Ghulam,

    Do you attempt to show the specified item always on top of the list, event if you scroll through the list of items? In addition, I have recorded a video and attached my sample test web page, demonstrating the behavior at my end. The RadComboBoxItem with value BONAP is inserted at the top of the list, along with it's attributes. Please review them and let me know if I am not testing properly or I have to add something to achieve the desired scenario.

    Greetings,
    Nencho
    the Telerik team
    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 their blog feed now.
  5. gc_0620
    gc_0620 avatar
    246 posts
    Member since:
    Feb 2008

    Posted 06 Feb 2013 Link to this post

    Thanks so much Nencho, appreciate very much. Your Video and code's are self-explanatory.

    All the best.

    Sincerely,

    gc_0620
Back to Top