Render a nested JSON structure by custom template in Dropdown list

4 posts, 0 answers
  1. Arnab
    Arnab avatar
    2 posts
    Member since:
    Feb 2015

    Posted 24 Feb 2015 Link to this post

    I've a JSON structure as:

    $scope.fileList = [
            {
              name: '340000SRF76',
              files: ['123456789', '3248734567754']
            },
            {
              name: '340000EFG76',
              files: ['1238436589', '3242334567754']
            },
            {
              name: '340000SHY76',
              files: ['123286789', '324584567754']
            }
    ];

    I've to show the dropdown as:

    340000SRF76
      123456789
      3248734567754
     
    340000EFG76
      1238436589
      3242334567754
     
    340000SHY76
      123456789
      324584567754


    There will be some icon beside each of the 'name's. And by clicking the 'name's, the 'files' list will show and user can select a file. Selected value will be the file-id (like 123456789, 3248734567754 etc).

    Can you please help?
  2. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3707 posts

    Posted 26 Feb 2015 Link to this post

    Hello Arnab,

    I would suggest you use a custom item template, that allows to control the rendering of the suggestion item and thus you can list the values of the files array. The context of the template will be the whole data item, hence you will have access to the name and files fields. The template could look something like this:
    <script id="template" type="text/x-kendo-tmpl">
    <div>#:name#</div>
    <div>
      # for (var idx = 0; idx < files.length; idx++) { #
        <span>#: files[idx] #</span>
      # } #
    </div>
    </script>

    Please review our online demos and the Templates Overview help topic.

    Regards,
    Georgi Krustev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Arnab
    Arnab avatar
    2 posts
    Member since:
    Feb 2015

    Posted 26 Feb 2015 in reply to Georgi Krustev Link to this post

    Hi Georgi,

    Yes, I was able to write one custom template like you suggested. But, what I couldn't do, was to specify the 'dataTextField' and 'dataValueField' in the configuration, as user can select any item in the 'files' array, as I mentioned earlier. Can you please recommend a way to do this.

    Thanks & regards,
    Arnab Das
  5. Alexander Popov
    Admin
    Alexander Popov avatar
    1416 posts

    Posted 03 Mar 2015 Link to this post

    Hello Arnab,

    I am afraid that selecting an array item is an unsupported scenario and there is no good workaround that we could suggest, other than flattening your data.

    Regards,
    Alexander Popov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready