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!