Skip to main content
Community site session details

Community site session details

Session Id :
Power Pages - Power Apps Portals
Unanswered

fetch entity data and loop in java script in web template

(0) ShareShare
ReportReport
Posted on by 2

creating a web template to represent entity data in tree structure .. 

 

to get n no.of child hierarchy need to loop in javascript fuction .. where my entity has data paret column and Child column..

 

 

how to loop entity data in javascript function.

  • Fubar Profile Picture
    8,023 Super User 2025 Season 1 on at
    Re: fetch entity data and loop in java script in web template

    Either the way in the link Oliver provided or something similar. 

    The example in the link is where you setup a web template and then use ajax to call a page based on that template - if you want to just put it in the Web Template behind your page rather than calling the other page it is very similar except where they dump out the JSON (about line 16 in the image in the link) you just do a   

    <script> var myResult = { "results":  ...output here ......} </script>  then when the template renders you just access myResult.

     

    The approach depends on what you may need - e.g. are you going to want to load the JSON from the fetchxml multiple times (or need to re-fetch with a condition based on some user input) when on the page or do you just need it there at the web page load.

  • oliver.rodrigues Profile Picture
    9,342 Most Valuable Professional on at
    Re: fetch entity data and loop in java script in web template

    something that I like to do is create a web template that will retrieve my data in a JSON format, you can follow the steps from this article: https://www.inogic.com/blog/2020/11/use-of-json-type-web-templates-in-powerapps-portals/

     

  • Bhagath6 Profile Picture
    2 on at
    Re: fetch entity data and loop in java script in web template

    Thank you Fubar for your response.

     

    in my entity having data like.

     

     Entity treedata 
        
     ColumnsParentchild
       a
       b
       c
      aaa
      aaaa
      bbb
      ccc
      aaaa1
      aaaa2
      bbbb1
      cccc

     

    i want to represent like:

     

    • a
      • aa
        • aa1
      • aaa
    • b
      • bb
    • c
      • cc

     

    to get this... i am fetching my entity data

     

    through fetchxml in liquid code

     

    {% fetchxml qr %}
    <fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false">
    <entity name="Parent"/>
    <attribute name="Child" />
    <order attribute="tdataid" descending="false" />
    </entity>
    </fetch>
    {% endfetchxml %}
    {% for result in qr.results.entities %}
    <li>
    <span class="rootTree"></span>
    <a>{{result.Child}}</a>
    <script>
    sub();
    </script>
    </li>
    {% endfor %}
    </ul>
     
    <script>
    function sub() {
    function createListItem(text) {
    var li = document.createElement('li');
    li.textContent = text;
    return li;
    }
    function appendChildren(parent, children) {
    children.forEach(function(child) {
    parent.appendChild(child);
    });
    }
    var mylist = document.getElementById('my-list');
    var items = [
    createListItem('p'),
    createListItem('D'),
    createListItem('f'),
    ];
    appendChildren(mylist, items);
    }
    </script>
     
     
    Here, my question is...
    as i shown tree structure i need to get with my data...
     
    How to pass my fetch result to script and loop childs with no limit.
     
    thanks in advance.
     
  • Fubar Profile Picture
    8,023 Super User 2025 Season 1 on at
    Re: fetch entity data and loop in java script in web template

    To answer properly need to better understand what you are doing (provide some of your code etc).

     

    Usually you run a fetch query in Liquid and then loop the results (in liquid) and write an array, Object, or JSON object as a JS variable.  Then in JS you just access the variable you created.

     

    Accessing the data in the JS variable would be a for, forEach, via Keyword, for key in,  or in JQuery $.each() etc depending on how you approach it

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Paul Stork – Community Spotlight

We are honored to recognize Paul Stork as our July 2025 Community…

Congratulations to the June Top 10 Community Leaders!

These are the community rock stars!

Announcing the Engage with the Community forum!

This forum is your space to connect, share, and grow!

Leaderboard > Power Pages

#1
Lucas001 Profile Picture

Lucas001 60 Super User 2025 Season 1

#2
Fubar Profile Picture

Fubar 55 Super User 2025 Season 1

#3
surya narayanan Profile Picture

surya narayanan 35