client side iteration through ListBox items

4 posts, 0 answers
  1. John Mann
    John Mann avatar
    34 posts
    Member since:
    Nov 2008

    Posted 25 Jan 2013 Link to this post

    Hi, 

    I have the following ListBox and I want to loop through the values entered into the text box and enable a button if they pass validation.

    <telerik:RadListBox ID="rlbDocuments" runat="server" EnableDragAndDrop="True" AllowReorder="True" Height="400px" Width="480px" ButtonSettings-ShowReorder="False">
      <HeaderTemplate>
        <div style="width: 88px; text-align: center; clear: none; float: left;">Page Count</div>
        <div style="width: 160px; clear: none; float: left;">Document Name</div>
        <div style="width: 160px; clear: none; float: left;">Document Type</div>
      </HeaderTemplate>
      <ItemTemplate>
        <div style="width: 100%; height: 28px;">
          <input id="txtPageCount" type="text" style="width: 40px; margin: 0 18px; clear: none; float: left;" onchange="txtPageCount_TextChanged()" />
          <div style="width: 160px; clear: none; float: left;"><%# Eval("documentName") %></div>
          <div style="width: 160px; clear: none; float: left;"><%# Eval("documentType") %></div>
        </div>
      </ItemTemplate>
    </telerik:RadListBox>

    I've gone through your examples using and tried some things like below, but I have not found the magic formula for finding the text box in each row and getting its value.

    var list = $find("<%= rlbDocuments.ClientID %>");
     
    var items = list.get_items();

    I'm finding the list and getting its items, but cannot find the controls inside each row. Can you please give me some guidance here?

    Thanks,
    John

  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 28 Jan 2013 Link to this post

    Hi,

    Try the following code to access controls in ItemTemplate.
    JS:
    function OnClientClick()
    {
     var list = $find("<%= rlbDocuments.ClientID %>");
      var items = list.get_items();
      for (var i = 0; i < items.get_count(); i++) {
               var txt= items.getItem(i).get_element("TextBox1");
     }
    }

    Thanks,
    Princy
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. John Mann
    John Mann avatar
    34 posts
    Member since:
    Nov 2008

    Posted 29 Jan 2013 Link to this post

    Thank you, although that is one of the methods that I tried before which didn't work. I did play around with it some more today and found that by drilling deeper into the object I can get the value of the test box.

    Here's what I did,
    var txt = items.getItem(i).get_element("TextBox1").all[1].firstChild.value;

    This doesn't make sense to me because in the example you showed the txt var has an innerHTML property that contains all the elements in the row even though we searched for the element TextBox1. I don't like having to hardcode the [1] in there and I suspect that if the list box structure changes that it may break. Can you suggest a better method than what I have done?
  5. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 01 Feb 2013 Link to this post

    Hello John,

    Currently I can only suggest using the approach that Princy provided - looping through the RadListBoxItems using the approach described here (at the end of the page). 

    All the best,
    Kate
    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