This is a migrated thread and some comments may be shown as answers.

get_clientDataKeyValue() is always empty

1 Answer 46 Views
ListView
This is a migrated thread and some comments may be shown as answers.
Stuart Hemming
Top achievements
Rank 2
Stuart Hemming asked on 25 May 2012, 01:23 PM
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


1 Answer, 1 is accepted

Sort by
0
Tsvetina
Telerik team
answered on 30 May 2012, 08:38 AM
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
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.
Tags
ListView
Asked by
Stuart Hemming
Top achievements
Rank 2
Answers by
Tsvetina
Telerik team
Share this question
or