ListBox / Button Configuration

5 posts, 1 answers
  1. Prasad
    Prasad avatar
    10 posts
    Member since:
    Aug 2012

    Posted 30 Oct 2012 Link to this post

    I want to add my list box in first column and buttons in second column.current configuration allows buttons to be aligned at top, bottom, center position vertically, and horizontally Left, Right, Center. I want to display Listbox and buttons in one after another.( button will be in horizontal position) please go through attached image.
  2. Ivan Zhekov
    Ivan Zhekov avatar
    604 posts

    Posted 02 Nov 2012 Link to this post


    Although that's not immediately possible with the settings, it is possible with some tweaking of the settings and styles:

    1) You need to set a wider button area, say
    <telerik:RadListBox runat="server" id="RadListBox1">
        <ButtonSettings AreaWidth="60" Position="Top" HorizontalAlign="Left" />

    2) Then you need to set the buttons to be floated e.g:
    .RadListBox .rlbButton {
        float: left;

    And that should do it.

    Of course, there are a number of cases that this scenario will not work. It depends on the styles you may have in your project etc.

    Further reading of the button settings --

    All the best,
    Ivan Zhekov
    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. Prasad
    Prasad avatar
    10 posts
    Member since:
    Aug 2012

    Posted 02 Nov 2012 Link to this post

    Thanks for reply Ivan, but its not working. can you provide any other solution?
  4. Answer
    Ian avatar
    5 posts
    Member since:
    Jan 2007

    Posted 07 Nov 2012 Link to this post

    Actually, this seems to be working:

    <%@ Page %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
    <head runat="server">
        <title>ListBox / Button Configuration</title>
        <style type="text/css">
        .RadListBox .rlbButton {
            float: left;
    <form id="form1" runat="server">
        <asp:ScriptManager runat="server" />
        <telerik:RadListBox runat="server" AllowReorder="true">
            <ButtonSettings AreaWidth="60" ReorderButtons="Common" />
                <telerik:RadListBoxItem Text="Item 1" />
                <telerik:RadListBoxItem Text="Item 2" />
                <telerik:RadListBoxItem Text="Item 3" />
                <telerik:RadListBoxItem Text="Item 4" />
                <telerik:RadListBoxItem Text="Item 5" />

    Indeed you get the buttons aligned.
  5. Prasad
    Prasad avatar
    10 posts
    Member since:
    Aug 2012

    Posted 13 Dec 2012 Link to this post

     I want to show only prev and next buttons images on respective buttons. but there some other event which are overloading another image with my image.I am getting following code,
    <a title="Move left" class="rlbButton rlbMoveUpDisabled rlbDisabled rlbNoButtonText"><span class="rlbButtonBL"><span class="rlbButtonBR"><span class="rlbButtonTR"><span class="rlbButtonTL"><span class="rlbButtonText">&nbsp;</span></span></span></span></span></a>
    I am applying my prev.jpg on "previous image button" with following css classes,
    .rlbMoveDownDisabled .rlbButtonText, .rlbButton .rlbNoButtonText .rlbMoveDownDisabled .rlbDisabled, .RadListBox_Default .rlbMoveDown .rlbButtonText, .RadListBox_Default .rlbButtonText
    but it is repeating same image twice.
    I want to show previous and next button as shown in attached image, thanks
Back to Top