Dynamic menus

[Mlothswwa]

Hi,

May someone please help with the below. I have copied this from one of the Caspio discussions.

The below is not working for me. For some reason, it is not executing the IF statement. Statements before the IF work and outside the IF. 

If I add a display statement inside the IF, there is no display.

May someone please advise why the below is not working

<div id="menu"></div>

<script>
document.addEventListener('DataPageReady', function (event) {
if("[@authfield:Role]" == "Admin"){
document.getElementById('menu').innerHTML = '[@app:Admin]';
}
else if ("[@authfield:Role]" == "Agent"){
document.getElementById('menu').innerHTML =  '[@app:Agent]';
}
});
</script>

[CoopperBackpack]

Hello @Mlothswwa,

The main reason for the ignored IF statement is that the condition in the statement is not met. 

Could you double-check whether the authentication parameter has the correct name? In your example, its name is 'Role'.

If you use a View as a data source to create an Authentication, the field names in a View consist of the table.name_field.name.

You may always use the 'Insert' icon to add the correct field name:

If this doesn't help, please clarify the following:

1) The DataPage type where you applied the script;

2) The data type of the Role field (Text(255), Yes/No, etc.);

3) Values that are used in the Role field;

4) Object that is used to create an Authentication (Table or View).

[Mlothswwa]

Hi @CoopperBackpack

Thanks for the response.

The condition in my case is met.  In my data page I am using a field from a table and checking it against a constant value.

If I display the table field before the IF,  it shows the value I am expecting it to have.

The data page is a report and the script is included in the Header.

The data type is text(255)

The data field has "7" and I am checking if it's "7"

The report data page where I have updated the Header is called by another report data page.

If don't display the Role field and have separate line to use the APP parameter outside the IF,  I get the report preview as per 1 attached.

If I display the role field and have a separate line for the APP parameter as per below, I get the report preview as per 2 attached, showing the role field and also showing the menu I want.

 

 

<div id="menu"></div>

[@field:MemberStokvel_MB_Role]

<script>
document.addEventListener('DataPageReady', function (event) {
if("[@field:MemberStokvel_MB_Role]" == "7"){
document.getElementById('menu').innerHTML = '[@app:SV_MB_Menu]';
}
else if ("[@field:MemberStokvel_MB_Role]" == "4"){
document.getElementById('menu').innerHTML =  '[@app:SV_Admin_Menu]';
}
});
</script>

[@app:SV_MB_Menu]

Stokvel Member Preview 2.pdf Stokvel Member Preview 1.pdf

[Volomeister]

Hi @Mlothswwa

When creating conditional menu, ususally, one must use refer to authentication fields in the conditional logic. When you use if("[@field:MemberStokvel_MB_Role]" == "7"). you are checking the value of the first record from the search results in your case. It will lead to unexpected behavior if there are no search results, so you need to use it in the format you shared in the beginning:
 

if("[@authfield:Role]" == "7")

Also, JavaScript is sensitive when it comes to inserting HTML and if HTML code has multiple lines, it will throw errors when wrapped in ''
Your app parameter more likely has multiple HTML lines.
I could suggest wrapping app parameter in `` quotes instead of '' quotes so it will look something like:
 

document.getElementById('menu').innerHTML = `[@app:Admin]`;

Let me know if that helped

[CoopperBackpack]

Hello @Mlothswwa,

I agree with the Volomeister. And have one more comment.

If the Role is the Authentication parameter the syntax to reference it is [@authfield:MemberStokvel_MB_Role]

However, I assume that this can be a value that is received as an External parameter that filters records. In this case, the syntax is:

if("[@MemberStokvel_MB_Role]" == "7")

[Mlothswwa]

@CoopperBackpack and @Volomeister

Thanks to both for your responses.

Am not sure what happened, I had posted a reply on Thursday, and I see it's not here.

Firstly,  the quotes suggestion from Volomeister worked. By changing from a single forward quote to a single back quote, the menu is now displaying based on the user role. Thank You.

As for my user role. My data is such that, a user may have more than one roles, thus the role is on another table not the user table. I have a view that ensures that I have one record per user for the required role.

For now all is fine.

Thank You.

[Kurumi]

Here are some related forum posts about dynamic menus

 

[PotatoMato]

Hi! Just to update, Caspio has an article about custom navigation menu based on user role: https://howto.caspio.com/tech-tips-and-articles/customizing-navigation-menu-based-on-user-roles/

 

-Potato