News and Announcements icon

Power Platform CommunityForums Power Pages - General Discussions Use Liquid Variable (g...

Power Pages - General Discussions

Unanswered

Use Liquid Variable (generated in html) to javascript

Like (0) Share

Report

Report

Posted on 5 Jul 2023 14:48:06 by Juanse

12

Hello!

I am building a Power Page and I need to reference in my Javascript (advanced web page options) a variable generated in Liquid code in the HTML.

HTML code (liquid)

{% fetchxml articles_search %}

<fetch version= "1.0" output-format= "xml-platform" mapping="logical" distinct="false" no-lock="true" >

<entity name="knowledgearticle">

<attribute name="title" alias="titulo_articulo" />

<attribute name="content" alias="contenido_articulo" />

<attribute name="knowledgearticleid" alias="id_articulo" />

</entity>

</fetch>

{% endfetchxml %}

{% assign articles_for_search = articles_search.results.entities %}

<script type="text/javascript">

var articles_for_searching = {{articles_for_search|json}};

</script>

Javascript code

inputSearch.onkeyup = e => {

let userData = e.target.value;

let emptyArray = [];

if (userData) {

emptyArray = articles_for_searching.filter(data => {

return data

.toLocaleLowerCase()

.startsWith(userData.toLocaleLowerCase());

});

console.log(emptyArray)

}}

But when I test the page running the console.log, I get the following error:

I need to call the variable in js somehow or what am I doing wrong?

Thanks!

Categories:

All responses Img

All responses (1)

Answers Img

Answers (0)

Lucas001 2,143 Super User 2025 Season 1 on 06 Jul 2023 at 06:14:43

Like (0)

Report
Re: Use Liquid Variable (generated in html) to javascript

Hi @Juanse,

from what I see the problem relies in the line:
var articles_for_searching = {{articles_for_search|json}};
What happens if you just console log after that line?

I usually use a webteamplate on another page to fetch the XML and refer to that page from whereever I want to use the JSON data.
You can reference the text from the website containing only JSON and use JSON.parse() to afterwards further manipulate it.
{% fetchxml YourEntity %} <fetch> <entity name="YourEntityName"> <attribute name="Attr1" /> <attribute name="Attr2" /> </entity> </fetch> {% endfetchxml %}  [ {% for item in YourEntity.results.entities %} { "id": "{{ item.id }}", "name": "{{ item.name }}" }{% unless forloop.last %}, {% endunless %} {% endfor %} ]

Helpful resources

News and Announcements

Welcome to the Power Platform Communities - Lets Get Started!

Announcing new navigation menus and the Engage with the Community forum!

Quick Links

Leaderboard > Power Pages - General Discussions

#1

Fubar 15 Super User 2025 Season 1

#2

Jon Unzueta 14

#3

Michael E. Gernaey 11 Super User 2025 Season 1

Overall leaderboard

Featured topics

Solution to LinkedIn Authentication in Power Apps Portals

Product updates

Microsoft Power Platform Community release plans