Monday

css doesn't load in jsp called with controller with pathvariable in Spring Boot

8:32 PM css, jsp, spring-boot, spring-mvc No comments

Issue

My issue is that Css and bootstrap don't load in a page that I called with a Controller with @PathVariable , but css and bootstrap load fine when I call the same page without @PathVariable . When I call /test1 , css and bootstrap works fine , but when I call /test/3 , css and bootstrap don t work ,I can see only html . I don t see my falt because it s the same JSP page . help please.

Controller :

package com.eBenamar;

import java.io.BufferedOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.util.Base64;
import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.hibernate.annotations.Sort;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.PageRequest;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;

import com.eBenamar.Dao.AnnonceDao;
import com.eBenamar.Entities.Annonce;


@Controller
public class AnnonceController {
    @Autowired
    private AnnonceDao annoncedao;

@RequestMapping("/test/{nb}")
  public String test( Model md,@PathVariable Integer nb) {

      md.addAttribute("ex",nb);
      return "test";
  }

@RequestMapping("/test1")
  public String test1( Model md) {


      return "test";
  }
}

test.jsp :

<%@ taglib uri="http://www.springframework.org/tags/form"  prefix="springform"  %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> 
<!DOCTYPE html >
<html>
<head>

<title>Affiche annonces</title>


<link type="text/css" href="bootstrap/dist/css/bootstrap.css" rel="stylesheet" >
<link type="text/css" href="css/style.css" rel="stylesheet" >
 <script data-require="angular.js@1.0.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js" data-semver="1.0.8"></script>

</head>
<body>
<nav class="navbar navbar-fixed-top  navbar-inverse" id="my-navbar" >
  <div class="container">
     <div class="navbar-header">
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse" >
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
       </button>
       <a href="/affiche" class="navbar-brand "> Parcourir</a>
     </div>  <!-- navbar header -->

     <div class="collapse navbar-collapse" id="navbar-collapse">
     <a class="btn btn-info navbar-btn navbar-right" href="">Download</a>

       <ul class="nav navbar-nav">
         <li class="active"> <a href="/save"/> Nouvelle annonce </a>

         <li><a href="/test/4"/> publicite </a></li>
         <li><a href=""/> Foire aux Questions </a></li>
         <li class="dropdown ">
           <a class="dropdown-toggle" data-toggle="dropdown">
           Contact <b class="caret"></b>
           </a>

             <ul class="dropdown-menu ">
               <li > <a>Contactez nous</a> </li>
               <li> <a>Coordonnees</a></li>
               <li> <a>about us</a></li>
             </ul>
          </li>
       </ul>
     </div>

  </div> <!-- end container -->

</nav>  <!-- end nav bar -->

<br><br><br><br><br>
<div id="pp"> ${ex}</div> 
</body>
</html>

application.properties :

spring.datasource.url=jdbc:mysql://localhost:3306/kijiji
spring.datasource.username=root
spring.datasource.password=
spring.datasource.driverClassName=com.mysql.jdbc.Driver
spring.jpa.hibernate.ddl-AUTO=create
spring.jpa.properties.hibernate.dialct=org.hibernate.dialect.MySQL5Dialect
server.port=8989
spring.mvc.view.prefix= /WEB-INF/jsp/
spring.mvc.view.suffix= .jsp

Repository :

package com.eBenamar.Dao;

import java.util.List;

import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.data.repository.CrudRepository;

import com.eBenamar.Entities.Annonce;

    public interface AnnonceDao extends   JpaRepository<Annonce, Integer> {

}

application tree:

src |
    main
     | resources 
     |  |   META-INF
     |  |   static 
     |  |       angular
     |  |       bootstrap
     |  |          dist 
     |  |            ... 
     |  |       css 
     |  |         style.css
     | webapp 
     |    WEB-INF
     |       jsp
     |         test.jsp 
     |
     ...
     pom.xml

pom.xml :

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>com.example</groupId>
    <artifactId>kijijiSB</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <packaging>war</packaging>

    <name>kijiji2</name>
    <description>Demo project for Spring Boot</description>

    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>1.4.1.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>

    <properties>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
        <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
        <java.version>1.8</java.version>
    </properties>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-jpa</artifactId>
        </dependency>
        <!-- <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-rest</artifactId>
        </dependency> -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
<!--            <scope>provided</scope>
 -->        </dependency>

        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <scope>runtime</scope>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <!-- <scope>provided</scope> -->
        </dependency>



        <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-tomcat</artifactId>
<!--        <scope>provided</scope> -->
    </dependency>


<dependency>
  <groupId>org.apache.tomcat.embed</groupId>

  <artifactId>tomcat-embed-jasper</artifactId>
  <!-- <scope>provided</scope> -->
</dependency>

        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>jstl</artifactId>
            <!-- <scope>provided</scope> -->
        </dependency>
<dependency>
    <groupId>commons-fileupload</groupId>
    <artifactId>commons-fileupload</artifactId>
    <version>1.3.1</version>
</dependency>


        <!-- <dependency>
            <groupId>org.eclipse.jdt.core.compiler</groupId>
            <artifactId>ecj</artifactId>
            <version>4.6.1</version>
            <scope>provided</scope>
        </dependency> -->


    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <!-- <scope>provided</scope> -->
            </plugin>
            <!-- <plugin> 
              <groupId>org.apache.maven.plugins</groupId> 
              <artifactId>maven-surefire-plugin</artifactId>
              <configuration> 
                <useSystemClassLoader>false</useSystemClassLoader> 
               </configuration> 
             </plugin> -->
        </plugins>
    </build>


</project>

Solution

finally I find a solution,it was so basic. It was in the link to my css and bootstrap I change :

<link type="text/css" href="bootstrap/dist/css/bootstrap.css" rel="stylesheet" >
<link type="text/css" href="css/style.css" rel="stylesheet" >

to :

<link type="text/css" href="/bootstrap/dist/css/bootstrap.css" rel="stylesheet" >
<link type="text/css" href="/css/style.css" rel="stylesheet" >

It s load my css and bootsrap, I wich that can help someone one day.

Answered By - Omar B.

This Answer collected from stackoverflow and tested by AngularFix community admins, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Monday

css doesn't load in jsp called with controller with pathvariable in Spring Boot

Issue

Solution

0 comments:

Post a Comment

Popular Posts

Labels