Spring + Thymeleaf + Bootstrap nie działa kod html

Question

Hej.

Staram się zrobić mały projekt tj. schronisko. Żeby to ładnie wyglądało, postanowiłem udekorować strony html i dodać do nich życia. Póki co mam takie coś:

https://paste.ofcode.org/39rjL9se3r2aREpjaDBNBY3

Nie ma tu nic nadzwyczajnego - zwykłe inputy i strony z tekstem na białym tle. Obejrzałem kilka filmów Mirosława i dodałem zegar w JS oraz kilka zdjęć i zmieniłem kolor tła tylko że... nic z tego nie działa!

W projekcie korzystam z: JPA, Thymeleaf, Bootstrap, mysql. Czegoś nie dodałem? Wszelkie sugestie mile widziane.

Comments

Nie widzę podpiętego arkusza css. Jak wygląda twój skrypt. Prawdopodobnie nie działa ponieważ odpala się przed załadowaniem html. Umieść go przed zamknięciem tagu </body>. Gdzie wykorzystujesz klasy z bootstrapa?

Answer 1

Wszyscy dają Tobie złe odpowiedzi.

Z Twojego problemu wynika, że używasz samego Spring Framework bez Boot. Dlatego wymagane jest od Ciebie zarejestrowanie źródła do adresu miejsca przechowywania pliku JS/CSS. Wystarczy kilka prostych linijek w konfiguracji i Twoja strona będzie w stanie odczytać plik JS/CSS. Konfiguracja. http://fruzenshtein.com/spring-mvc-resources/

Po drugie Twój plik JS jest na 100% źle podlinkowany. Jeśli używasz samego Spring, to początek adresu powinien zaczynać się od "resources", bo najpewniej tam trzymasz pliki, np. "<script th:src="@{/resources/bootstrap/js/bootstrap.min.js}"></script>". W Spring Boot zamiast "resources" jest "static".

Co znaczy, że CSS nie działa? Nie widzę, abyś w podanym kodzie ustawiał jakieś CSS wewnętrzne lub lokalne. Dodatkowo plik CSS ciągnięty z adresu URL nie ma prawa w tym przypadku nie działać. Użyj dowolnego elementu z Bootstrap, a zobaczysz, że wszystko jest w porządku.

Comments

Używam boota, piszę w IntelliJ i korzystam z automatycznej konfiguracji. Projekt jest pakowany do jar, bez serwera zewnętrznego.
Bootstrap faktycznie działa.

Przeglądarka w konsoli pokazuje takie błędy:

Failed to load resource: the server responded with a status of 404 ()

Uncaught ReferenceError: odliczanie is not defined
    at onload ((index):11)

---

@Jonki,   masz może jakiś przykładowy projekt z zastosowaniem twoich rad? Dodałem plik konfiguracyjny wedle instrukcji i nadal nie działa. 

---

spaaam

---

@Jonki, dzięki za chęci, ale działa już bez żadnej konfiguracji i bez dodawania linijek kodu.

Przypadkowo rozwiązałem problem, ale nie mam pojęcia, dlaczego to działa. Spójrzcie, tak wygląda folder resources:



A tak wygląda działający kod:

 

<script type="text/javascript" th:src="@{/resources/js/timer.js}"></script>

Proszę, żeby mi ktoś wyjaśnił, dlaczego adres z /js/ przed nazwą pliku musi być, żeby kod JS działał.
 

Answer 2

Sprawdź czy masz dodane biblioteki dll oraz czy masz osobno zapisane skrypty .js.
Sprawdź połączenie bazy danych mysql'a z serwerem i html'em.

Pozdrawiam
Prawdziwy Świeży

Comments

Mam skrypty osobno zapisane. Program łączy się z bazą bez problemu i strona wyświetla się prawidłowo tylko brakuje JS na niej.

---

No to zainstaluj js bo bez tego ani rusz. Nic dziwnego, że Ci nie działa. JavaScript to podstawa bo akurat te kodowanie programowe łączy się z pamięcią bibliotek dll. Załaduj JavaScript na stronę i daj tutaj znać czy Ci chodzi wszystko czy masz jakieś problemy.

Pozdrawiam
Prawdziwy Świeży

---

@Fresh proszę o zaprzestanie dodawania linków do każdej odpowiedzi i komentarza, gdyż jest to nachalna promocja własnej strony. Niedostosowanie się do tego wymogu będzie skutkować poważniejszymi konsekwencjami.

---

@Fresh, jak mam zainstalować JS? 

---

@Fresh, rozwiązane. Ścieżka do mojego pliku:

resources/static/timer.js

Ale jedyny działający kod wygląda tak:

<script type="text/javascript" th:src="@{/resources/js/timer.js}"></script>

Co bym nie zrobił, zawsze muszę dać w ścieżce /js/ przed nazwą pliku. Wiesz może, dlaczego tak jest?