Текст тимелеафа исчезает с кнопок и раскрывающихся элементов после отправки формы - PullRequest
Новая
       103

Текст тимелеафа исчезает с кнопок и раскрывающихся элементов после отправки формы

0 голосов
/ 18 июня 2020

Прежде, чем я нажму на кнопку «Отправить», все в порядке. После того, как я отправлю форму на веб-сайт, страница перезагрузится и текст исчезнет с кнопок и раскрывающихся элементов, например, на панели навигации. Я все еще могу нажимать на них, и они делают все, что должны, но текста больше нет, и я не знаю, как исправить эту ошибку. Я написал небольшой скрипт, чтобы предотвратить перезагрузку страницы, полагая, что это поможет решить проблему, но проблема та же. У меня bootstrap и были импортированы другие скрипты, которые могут быть проблемой. Кто-нибудь раньше сталкивался с этой проблемой? Есть идеи ? Мы будем очень благодарны за любое небольшое предложение.

То, что я пробовал до сих пор :

  1. Запретить перезагрузку страницы при отправке формы с помощью javascript
  2. Поместите панель навигации в другой контейнер
  3. Класс конфигурации: .antMatchers("/addUser").permitAll()

Класс контроллера в коде загрузки Spring 

@PostMapping("/addUser")
    public String addUser(@ModelAttribute FormUser newUser) {
        
        formUserService.registerUser(newUser);
        
        return "index";
    }

javascript: 

let contact_forms = document.querySelector("#user-form-modal"); 
contact_forms.addEventListener("submit", function(ev) {
    ev.preventDefault();
});

форма в индексе. html: 

<form id="user-form-modal" action="" class="needs-validation" name="index" th:action="@{/addUser}" th:object="${formuser}" method="post">
    <div class="form-group">
        <label for="name">What's your name?</label>
        <input type="text" class="form-control" id="name" th:field="*{name}" placeholder="Name">
        <div class="invalid-feedback">Please fill out this field.</div>
    </div>
    <div class="form-group">
        <label for="email">What is your email?</label>
        <input type="text" class="form-control" id="email" th:field="*{email}" placeholder="Email">
        <div class="invalid-feedback">Please fill out this field.</div>
    </div>
    <button class="btn btn-primary" type="submit">Submit</button>
</form>

css для навигационной панели (например) : 

.navbar {
    background: #302a34; /*for browsers that do not support  gradient.*/
    background: linear-gradient(#787878, #3c3c3c, #000000);
    display: flex;
    max-width: 100%;
    
}

.container {
    max-width: 100%
}

#more {display: none;
}

Перед отправкой формы (все в порядке) : enter image description here enter image description here 

 какой-то текст (!!!!!)

После отправки формы (без текста) : enter image description here enter image description here

1 Ответ

0 голосов
/ 20 июня 2020

После множества снимков я понял, что пропадают только те тексты, где я использую Thymeleaf. Если я вставлю текст прямо в код html, то после отправки формы все будет в порядке. Так что теперь я могу исправить это таким образом, но был бы счастлив, если бы смог продолжить использовать Thymeleaf в своем проекте.

...