Skip to main content
Solved

Server Application : How to create a dropdown menu for dashboards ?

  • February 27, 2023
  • 6 replies
  • 165 views
lgrie
Contributor
Forum|alt.badge.img+7
  • lgrieContributor
  • Contributor

Hello,

I am currently working on a Server App that displays different dashboards.

Based on a published parameter the user can select one dashboard and is lead to the one selected. 

To fascilitate the usage I'd like to introduce a drop-down menu  (bearing the names of all published parameters options) on the very same page as the dashboard.  

So far I managed to do the menu:

<form method="post" action="">
    <p>
        <label for="pays">Quel dashboard ?</label><br> 
        <select name="dashboard" id="Dashboard">
            <option value="ctrl_job_dr">exemple1</option>
            <option value="ctrl_job_semaine">exemple2</option>
        </select>
    </p>
 </form>
 
 <input type="submit" value="Envoyer">

 

image 

Just inserting a link (href) does not work in this case for the link does only point to the fmw file.

Here's the request I get when I select a dasboard:

imageDoes someone has an idea of how to put that into an html form (drop-down menu)?

Thanks in advance !

Best answer by mattmatsafe

evieatsafe wrote:

Hi @lgrie​ just want to clarify, you don't want to have the choice/dropdown as a parameter but rather have it within the streamed HTML after submitting the server app? 

 

If this is the case, you can edit the HTML within the HTMLReportGenerator transformer and selecting 'Custom HTML' in the page contents. This may present more issues such as hardcoding elements yourself; however, you can find more details on the use of HTML and FME here: How to Customize HTML Reports

Hi @lgrie​ I noticed that your submit button is outside of your form element, that may be one of the problems. 

A more simple option might to just include a link back to the app on your streamed page, so you can reselect a dashboard from there. It's only one extra click. If you really want to try and save the extra click, create a data-streaming workspace webhook URL from your dashboard workspace (see instructions here) and use that URL as your form action. For example:

<form action="https://yourfmeserver.com/fmedatastreaming/repositoryname/createdashboard.fmw?DestDataset_HTML=C%3A%5CData%5Cresultspage.html&token=123456abcdef">
    <p>
        <label for="nom">Quel dashboard ?</label><br> 
        <select name="nom" id="nom">
            <option value="ctrl_job_dr">exemple1</option>
            <option value="ctrl_job_semaine">exemple2</option>
        </select>
    </p>
     <input type="submit" value="submit">
 </form>

A parameter named 'nom' and its selected value (dashboard name) will then be passed in the webhook URL when the user clicks submit.

The field name on the form must match the published parameter in the workspace (nom).

View original
Did this help you find an answer to your question?

6 replies

redgeographics
Celebrity
Forum|alt.badge.img+49

Maybe I'm overlooking something obvious here, but why not make a choice user parameter on the workspace? That way FME Server will automatically create a dropdown for it.

lgrie
Contributor
Forum|alt.badge.img+7
  • lgrieContributor
  • Author
  • Contributor
  • February 27, 2023

Hello, I am affraid I expressed myself rather badly.

I do have a choice user parameter and FME Server creates a drop-down menu based on the entries.

Capture2BUT if I want to switch between the graphics/dashboards I have to return to this page to select another one.

I'd like to avoid that and simplify the switching by adding a drop down menu to the dashboar page.

Like so :

Capture 

evieatsafe
Safer
  • evieatsafeSafer
  • Safer
  • February 27, 2023
lgrie wrote:

Hello, I am affraid I expressed myself rather badly.

I do have a choice user parameter and FME Server creates a drop-down menu based on the entries.

Capture2BUT if I want to switch between the graphics/dashboards I have to return to this page to select another one.

I'd like to avoid that and simplify the switching by adding a drop down menu to the dashboar page.

Like so :

Capture 

Hi @lgrie​ just want to clarify, you don't want to have the choice/dropdown as a parameter but rather have it within the streamed HTML after submitting the server app?

 

If this is the case, you can edit the HTML within the HTMLReportGenerator transformer and selecting 'Custom HTML' in the page contents. This may present more issues such as hardcoding elements yourself; however, you can find more details on the use of HTML and FME here: How to Customize HTML Reports

Happy to help - Evie
lgrie
Contributor
Forum|alt.badge.img+7
  • lgrieContributor
  • Author
  • Contributor
  • February 28, 2023
evieatsafe wrote:

Hi @lgrie​ just want to clarify, you don't want to have the choice/dropdown as a parameter but rather have it within the streamed HTML after submitting the server app? 

 

If this is the case, you can edit the HTML within the HTMLReportGenerator transformer and selecting 'Custom HTML' in the page contents. This may present more issues such as hardcoding elements yourself; however, you can find more details on the use of HTML and FME here: How to Customize HTML Reports

Hello @Evie Lapalme​ ,

You're guessing correctly, that is exactly what I want.

I am using a costum HTML in the generator to create the drop-down list.

The problem is that I just don't know how (or rather where) I should implement the elements "name" and *"opt_" into the menu shown above.

A collegue suggested to use the http address as the action value.

<form method="POST" action="http://server/fmeserver/apps/gallery_application/workspace_app/streaming/fmedatastreaming/directory/something.fmw">
    <p>
        <label for="pays">Quel dashboard ?</label><br> 
        <select name="Nom" id="Name">
            <option value="Exemple1">Exemple1</option>
            <option value="Exemple2">Exemple2</option>
        </select>
    </p>
    <input type="hidden" id="opt_servapp" name="opt_servapp" value="workspace_app" />
 </form>
 
 <input type="submit" value="Envoyer">

Where id is equal to the published parameter on the screen shot "image": Name, option values correspond to the published parameters and all "opt_" (also displayed on screen shot "image) are hidden.

lgrie
Contributor
Forum|alt.badge.img+7
  • lgrieContributor
  • Author
  • Contributor
  • February 28, 2023
evieatsafe wrote:

Hi @lgrie​ just want to clarify, you don't want to have the choice/dropdown as a parameter but rather have it within the streamed HTML after submitting the server app?

 

If this is the case, you can edit the HTML within the HTMLReportGenerator transformer and selecting 'Custom HTML' in the page contents. This may present more issues such as hardcoding elements yourself; however, you can find more details on the use of HTML and FME here: How to Customize HTML Reports

Thing is that this option does NOT work !

mattmatsafe
Safer
Forum|alt.badge.img+13
  • mattmatsafeSafer
  • Safer
  • Best Answer
  • February 28, 2023
evieatsafe wrote:

Hi @lgrie​ just want to clarify, you don't want to have the choice/dropdown as a parameter but rather have it within the streamed HTML after submitting the server app? 

 

If this is the case, you can edit the HTML within the HTMLReportGenerator transformer and selecting 'Custom HTML' in the page contents. This may present more issues such as hardcoding elements yourself; however, you can find more details on the use of HTML and FME here: How to Customize HTML Reports

Hi @lgrie​ I noticed that your submit button is outside of your form element, that may be one of the problems. 

A more simple option might to just include a link back to the app on your streamed page, so you can reselect a dashboard from there. It's only one extra click. If you really want to try and save the extra click, create a data-streaming workspace webhook URL from your dashboard workspace (see instructions here) and use that URL as your form action. For example:

<form action="https://yourfmeserver.com/fmedatastreaming/repositoryname/createdashboard.fmw?DestDataset_HTML=C%3A%5CData%5Cresultspage.html&token=123456abcdef">
    <p>
        <label for="nom">Quel dashboard ?</label><br> 
        <select name="nom" id="nom">
            <option value="ctrl_job_dr">exemple1</option>
            <option value="ctrl_job_semaine">exemple2</option>
        </select>
    </p>
     <input type="submit" value="submit">
 </form>

A parameter named 'nom' and its selected value (dashboard name) will then be passed in the webhook URL when the user clicks submit.

The field name on the form must match the published parameter in the workspace (nom).

Reply


Helpful Members This Week

Community Stats

31,239
Posts
118,444
Replies
38,833
Members

Latest FME

Terms & ConditionsCookie settings

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings
A product of
Safe Software respectfully acknowledges that we live, learn and work on the traditional and unceded territories of the Kwantlen, Katzie, and Semiahmoo First Nations.