Join the #BuildWithBuildAgent Challenge! Get recognized, earn exclusive swag, and inspire the ServiceNow Community with what you can build using Build Agent.  Join the Challenge.

When clicking on the select option, the user will be redirected to the module (Portal)

Elton2
Tera Contributor

Hello team! How are you?!

 

I created a select option in the header menu (attached image1 and image4), I need to include within the option tags the "links" with the sysId of the modules that are in the backend (attached image2).

 

HTML structure:

 

    <div class="module-form">
      <form>
        <label for="module">Choose one module:</label>
        <select name="module" id="module">
            <option value="meeting" sys_app_module.do?  sys_id=55d0a66d83d892100ac1c2dfeeaad370>Meeting</option>
            <option value="knowledge"sys_app_module.do?sys_id=d1a0ee6d83d892100ac1c2dfeeaad304>Knowledge</option>
            <option value="support"sys_app_module.do?sys_id=3040ea2d83d892100ac1c2dfeeaad36b>Support</option>
        </select>
      </form>
    </div>

 

 

After the user clicks on one of the "options" he will be redirected.

 

I created the HTML structure (attached image1), but I don't know how to include this within the <option> tags.

 

Note: When I open the record of each module (attached image3), I have the option to copy the URL, so I copied the URL and pasted it within the "Options" tag, but it doesn't work.

 

The entire module URL looks like this: https://dev123456.service-now.com/nav_to.do?uri=sys_app_module.do?sys_id=55d0a66d83d892100ac1c2dfeea...

 

Is it necessary to use angular js?

 

Could someone help me?

 

Thanks

 

1 ACCEPTED SOLUTION

Vanderlei
Mega Sage

Hi @Elton2, you can use the bootstrap to achieve this.

Replace your HTML with this code

<div class="btn-group">
  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Action <span class="caret"></span>
  </button>
  <ul class="dropdown-menu">
    <li><a href="/now/nav/ui/classic/params/target/sys_app_module.do?sys_id=<RECORD SYS_ID>">Option 1</a></li>
<li><a href="/now/nav/ui/classic/params/target/sys_app_module.do?sys_id=<RECORD SYS_ID>">Option 2</a></li>
<li><a href="/now/nav/ui/classic/params/target/sys_app_module.do?sys_id=<RECORD SYS_ID>">Option 3</a></li>
  </ul>
</div>

 Check my answer with helpful, thanks!

 

View solution in original post

2 REPLIES 2

Vanderlei
Mega Sage

Hi @Elton2, you can use the bootstrap to achieve this.

Replace your HTML with this code

<div class="btn-group">
  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Action <span class="caret"></span>
  </button>
  <ul class="dropdown-menu">
    <li><a href="/now/nav/ui/classic/params/target/sys_app_module.do?sys_id=<RECORD SYS_ID>">Option 1</a></li>
<li><a href="/now/nav/ui/classic/params/target/sys_app_module.do?sys_id=<RECORD SYS_ID>">Option 2</a></li>
<li><a href="/now/nav/ui/classic/params/target/sys_app_module.do?sys_id=<RECORD SYS_ID>">Option 3</a></li>
  </ul>
</div>

 Check my answer with helpful, thanks!

 

Elton2
Tera Contributor

Hi my friend @Vanderlei , how are you?!

 

Thanks for your help!

 

Its working now!!!

 

Thanks again 😉

 

See you!