Access Attributes in client side code

[Jacob Button]

I've looked everywhere I can think of and haven't found anything so if this has already been covered I apologize.

In the OnItemDataBound event of a listbox I've added a few attributes to each of the items.

protected void AgendaItems_ItemDataBound(object sender, RadListBoxItemEventArgs e)
{
     DataRowView dataSourceRow = (DataRowView)e.Item.DataItem;
     e.Item.Attributes.Add("Time", dataSourceRow["Expected_Time"].ToString());
}

what Im trying to do is access those attributes in the client side javascript events.  Is this possible?

my current attempt is

function AgendaItems_OnClientSelectedIndexChanged(sender,args){
    alert(sender.get_selectedItem().get_attributes().getAttribute("Time"));
}

... obviously this isn't working?  Can somebody point me in the right direction?

[Shinu]

Hello Jacob,

Try the following code snippet in order to add the custom attribute and see whether it is working as you expected.

C#:

protected void AgendaItems_ItemDataBound(object sender, RadListBoxItemEventArgs e)
{
    DataRowView dataSourceRow = (DataRowView)e.Item.DataItem;
    e.Item.Attributes["Time"] = dataSourceRow["Expected_Time"].ToString();
}

-Shinu.

[Jacob Button]

Shinu,

This doesn't seem to be making a difference.  I know the custom attributes are being added because I can access them in the ItemTemplate of the Listbox.  However, when I try to access them in the client side events I just get an 'undefined' value.  Am I accessing them the correct way in the client side events?

Thanks,
-Jake

[Vesko]

It is working fine in the latest version.
Try the following: rename the Time attribute to something different - e.g. expectedTime.
Also, you can check the source of the page to see if the attributes are serialized:

$create(Telerik.Web.UI.RadListBox, {"_allowTransferOnDblClick":false,"_scrollPosition":0,"_selectedValue":"RadListBoxItem1","allowTransfer":true,"checkedIndices":[],"clientStateFieldID":"RadListBox1_ClientState","itemData":[{"value":"RadListBoxItem1","selected":true,"attributes":{"test":"mest"}}

see the attributes : { test : mest }

[Tye]

Jacob, did you ever get this working? I'm having the exact same problem. Custom attributes (I have a custom attribute named "Sort") aren't showing up client side...I checked the page source, and while the attributes are on the <li> tag in the list, they are not in the serialization code at the bottom:

<ul class="rlbList">
     <li id="ctl00_ContentPlaceHolder_Body_selectedColumns_i0" title="ColumnName" class="rlbItem" Sort="ASC">

Sys.Application.add_init(function() {
    $create(Telerik.Web.UI.RadListBox, {"_allowTransferOnDblClick":true,"_scrollPosition":0,
"allowReorder":true,"checkedIndices":[],
"clientStateFieldID":"ctl00_ContentPlaceHolder_Body_selectedColumns_ClientState",
"enableDragAndDrop":true,
"itemData":[{"value":"OutstandingTotal"}],"selectedIndices":[],"selectionMode":1}, null, null, $get("ctl00_ContentPlaceHolder_Body_selectedColumns"));

Here's how I'm adding items to the list:

RadListBoxItem item = new RadListBoxItem( );
item.Text = "Text";
item.Value = "Value";
item.ToolTip = "Tooltip";
item.Attributes[ "Sort" ] = sortDir;
selectedColumns.Items.Add( item );
item.DataBind( );

Note that I am using ItemTemplates to show the data (not sure if that's a factor or not).

<telerik:RadListBox ID="selectedColumns" runat="server" Width="270px" Height="270px" AutoPostBackOnTransfer="false" EnableDragAndDrop="true" AllowTransferDuplicates="false" ButtonSettings-ShowTransferAll="false" Sort="Ascending" AllowReorder="true" AllowTransferOnDoubleClick="true" AutoPostBackOnReorder="false" ButtonSettings-ShowReorder="false" TransferMode="Move" SelectionMode="Multiple">
    <ItemTemplate>
        <asp:DropDownList runat="server" ID="ddlSort" >
        <asp:ListItem Text="ASC" Value="asc"></asp:ListItem>
        <asp:ListItem Text="DESC" Value="desc"></asp:ListItem>
        </asp:DropDownList>
        <%# DataBinder.Eval(Container, "Text")%>
    </ItemTemplate>
</telerik:RadListBox>

Thanks,

Tye

[Jacob Button]

Yes, I did get this working.  Where are exactly are you having a problem, are you trying to access the attributes via client-side javascript?  Can I see the code where you're trying to access it?

I think the way I eventually solved it was by using teleriks client-side methods to get to get a reference to the dom element, then basic javascript dom element methods to access the attributes.... (hence, you don't need to worry about the serialization of the attributes, it will pull the attributes straight from the <li> tag)

[Genady Sergeev]

Hello guys,

Please, have in mind that the ItemDataBound event is fire only when RadListBix is bound using a DataSource. If the items are static the following syntax won't invoke ItemDataBound:

item.DataBind( );

Despite this, if an attribute is properly set it should be available on the client. I have verified that this functionality works with the latest version.

Tye, which version of the controls do you use?

Greetings,
Genady Sergeev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.