Active Class with a NavBar - Bootstrap3

Navigation
1

Good morning everyone, the post is to ask for help with a project I am preparing for the institute, we are asked to make a help desk system (handling of attention tickets) and a scorecard (reports in statistical tables, etc.)

I am working on the design of the pages (since they are web), I am using the IDE NetBeans, together with CSS, Bootstrap 3 and JQuery, it is the first time I enter this design of web pages with CSS and Bootstrap They never taught me and I had to learn by reading, now if I explain my problem:

It happens that I have created a header and footer separately, which I design the content (let's call it index.jsp and only refer to my header with: 

<%@include file="WEB-INF/jspf/headerAdministrator.jspf" %>

to appear in the top part of the content) the problem arises since I have a NavBar added in the header, with about 5 options, when selecting one redirects me to a page and as it is going to another it reloads everything (until the header), I found a function in Javascript that allows you to toggle the "active" class among the options you have in the navigation bar, but as I select one and load ALL the page including the header, the selection (or rather, the the function where you add the active class disappears) I will leave a reference image.

What I wanted to know, is how to do so that the only thing that has to load is the content, since the header and footer will never vary, thanks.

    
asked by Wil Pedroso 14.12.2016 в 20:14
source

2 answers

1

From what I understand of your question, your problem is that when you follow the link of an element of the header it loads another page and therefore your header still does not have the corresponding "active".

This being the case, the simplest and most correct option is that you edit your landing page so that it has the "active" correctly and you do not need javascript.

If you still want to do it like you thought, you can use an iframe to embed the content of an address on the page. Therefore you would have your header and the iframe, it would be enough to change the iframe when clicking.

Keep in mind that the iframe solution is not the best.

    
answered by 14.12.2016 / 21:27
source
0

Greetings, you see that you are well self-taught, but remember not to lose the goal of finishing the project. I recommend you look in the bootstrap templates: TemplatesGratisBootstrap There you can find many projects already ready with bootstrap focused on particular topics, which you can download and study, is a bit more timely and easy to start sometimes.

    
answered by 22.12.2016 в 15:04
Create cron on iOS Not shown in Fragment