On Render Event

2 posts, 0 answers
  1. Joshua Austin
    Joshua Austin avatar
    1 posts
    Member since:
    Jun 2012

    Posted 12 Jun 2012 Link to this post

    I have a list view that I have created.  I would like to trigger an event when an item in the list view is double clicked.

    To do this, I have the following template:
    <script id="uxMyTemplate" type="text/x-kendo-tmpl">
            <div class="cwcs_listItem" data-id="${ID}">
                <h2>${Name}</h2>
                <p>
                    ${Description}
                </p>
            </div>
        </script>

    And the following function to register the event:
    function _setItemDoubleClickEvent() {
        var items = $(".cwcs_listItem");
        items.dblclick(function() { alert("Double Click!"); });
    }

    Unfortunately this doesnt do me any good before the data has been retrieved and the template rendered in the list view.
    My question is: Is there an event I can register for which will be called when a kendo control has finished rendering a template?
  2. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 14 Jun 2012 Link to this post

    Hello Joshua,

    To achieve this you could hook up the dataBound event of the Kendo UI ListView. For example: 
    $("#listView").kendoListView({
       dataSource: dataSource,
       template: kendo.template($("#uxMyTemplate").html()),
       dataBound: _setItemDoubleClickEvent
    });
     
    // ...
    function _setItemDoubleClickEvent() {
       var items = $(".cwcs_listItem");
       items.dblclick(function() { alert("Double Click!"); });
    }

    Another approach for implementation of such functionality is to use jquery delegates. For example:
    $("#listView").delegate(".cwcs_listItem", "dblclick"function() {
        alert("Double Click!");
    });

    I hope this helps. 

    Greetings,
    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top