Connecting CSS and JS files in JSP was a bit of a challenge

Just starting out with jsp and using Glassfish server via netbeans. Struggling to link my jsp file with css and javascripts. Below is the structure of my files:

Web Pages  
 --Web-Inf  
 --assets  
    --css   
     --style.css  
  --js  
 --jquery.js  
 --includes    
--header.jsp  
--footer.jsp  
--sidebar.jsp  
 --pages    
--home.jsp  
 --index.jsp    

This is the code in my index.jsp file:

<%@include file="includes/header.jsp" %>

<%
    if (request.getParameter("page") == null) {
        %>
        <%@include file="pages/home.jsp" %>
        <%
    } else {
        %>

        <%
    }
%>

    <%@include file="includes/sidebar.jsp" %>
</div>

<!--Latest end-->

<%@include file="includes/footer.jsp" %>

And this is the code in my header.jsp file:

<link href="${pageContext.request.contextPath}/assets/css/bootstrap.min.css" rel="stylesheet">

Answer №1

One way to link index.jsp is by using relative urls.

<link href="assets/css/bootstrap.min.css" rel="stylesheet">

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Create a modal using the base of a[href^=“#id”]

What is the best way to minimize a call modal window? $('#button-1').on('click', function() { $('#modal-1').addClass('j-modal--open'); }); $('#button-2').on('click', function() { $(' ...

Distributing utility functions universally throughout the entire React application

Is there a way to create global functions in React that can be imported into one file and shared across all pages? Currently, I have to import helper.tsx into each individual file where I want to use them. For example, the helper.tsx file exports functio ...

Setting attributes to a DOM element using String in jQuery

I am currently facing a challenge where I have a list of attributes saved as a string variable, and I need to add that variable to a <div>. Unfortunately, I am stuck and uncertain about the best approach. Here is what I have so far: HTML: <div&g ...

Inaccurate character labeling method within a linked list implementation

I have developed a word guessing game called Wordle, utilizing a linked list for the logic. In this game, players must guess an unknown word by entering their guesses. The mystery word is compared to the guessed word character by character, and if a charac ...

Tips for showcasing the latter portion of text within an HTML select dropdown menu

I have a select drop-down list with a fixed width of 80px, as shown in the image below: <select id="dd_country_code_2" name="dd_country_code_2" style="width: 120px; height: 23px;"> <option value="SEL">(Country code)</option> & ...

How to send a PHP array to AJAX and show it on the webpage

Looking to enhance the interactivity of my website by showing icons (either correct or false) after users submit a registration form. This way, they can easily identify any incorrect fields. To achieve this, I understand that I'll need to utilize jso ...

Transforming a two-digit year into a four-digit year

Our entry form provides users with a calendar drop-down option, but they are also able to manually type in dates. We recently discovered that if someone enters a 2-digit year, it automatically changes to 1912 instead of 2012 (as dates cannot be in the past ...

Generating an array in Javascript using JSON

I've been doing a lot of research, but I can't seem to find a solution that works for me. My goal is to retrieve the next four bus arrival times for a specific bus stop using an application that reaches out to an API returning JSON data. The issu ...

Retrieve the contents of the browser's DOM from within an Android operating system runtime

Imagine a typical login page similar to the one depicted below: https://i.stack.imgur.com/SF1Bd.jpg To interact with the HTML elements within the DOM, we can utilize either jQuery or conventional JavaScript like so: https://i.stack.imgur.com/e5aQZ.png ...

Deciphering the principles of Bootstrap

I'm looking to understand more about what Bootstrap is. I know it's commonly used for styling web pages, but could you provide me with a clear explanation? Can big companies like Twitter, Facebook, or YouTube utilize Bootstrap for their platforms ...

Attempting to implement a polygon-shaped button with material-UI and React framework

This is a design I am experimenting with for the poly button above. I have tried various styling methods. Does anyone have any ideas? ...

Retrieving data from a C# datatable in JSON format and presenting it in a jQuery datatable

Recently, I've been diving into Jquery Datatable and trying to work with it using a JSON string. However, despite my efforts over the past couple of days, I haven't been able to get the desired output. Here's a snippet of my HTML : <bo ...

What is the best way to position this container in the center of the

Is there a way to perfectly center this container both vertically and horizontally? I've attempted the method below without success. Unsure of what is missing: HTML: <div class="box"> <p>This is a sentence.</p> </div> C ...

The characteristics that define an object as a writable stream in nodejs

Lately, I've been delving into the world of express and mongoose with nodejs. Interestingly, I have stumbled upon some functionality that seems to work in unexpected ways. In my exploration, I noticed that when I create an aggregation query in mongoos ...

Localhost is causing issues with Laravel in retrieving webfonts

I was trying to incorporate font-awesome into my Laravel project, but encountered a strange error. When I run the project, the following error appears in the console: GET http://localhost/fonts/vendor/@fortawesome/fontawesome-free/webfa-solid-900.woff2?5 ...

"Adding properties to objects in a map: a step-by-step guide

During my attempt to add a property within a map loop, I noticed that the update appeared to occur on a duplicate rather than the original object. MY_ARRAY.map(function(d){ d.size = DO_SOMETHING }); ...

Utilizing Bootstrap Modals to seamlessly redirect me to a new empty page

Despite the fact that my website functions perfectly fine without a build system, I am encountering an issue with the Bootstrap modals while using the Yeoman: Angular + Gulp build system. Whenever I click on a list item, instead of the modal appearing, it ...

Dynamic water filling effect with SVG

I'm trying to create a wipe animation that looks like water filling up inside of a drop shape. Currently, it is a square with a wave animation on top of the drop logo. The wave animation works correctly, but I am struggling to contain it within the dr ...

When altering the color of a mesh in Three.js, only a single face is impacted by the modification

I have a GLB model with multiple parts and hierarchy. My goal is to highlight a specific part of the assembly on mouseover. The code snippet I am using for this functionality is as follows: raycaster.setFromCamera( pointer, camera ); ...

Performing calculations using the power operation solely through addition in Java

Struggling to create a program without using * or Math.pow to calculate exponential values? For example, if the base is 2 and the exponent is 3. - How can addition be used to achieve the correct result? - Is addition alone sufficient for this calculatio ...