Nav Bar Links

Hello All,

I have a problem that I cant seem to figure out. Still very new with wappler so I aplologise if the question is really stupid.

I have added a navbar with links Nav Links to other pages. The links work great if I right click and “Open in new tab”, but clicking the link on the page itself is doing nothing. Any advise on what I am doing wrong? Thank You in advance!

Hi Anuj, do you have a live link you can share?

Hey Brad,

Its on my local. I can share a snippet of the code since its a POC. Do you recomment removing the NAV links and adding anchor buttons? Those seem to be working great.

It would be best if you could upload it somewhere so we can inspect the code and test it. The nav links should work just as well as anchor buttons.

great. Can i upload the code as word doc on my google drive and share the link her3?

We can try that … or you can just paste the code in this forum.

yup sorry. I thought it may be too big. Should i just paste the navbar part with the scripts used? or the entire code?

Just the navbar code should be enough

 <body is="dmx-app" id="Index">
   <div class="container">
     <nav class="navbar navbar-expand-lg bg-light navbar-light navbar-expand-xl style4">
       <a class="navbar-brand" href="#">ABC Application</a>
       <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapse1" aria-controls="collapse2" aria-expanded="false" aria-label="Toggle navigation" id="NavBar">
         <span class="navbar-toggler-icon"></span>
       </button>
       <div id="collapse1" class="collapse navbar-collapse d-xl-none w-auto flex-xl-row bg-light style4">
         <div class="navbar-nav nav-pills style11">
           <a class="nav-item nav-link font-weight-bolder text-dark style4 bg-white" href="index.html" data-toggle="button" data-target="#collapse1">Family</a>
           <a class="nav-item nav-link w-auto ml-xl-3 font-weight-bolder text-dark style4 bg-white" data-toggle="dropdown" data-target="#collapse2" href="addcompany.html">Company</a> 

Thanks. I was tryin to find that.

@Anuj_Agrawal use backticks to wrap the code you paste: `

I tried using the backticks, but i think Brad already edited it for me? Its showing the code on my end

You used single quotes: ’ not backticks: ` :slight_smile: it was me who edited the post.

Thanks Teodor. I thought Brad edited it. :slight_smile:

Sorry about that. Very new to code and wappler. So everything is new to me :slight_smile:

1 Like

Hmmm, the data-toggle collapses in the code look to me like they shouldn’t be there. Without being able to test it it seems you are trying to toggle sub menus with your links not actually link to a page?

I’d remove the navbar and start it over again without using dropmenus since you only have two links.

1 Like

Yes it works now! I started the navbar again and it works! Thank You Brad!!

2 Likes