Listbox row number

5 posts, 0 answers
  1. Dipal
    Dipal avatar
    9 posts
    Member since:
    Sep 2012

    Posted 06 Nov 2012 Link to this post

    Hi All,

    I want to show row number for each item in rad listbox control.  
    After binding row number if user drag and drop any item it should rebind.

    For example
    Initially it should show row number as shown in below table.

    Row Number

    Image Id

    1

    111

    2

    222


    When user change order of items using drag and drop, it should not change Row number value.

    Row Number

    Image Id

    1

    222

    2

    111


    Is it possible to handle at client side, page should not get posted?

    Thanks,
    Dipal
  2. Nencho
    Admin
    Nencho avatar
    1458 posts

    Posted 09 Nov 2012 Link to this post

    Hello Dipal,

    I can suggest you to use the OnClientReordered and OnClientLoad client events, in order to achieve the desired functionality. You could loop through all RadListBoxItems and alter the text in the following manner:

    <script>
               function Enumerate(sender, eventArgs) {
                   var items = sender.get_items();
                   var length = items.get_count();
                  for (var i = 0; i < length; i++) {
     
                      var value = items.getItem(i).get_value();
                      items.getItem(i).set_text(i + " " + value);
                  }
              }
          </script>
          <div>
              <telerik:RadListBox runat="server" ID="RadListBox" AllowReorder="true" Height="300px" OnClientLoad="Enumerate" OnClientReordered="Enumerate">
                  <Items>
                      <telerik:RadListBoxItem runat="server" Value="Item1" Text="1" />
                      <telerik:RadListBoxItem runat="server" Value="Item2" Text="2" />
                      <telerik:RadListBoxItem runat="server" Value="Item3" Text="3" />
                      <telerik:RadListBoxItem runat="server" Value="Item4" Text="4" />
                      <telerik:RadListBoxItem runat="server" Value="Item5" Text="5" />
                  </Items>
              </telerik:RadListBox>


    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Dipal
    Dipal avatar
    9 posts
    Member since:
    Sep 2012

    Posted 22 Nov 2012 Link to this post

    Thanks Nencho,

    This client side scripting is working perfectly in Internet Explorer but not in mozilla firefox and google crome.
    Can you please guide how to achieve this functionality for other browsers?

    Thanks,
    Dipal
  5. Dipal
    Dipal avatar
    9 posts
    Member since:
    Sep 2012

    Posted 26 Nov 2012 Link to this post

    Hi,

    Can anyone please answer my query?

    Thanks,
    Dipal
  6. Nencho
    Admin
    Nencho avatar
    1458 posts

    Posted 27 Nov 2012 Link to this post

    Hello Dipal,

    Unfortunately, I was unable to replicate the experienced problem. The desired functionality works properly at my end, under the three specified browsers. In addition, I have recorded a video, demonstrating the behavior at my end. Could you clarify about the version of our controls that you use at your end?

    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.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017