Set content of sub item in select event of a panelbar item

2 posts, 0 answers
  1. Hiren
    Hiren avatar
    7 posts
    Member since:
    Jun 2014

    Posted 25 Jun 2014 Link to this post


    On select event of a panel bar item, I want to make an ajax call and set the content for sub item.

    I started with the sample code as shown below. The issue is, it only sets the content for 1st item.

    Thanks for your time and help.


     <script id="resultstemplate" type="text/x-kendo-template">
           <ul id="resultsPanelBar">
               # for (var i = 0; i < data.length; i++) { #
                    <li>#= data[i].name #<br/>#= data[i].addressLine1 #<br/>#= data[i].addressLine2 #, #= data[i].phone #
                                       <span style="display:none">|#= data[i].comprehensiveProviderId #</span>
                                 <ul  id ="resultDetails"></ul>
            # } #
    function onSelect(e) {
            var selectedText = $(e.item).find("> .k-link").text();
            var splitSelectedText = selectedText.split('|');
            console.log("selectedText : " + selectedText);
                     console.log("Comprehensive Provider ID  : " + splitSelectedText[1]);
                  $("#resultDetails").html("<li>"+splitSelectedText[1] +"</li>");

  2. Hiren
    Hiren avatar
    7 posts
    Member since:
    Jun 2014

    Posted 26 Jun 2014 in reply to Hiren Link to this post

    The issue has been resolved. Appended the index to the id of ul created and in onSelect method, used the same index to populate the content of sub list item.


  3. Kendo UI is VS 2017 Ready
Back to Top