[Solved] client side iteration through ListBox items

[John Mann]

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

[Princy]

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

[John Mann]

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?

[Kate]

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