使用Ajax发送字符串到控制器

Question

My knowledge of Spring boot is very low. I have made a table in HTML, which when I click on, an event is sent to a Javascript function, in which I try to catch the Id (a string) of the cell and send it to the controller. I tried many examples from internet but none worked for me, can anyone help me please? The id is being caught correctly by mouse click, but I have a problem with sending.

This is my JSP

<c:forEach items= "${rooms2}" var="m" >
<tr>
<td style="background-color:OldLace">${m.day }</td>
    <c:choose>
    <c:when test="${m.hour1confirm==false}">
    <td style="background-color:green" id="${m.hour1}"  onclick=
    "content(this)" >${m.hour1 }</td>
...
<script >
//  <script type="text/javascript">

function content(elem)
{
//  $(document).ready(function() 
//  {
//     // PREPARE FORM DATA
//          var idt =elem.id;
//          console.log(idt);
//          // DO POST
//          $.post({
//              type : "POST",
//              url :"reservation2",
//              // contentType: "application/json",
//              data : JSON.stringify(idt),
//              dataType : 'json',
//                  })

//  });

         var idt =elem.id;
         console.log(idt);
         $.ajax({

             url:"reservation2",
                    type: 'POST',
                    data:  idt,             
                    dataType: "text",          
                    contentType: false,
                    mimeType: false,
                    success: function(response){ 
                        console.log(data);              
                        return false;     
                    } 
                });

}

</script>

this is controller

.
.
.
//    @RequestMapping(value = "/reservation2", method = RequestMethod.POST)
//    public String reservation2(@ModelAttribute("idt") String idt , Model model) {
//        return "Reservation2";}



   @RequestMapping(value = "/reservation2", method = RequestMethod.POST)
    public @ResponseBody
    String Submit(@RequestParam("idt") String idt) {
        // your logic here
        return "reservation2";
    }


    @RequestMapping(value = "/reservation2", method = RequestMethod.GET)
    public String reservation(Model model) {  
   List<Room> rooms2= new ArrayList<>();
   System.out.println(rooms2);      
   rooms2= x.findAll();
   model.addAttribute("rooms2", rooms2);   
   return "reservation2";
...

when I run I get this error in console :

POST http://localhost:8080/reservation2 403 ()

Answer 1

Try changing your request to something like this

$.ajax({
  url: "/reservation2", //added '/' in the beginning
  type: 'POST',
  data: idt,
  dataType: "text",
  contentType: "text/plain", //change
  //mimeType: false,   //remove
  success: function(response) {
    console.log(data);
    return false;
  }
});

and your controller to this

@RequestMapping(value = "/reservation2", method = RequestMethod.POST)
public String reservation2(@RequestBody String idt) 
{
    // your logic here
    return "reservation2";
}

Answer 2

I believe you are not sending the right parameter along the way. When you do the ajax post request, in the field data can you specify the name of the parameter you are sending?

Can you try this one

$.ajax({

         url:"reservation2",
                type: 'POST',
                data:  {"idt": idt},             
                dataType: "json",          
                contentType: "application/json",
                success: function(response){ 
                    console.log(data);              
                    return false;     
                } 
            });