Spring MVC, Thymeleaf – Casilla de verificación, si está marcada / desmarcada el acceso al punto de conexión del controlador.
Tengo un proyecto Spring MVC
+ Thymeleaf
, y una de mis páginas / controladores muestra cierta información.
La única interacción que un usuario puede hacer en esa página es marcar o desmarcar una casilla.
Si el usuario lo hace, se debe ejecutar cierta lógica en el controlador.
Mi objetivo es acceder a un endpoint del controlador si la casilla cambia (marcada / desmarcada).
¿Cómo vincular la casilla de verificación a un endpoint del controlador, obtener el valor de la casilla y ejecutar cierta lógica según el valor (marcado / desmarcado)?
Con un formulario, lo sé, es un @PostMapping
, pero con un formulario normalmente tengo un botón en el que el usuario tiene que hacer clic para que el formulario se transfiera al endpoint especificado.
¿Pero cómo con eventos en elementos como casillas de verificación?
@Controller
@Scope("session")
public class MyController {
@GetMapping("/")
public String show(Model model) {
// Alguna lógica para preparar la información
boolean isChecked = ... dependiendo de la lógica ...;
model.addAttribute("isChecked", isChecked);
...
// Mostrar información en la página index.html
return "index";
}
@... ¿qué tipo de mapeo?
public String checkboxAltered(... lo que sea necesario..., Model model) {
// Marcado o desmarcado
if (... casilla de verificación marcada ...) {
// Marcado, eliminar algunos datos
} else {
// Desmarcado, crear algunos datos
}
}
// Redirigir para mostrar información de nuevo
return "redirect:/";
}
¿Y cómo se debe hacer en Thymeleaf para que esto funcione en la página de la casilla de verificación (index.html
)? Actualmente solo hay una casilla de verificación y dependiendo del atributo en el modelo (valor booleano), está marcada / desmarcada:
<input type="checkbox" th:checked="${isChecked}"/>
Ahora tengo que agregar el manejo de eventos de usuario descrito a la casilla de verificación.
Pero no estoy seguro si esto se puede hacer de la manera que espero.
Si no es posible, ¿cómo hacerlo de otra manera?
La documentación de Thymeleaf en https://www.thymeleaf.org/doc/tutorials/3.0/thymeleafspring.html#checkbox-fields muestra casillas de verificación en contexto de formularios.
Pero eso significaría que tendría que proporcionar una casilla de verificación que el usuario debe marcar y también un botón en el que el usuario debe hacer clic además. Quiero evitar que el usuario tenga que hacer clic dos veces.
davy.ai
Para vincular la casilla de verificación a un endpoint del controlador, puede utilizar JavaScript/jQuery para escuchar el evento de clic en la casilla de verificación y luego hacer una llamada AJAX al endpoint con el valor de la casilla de verificación. Aquí hay un ejemplo:
En su
index.html
, agregue un ID a la casilla de verificación:Agregue una etiqueta de script en la parte inferior de la página para escuchar el evento de clic y hacer la llamada AJAX:
En su clase
MyController
, agregue una anotación@PostMapping
al métodocheckboxAltered
y agregue un@RequestParam
para recuperar el valor de la casilla de verificación:Con este enfoque, el método
checkboxAltered
se llamará cada vez que el usuario haga clic en la casilla de verificación y el valor de la casilla de verificación se pasará como parámetro.