Primeiro Método: Envio de Dados ao Backend sem Processamento de Resposta

Esta abordagem envia os parâmetros do formulário diretamente ao servidor, ideal para cenários onde nenhuma resposta precisa ser manipulada no frontend, como em atualizações assíncronas simples.

Exemplo de código HTML:

<form id="form-alteracao" action="/api/modificar/local" method="POST">
  <div>
    <label for="campo-nome">Nome do Local:</label>
    <input type="text" id="campo-nome" name="nome_local" />
  </div>
  <div>
    <label for="campo-identificador">Identificador:</label>
    <input type="text" id="campo-identificador" name="identificador" />
  </div>
  <div>
    <label for="campo-coord-x">Coordenada X (Latitude):</label>
    <input type="text" id="campo-coord-x" name="coordenada_x" />
  </div>
  <div>
    <label for="campo-coord-y">Coordenada Y (Longitude):</label>
    <input type="text" id="campo-coord-y" name="coordenada_y" />
  </div>
  <button type="submit">Salvar Alterações</button>
</form>

Código JavaScript opcional para validação usando jQuery (omitido se não houver necesisdade):

<script>
  $(function() {
    $("#form-alteracao").validate({
      rules: {
        nome_local: { required: true, minlength: 3 },
        identificador: { required: true }
      },
      messages: {
        nome_local: { required: "O nome é obrigatório.", minlength: "Mínimo de 3 caracteres." },
        identificador: { required: "O identificador é obrigatório." }
      },
      submitHandler: function(formulario) {
        formulario.submit();
      }
    });
  });
</script>

Código Java no backend (usando Spring Boot):

@RestController
@RequestMapping("/api")
public class LocalController {

  @PostMapping("/modificar/local")
  public void atualizarLocal(@RequestParam Long identificador,
                             @RequestParam String nome_local,
                             @RequestParam Double coordenada_x,
                             @RequestParam Double coordenada_y) {
    // Lógica de processamento sem valor de retorno
  }
}

Segundo Método: Envio de Dados com Retorno de Respsota do Servidor

Aqui, os dados são enviados via AJAX, permitindo que o frontend receba e processe a resposta do servidor, útil para feedback em tempo real ou navegação dinâmica.

Exemplo de código HTML (similar ao anterior, mas sem atributos action e method no formulário):

<form id="form-envio">
  <div>
    <label for="campo-nome-envio">Nome do Local:</label>
    <input type="text" id="campo-nome-envio" name="nome_local" />
  </div>
  <div>
    <label for="campo-id-envio">Identificador:</label>
    <input type="text" id="campo-id-envio" name="identificador" />
  </div>
  <div>
    <label for="campo-lat-envio">Latitude:</label>
    <input type="text" id="campo-lat-envio" name="latitude" />
  </div>
  <div>
    <label for="campo-lon-envio">Longitude:</label>
    <input type="text" id="campo-lon-envio" name="longitude" />
  </div>
  <input type="button" id="btn-enviar" value="Enviar Dados" />
</form>

Código JavaScript com validação e AJAX:

<script>
  $(function() {
    $("#form-envio").validate({
      rules: {
        nome_local: { required: true, maxlength: 50 },
        identificador: { required: true, digits: true }
      },
      messages: {
        nome_local: { required: "Campo obrigatório.", maxlength: "Máximo de 50 caracteres." },
        identificador: { required: "Insira o ID.", digits: "Use apenas números." }
      },
      submitHandler: function() {
        enviarViaAjax();
      }
    });

    $("#btn-enviar").click(function() {
      enviarViaAjax();
    });

    function enviarViaAjax() {
      var dadosFormulario = $("#form-envio").serialize();
      $.ajax({
        type: "POST",
        url: "/api/modificar/local",
        data: dadosFormulario,
        cache: false,
        success: function(resposta) {
          alert("Resposta do servidor: " + resposta);
        },
        error: function() {
          alert("Erro na comunicação com o servidor.");
        }
      });
    }
  });
</script>

Código Java no backend com retorno de valor:

@RestController
@RequestMapping("/api")
public class LocalController {

  @PostMapping("/modificar/local")
  public Long atualizarLocalComRetorno(@RequestParam Long identificador,
                                       @RequestParam String nome_local,
                                       @RequestParam Double latitude,
                                       @RequestParam Double longitude) {
    // Lógica de processamento
    Long resultado = 1L; // Exemplo de valor de retorno
    return resultado;
  }
}