Error wen using set_selected client api

3 posts, 0 answers
  1. AnneArents
    AnneArents avatar
    14 posts
    Member since:
    Jan 2010

    Posted 26 Jan 2015 Link to this post

    Hi,

    I am using a RadTreeList control and I want to set the selected property (checkbox) of a row, depending on a value from the datasource.
    This is my code:

    <telerik:RadTreeList ID="lstAanbod" runat="server" CssClass="_radgrid" OnNeedDataSource="lstAanbod_NeedDataSource" DataKeyNames="NR" ParentDataKeyNames="PARENT_NR" ClientDataKeyNames="DOSSIER_ID, PROFIEL_ID, GESELECTEERD"  EnableEmbeddedSkins="false" BorderStyle="None" GridLines="None" ShowFooter="true" AutoGenerateColumns="false" AllowMultiItemSelection="true">
        <ItemStyle HorizontalAlign="Left"></ItemStyle>
        <Columns>
            <telerik:TreeListSelectColumn HeaderStyle-Width="38px" UniqueName="SelectColumn"></telerik:TreeListSelectColumn>                   
            <telerik:TreeListBoundColumn HeaderStyle-Width="10%" DataField="CODE" HeaderText="Code"></telerik:TreeListBoundColumn>
            <telerik:TreeListBoundColumn HeaderStyle-Width="60%" DataField="TITEL" HeaderText="Titel"></telerik:TreeListBoundColumn>
            <telerik:TreeListBoundColumn HeaderStyle-Width="10%" DataField="NIVEAU" HeaderText="Niveau"></telerik:TreeListBoundColumn>
            <telerik:TreeListBoundColumn HeaderStyle-Width="10%" DataField="DOSSIER_ID" HeaderText="Niveau" Visible="false"></telerik:TreeListBoundColumn>
            <telerik:TreeListBoundColumn HeaderStyle-Width="10%" DataField="PROFIEL_ID" HeaderText="Niveau" Visible="false"></telerik:TreeListBoundColumn>     
        </Columns>         
        <ClientSettings Selecting-AllowItemSelection="true" Selecting-UseSelectColumnOnly="true" Selecting-AllowToggleSelection="true" ClientEvents-OnItemSelected="OnClientNodeSelected" ClientEvents-OnTreeListCreated="treeListCreated"></ClientSettings>     
    </telerik:RadTreeList>


    function UpdateAllChildren(currNode, nodes, nodecount, checked) {           
        var i;
        for (i = 0; i < nodecount; i++) {
            if (checked) {
                nodes[i].set_selected(true);
            }
            else {
                nodes[i].set_selected(false);
            }
        }
    }
     
    function treeListCreated(sender, args) {
        var items = sender.get_dataItems();
         
        for (var i = 0; i < items.length; i++) {
            var item = items[i];               
            if (item.get_dataKeyValue("GESELECTEERD") == "True") {                   
                item.set_selected(true);
            }
        }
    }

    However, when I run my page, I get an error on the line 'item_set_selected(true)' :

    Unhandled exception at line 808, column 27 in http://localhost:11488/ScriptResource.axd? ...
    0x800a138f - Runtime-fout JavaScript: Unable to get property '_selectedIndexes' of undefined or null referenced

    What am I doing wrong?
  2. AnneArents
    AnneArents avatar
    14 posts
    Member since:
    Jan 2010

    Posted 26 Jan 2015 in reply to AnneArents Link to this post

    Edit: I had forgotten one javascript function:

    function OnClientNodeSelected(sender, args) {  
        var currNode = args.get_item();
        var childNodes = currNode.get_childItems();
        var nodeCount = childNodes.length;           
        if (nodeCount > 0) {
            var isChecked = currNode.get_selected();
            UpdateAllChildren(currNode, childNodes, nodeCount, isChecked);
        }
    }
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Kostadin
    Admin
    Kostadin avatar
    1713 posts

    Posted 29 Jan 2015 Link to this post

    Hi Scholten,

    Note that OnTreeListCreated client event is fired to early and its items are still not created. I would recommend you to use pageLoad client event to select the items. Please check out the following code snippet.
    function pageLoad() {
        var treeList = $find('<%= RadTreeList1.ClientID %>');
        var items = treeList.get_dataItems();
     
        for (var i = 0; i < items.length; i++) {
            var item = items[i];
            debugger;
            if (item.get_dataKeyValue("GESELECTEERD") == "True") {
                debugger;
                item.set_selected(true);
            }
        }
    }


    Regards,
    Kostadin
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top