get_clientDataKeyValue() is always empty

[Stuart Hemming]

I have a ListView defined like this ...

<telerik:RadListView runat="server"
                     ID="RadListView1"
                     AllowMultiItemSelection="false"
                     ItemPlaceholderID="items"
                     ClientDataKeyNames="ContactId, Surname, Forename, Organisation, Email">
    <LayoutTemplate>
        <div id="listview"
             class="RadListView RadListView_#= owner.Skin #">
            <asp:Panel runat="server"
                       ID="items"
                       ScrollBars="Vertical"/>
        </div>
    </LayoutTemplate>
    <ClientSettings>
        <ClientEvents OnCommand="radListView1_OnCommand"/>
        <DataBinding>
            <ItemTemplate>
                <div class="item">
                    <div>
                        <strong>#= String.format("{0}, {1}", Surname, Forename) #</strong>
                    </div>
                    <div>#= Organisation #</div>
                    <div>#= Email #</div>
                </div>
            </ItemTemplate>
            <SelectedItemTemplate>
                <div class="item selected">
                    <div>
                        <strong>#= String.format("{0}, {1}", Surname, Forename) #</strong>
                    </div>
                    <div>Home: #= HomePhone #</div>
                    <div>Mobile: #= Mobile #</div>
                </div>
            </SelectedItemTemplate>
        </DataBinding>
    </ClientSettings>
</telerik:RadListView>

Simple.
When an item in the ListView is clicked, the following code runs...

listView.toggleSelection(index);
var clientDataValues = listView.get_clientDataKeyValue()[index];

Where index is the item index of the item clicked.

My problem is that clientDataValues is always empty. I know that the value of index is correct 'cos the items selected state toggles correctly. Even if I hard-code an index it's empty.

Am I supposed to cast a different spell if I'm client-side binding?

--
Stuart

[Tsvetina]

Hello Stuart,

I am just posting the suggested approach in this scenario, along with the explanation in case anyone is interested. You could later update the thread if you come up with a more interesting solution :)

The ClientDataKeyNames and the respective values collections have been implemented when there was no client-side binding for RadListView, so you can have access to values that are available only on the server.
However, with client binding, you get the whole binding context client-side and these values are accessible, so the key values collection is not populated.

Here is one implementation that would provide you with the same result. The service is a public one, so you can test the whole mark-up locally:

<script type="text/javascript">

    function itemSelected(index, keyValue) {
        alert(keyValue);
    }

</script>
<asp:ScriptManager runat="server" ID="ScriptManager1">
</asp:ScriptManager>
<telerik:RadListView runat="server" ID="RadListView1" AllowMultiItemSelection="false"
    Skin="Default">
    <ClientSettings>
        <DataBinding ItemPlaceHolderID="items">
            <LayoutTemplate>
                        <div id="listview" class="RadListView RadListView_#= owner.Skin #">
                            <div id="items" style="border-top: 1px solid grey; overflow-y: scroll"  />
                        </div>
            </LayoutTemplate>
            <DataService Location="http://services.odata.org/Northwind/Northwind.svc/Products"
                ResponseType="JSONP" HttpMethod="Get" FilterParameterType="OData" SortParameterType="OData" />
            <ItemTemplate>
                        <div class="item" onclick="itemSelected('#=index#', '#=ProductID#')">
                            <span style="line-height:50px">#=ProductName#</span>
                        </div>
            </ItemTemplate>
        </DataBinding>
    </ClientSettings>
</telerik:RadListView>

All the best,
Tsvetina
the Telerik team