Как отправить форму Thymeleaf при изменении значения текстового поля? - PullRequest
Новая
       24

Как отправить форму Thymeleaf при изменении значения текстового поля?

0 голосов
/ 15 февраля 2020

Я работаю над простым приложением, использующим Spring Boot и Thymeleaf. Я хочу отправить форму на изменение значения текстового поля. Я не уверен, можем ли мы вызвать сценарий "th: action =" @ {/reeting} "" через java?

- Вот мое html приветствие. html

<!DOCTYPE HTML>
<html xmlns:th="https://www.thymeleaf.org">
<head>
<title>Getting Started: Handling Form Submission</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
    <h1>Form</h1>
    <form action="#" th:action="@{/greeting}" th:object="${greeting}"
        method="post">
        <table border="1">
            <tr>
                <td>Id:</td>
                <td><input type="text" th:field="*{id}" /></td>
            </tr>
            <tr>
                <td>Message:</td>
                <td><input type="text" th:field="*{content}" /></td>
            </tr>
        </table>
        <p>
            <input type="submit" value="Submit" /> <input type="reset"
                value="Reset" />
        </p>
    </form>
</body>
</html>

- Класс контроллера :: GreetingController. java

package com.example.handlingformsubmission;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PostMapping;

@Controller
public class GreetingController {

    @GetMapping("/greeting")
    public String greetingForm(Model model) {
        Greeting greeting = new Greeting();
        greeting.setId(108);
        greeting.setContent("Welcome");
        model.addAttribute("greeting", greeting);
        return "greeting";
    }

    @PostMapping("/greeting")
    public String greetingSubmit(@ModelAttribute Greeting greeting) {
        greeting.setId(greeting.getId()+1);
        return "greeting";
    }

}

1 Ответ

0 голосов
/ 16 февраля 2020

Javascript не будет знать о th:action="@{/greeting}, так как это доменное имя тимелист. Вместо этого вы можете просто использовать URL-адрес /greeting, так как вы находитесь в том же доменном имени, которое напрямую попадет на ваш контроллер. Пример в jquery может быть таким:

function onChange() { $.ajax({ url: '/greeting', type: 'POST', data: {attribute_of_greeting_1:'value_to_post_1',attribute_of_greeting_2:'value_to_post_2'} }) } Объявление, затем свяжите эту функцию с вашим событием.

...