Solved: Re: URL Field on form launch without showing all t...

martindoll · ‎10-27-2023

I have a URL field on a form in my portal. I Want to either:

Create a button and redirect it to the value of that field

or

Create a redirect that can have the Redirect URL value set to the URL field mentioned above.

Or is there another way...I like the idea of a clean button.....

I assume it has to be in Javascript on the form....but I'll let you all tell me.

Thansk.

EmadBeshai · ‎10-30-2023

Hi @martindoll ,

You can write code similar to the below

$( document ).ready(function() {

$("#<field name>").closest("td").find("div.control, div.info").hide(); // show();
// Sample to how to add button and palcing it after specific HTML element 
$(`<input type="button" name="button1" value="button1" onclick="javascript&colon;navigationFn();" id="button1"class="btn btn-primary button next submit-btn">`).insertAfter($($("#<HTML Element Id>").parent())); //This is how you will place this button on your form.

});
//Navigation function
function navigationFn(){
//Getting the field value
   var fieldvalue=$('#<field name>').val();
 window.location = fieldvalue;
}

At the about I pasted a sample code on how to get the field value, hiding it and passing the field value to button to pass it to function to navigate to the URL inside this field.

You can find more about how to show and hide elements at @OliverRodrigues 's blog and much more of the very rich content, I advise you to read it.

Power Apps Portals – JavaScript Tip #01 – Hide & Show Elements – Oliver Rodrigues (oliverrodrigues36...

If this post helps you with your problem, please mark your as Accepted Solution.

If you like my response, please give it a Thumbs Up.

View solution in original post

EmadBeshai · ‎10-31-2023

Hi @martindoll ,

The HTML element here is referring to the place you want to place your button beside, so at the below screenshot I have search box and let say I want to place my button beside this search, so to be able to do that I will find a unique identifier for the search box (the HTML Element I'm referring to) like the element id or unique CSS class, then I will place my button beside it.

Here I'm trying that at the browser console before making any changes to my Custom JS

Please read more about using jQuery to be able to get the full control against your custom JS jQuery insertAfter() Method (w3schools.com)

If this post helps you with your problem, please mark this answer as Accepted Solution.
If you like my response, please give it a Thumbs Up.

View solution in original post

EmadBeshai · ‎10-28-2023

Hi @martindoll ,

I would go with your idea by creating button that redirects to the field URL and hide the field

If this post helps you with your problem, please mark your as Accepted Solution.

If you like my response, please give it a Thumbs Up.

OliverRodrigues · ‎10-29-2023

Agreed with Emad, do you need help with that JS? technically all you needs is to retrieve the value of the field / hide the field / add a button instead

If you like this post, give a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users find it.

Power Pages Super User | MVP

Oliver Rodrigues

martindoll · ‎10-30-2023

So, yes, what would the js look like in the Power Pages Custom Java area?

EmadBeshai · ‎10-30-2023

Hi @martindoll ,

You can write code similar to the below

$( document ).ready(function() {

$("#<field name>").closest("td").find("div.control, div.info").hide(); // show();
// Sample to how to add button and palcing it after specific HTML element 
$(`<input type="button" name="button1" value="button1" onclick="javascript&colon;navigationFn();" id="button1"class="btn btn-primary button next submit-btn">`).insertAfter($($("#<HTML Element Id>").parent())); //This is how you will place this button on your form.

});
//Navigation function
function navigationFn(){
//Getting the field value
   var fieldvalue=$('#<field name>').val();
 window.location = fieldvalue;
}

At the about I pasted a sample code on how to get the field value, hiding it and passing the field value to button to pass it to function to navigate to the URL inside this field.

You can find more about how to show and hide elements at @OliverRodrigues 's blog and much more of the very rich content, I advise you to read it.

Power Apps Portals – JavaScript Tip #01 – Hide & Show Elements – Oliver Rodrigues (oliverrodrigues36...

If this post helps you with your problem, please mark your as Accepted Solution.

If you like my response, please give it a Thumbs Up.

martindoll · ‎10-30-2023

Thanks you so much....I appreciate the help.

EmadBeshai · ‎10-30-2023

Hi @martindoll ,

My Pleasure!

martindoll · ‎10-30-2023

Hey if I could ask 2 things of this script....(I am having a hard time finding examples of these scripts)

On your script the line var fieldvalue=$('#<field name>').val();
1. Is this the correct syntax if my field name is aqu_wcrurl?
  1. var fieldvalue=$('#<aqu_wcrurl>')
2. Also the line part .insertAfter($($("#<HTML Element Id>")
  1. What is this supposed to be replaced with....what in the html should this be

martindoll · ‎10-30-2023

I figured out #1 in my reply....the field is hidden now.....but I can't find what to populate in the Element id...where to see the html for the particular form.

EmadBeshai · ‎10-31-2023

Hi @martindoll ,

The HTML element here is referring to the place you want to place your button beside, so at the below screenshot I have search box and let say I want to place my button beside this search, so to be able to do that I will find a unique identifier for the search box (the HTML Element I'm referring to) like the element id or unique CSS class, then I will place my button beside it.

Here I'm trying that at the browser console before making any changes to my Custom JS

Please read more about using jQuery to be able to get the full control against your custom JS jQuery insertAfter() Method (w3schools.com)

If this post helps you with your problem, please mark this answer as Accepted Solution.
If you like my response, please give it a Thumbs Up.

URL Field on form launch without showing all the value of the field.

Helpful resources

Community will be READ ONLY July 16th, 5p PDT -July 22nd

Summer of Solutions | Week 4 Results |Winners will be posted on July 24th

Check Out | 2024 Release Wave 2 Plans for Microsoft Dynamics 365 and Microsoft Power Platform

Updates to Transitions in the Power Platform Communities