web
You’re offline. This is a read only version of the page.
close
Skip to main content

Announcements

News and Announcements icon
Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Pages / Power page metadata fo...
Power Pages
Unanswered

Power page metadata for a specific choice field not working with JavaScript

(0) ShareShare
ReportReport
Posted on by 42
In a power page, i  applied JavaScript to a specific attribute:

$(document).ready(function(){

$("#cr44test1").on("change", onChangeEvent);
onChangeEvent();

});

function onChangeEvent(){
var varOption = $('#cr44test1').find("option:selected").text();
if(varOption === "*"){

$('#WebResource_new_12').parent().parent().show();
$('#WebResource_new_13').parent().parent().hide();
$('#WebResource_new_14').parent().parent().hide();
$('#WebResource_new_15').parent().parent().hide();
$('#WebResource_new_16').parent().parent().hide();

alert(varOption);

}
else if(varOption === "**"){

$('#WebResource_new_12').parent().parent().hide();
$('#WebResource_new_13').parent().parent().show();
$('#WebResource_new_14').parent().parent().hide();
$('#WebResource_new_15').parent().parent().hide();
$('#WebResource_new_16').parent().parent().hide();

alert($(this).val());

}
else if(varOption === "***"){

$('#WebResource_new_12').parent().parent().hide();
$('#WebResource_new_13').parent().parent().hide();
$('#WebResource_new_14').parent().parent().show();
$('#WebResource_new_15').parent().parent().hide();
$('#WebResource_new_16').parent().parent().hide();

}
else if(varOption === "****"){

$('#WebResource_new_12').parent().parent().hide();
$('#WebResource_new_13').parent().parent().hide();
$('#WebResource_new_14').parent().parent().hide();
$('#WebResource_new_15').parent().parent().show();
$('#WebResource_new_16').parent().parent().hide();

}
else if(varOption === "*****"){

$('#WebResource_new_12').parent().parent().hide();
$('#WebResource_new_13').parent().parent().hide();
$('#WebResource_new_14').parent().parent().hide();
$('#WebResource_new_15').parent().parent().hide();
$('#WebResource_new_16').parent().parent().show();

}
else{

$('#WebResource_new_12').parent().parent().hide();
$('#WebResource_new_13').parent().parent().hide();
$('#WebResource_new_14').parent().parent().hide();
$('#WebResource_new_15').parent().parent().hide();
$('#WebResource_new_16').parent().parent().hide();
alert(varOption);
}
}

 

This attribute [ cr44test1 ] is a choice field, and the possible values are from one star to 5 stars. (5 possible option)

 

 

dalemb_0-1715856674009.png

 

 

 

dalemb_1-1715856674058.png

 

 

 

The issue is that i need to have that choice attribute rendering all the options on the horizontal line, to do that, i make use of the Microsoft Metadata:

 

dalemb_2-1715856673765.png

 

 

The issue is that, by doing that, the attribute cr44test1 is not longer retrieved by the script:

 

dalemb_3-1715856673841.png

 

 

 

It seems that the Microsoft metadata applies a script on the top with no logical attribute reference.

 

Also,

 

How can we access the values using JavaScript to a Star Rating controller. It seems to have the same issue:

 

dalemb_4-1715856673705.png

 

A script works without applying the Star Rating control (whole number) but once the Microsoft control is applied id doesn't work.

 

Thanks,

Categories:
I have the same question (0)
  • oliver.rodrigues Profile Picture
    9,471 Most Valuable Professional on at

    Hello, I would recommend using the start control instead of the custom choice option as that's OOB. That's technically a PCF control, so applying JS there is a bit trickier, you need to use a Mutant Observer to check when the control actually gets loaded on the page, this is because it loads after the page onload.
    Let me know if you need help with the code.

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

Introducing the 2026 Season 1 community Super Users

Congratulations to our 2026 Super Users!

Kudos to our 2025 Community Spotlight Honorees

Congratulations to our 2025 community superstars!

Congratulations to the April Top 10 Community Leaders!

These are the community rock stars!

Leaderboard > Power Pages

#1
Valantis Profile Picture

Valantis 65

#2
11manish Profile Picture

11manish 55

#3
Vish WR Profile Picture

Vish WR 29

Last 30 days Overall leaderboard