如何將json數據從jsp頁面發送到彈簧控制器

Question

我正在嘗試從jsp頁面發送數據，其中包括datetime ， zoneid ，帶有值的zoneid復選框和具有空值的未選中復選框。

我將所有這些作為json發送到我的彈簧控制器但是當我在調試模式下打開時，我發現控制器只收到兩個數據（我點擊的一個復選框並提交輸入值）。 我沒有得到所有其他數據丟失的地方。

此外，當我通過郵遞員發送數據一切正常但不知道為什么我從jsp頁面發送時遇到問題。

另外我最初在控制器中使用@RequestBody來獲取pojo類對象類型數據，但是它給出了內容類型不支持的錯誤，所以我用@RequestBody替換@RequestParam ，現在使用地圖類型數據。 現在錯誤沒有到來，但我仍然不明白它為什么會出錯。

jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
       pageEncoding="ISO-8859-1"%>

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<!-- Static content -->
<script
       src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" href="/resources/css/style.css">
<script type="text/javascript" src="/resources/js/app.js"></script>
</head>
<body>
   <script
       src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

 <form   id = "schedulejob" action="scheduleJob" method="POST">
<label>
<input type="checkbox"  id = "corporateClientCare" name="corporateClientCare" value="corporateClientCare" class="input_checkbox"> CorporateClientCare 
</label>
<label>
<input type="checkbox" id = "dayforce" name="dayforce" value="dayforce" class="input_checkbox"> Dayforce  </label>
<label>
<input type="checkbox" id = "tss" name="tss" value="tss" class="input_checkbox"> TSS </label>
<label>
<input type="checkbox" id = "multimax"  name="multimax" value="multimax" class="input_checkbox"> Multimax</label>
<label> <input type="checkbox" id = "arcot"  name="arcot" value="arcot" class="input_checkbox"> Arcot <br/></label> 
<input type="datetime-local" id="dateTime" name = "dateTime" value="2019-06-04T15:25:33">    
<input type="submit" name="Scheduler" value="Scheduler" class="submit"/></form>

<script>
jQuery(document).ready(function($) {
$("#schedulejob").submit(function(){
var scheduleRequest = {};
scheduleRequest["corporateClientCare"] = verifychecked("corporateClientCare");
scheduleRequest["dayforce"] = verifychecked("dayforce");
scheduleRequest["tss"] = verifychecked("tss");
scheduleRequest["multimax"] = verifychecked("multimax");
scheduleRequest["arcot"] = verifychecked("arcot");
scheduleRequest["dateTime"] = document.getElementById("dateTime").value;
scheduleRequest["timeZone"] = "Asia/Kolkata";
$.ajax({

type : form.attr('method'),
contentType : "application/json;charset=utf-8",
url : form.attr('action'),
data : JSON.stringify(scheduleRequest),
dataType : 'json',              
success : function(data) {

                    }
                });
         });

        function verifychecked(value) {
        var varr = '';
        if(document.getElementById(value).checked)
        {
           varr = value;
        }
        else{
            varr = null;
        }
          return varr;

    }
    });
    </script>   
</body>
</html>

controller

@Autowired
    private Scheduler scheduler;

@PostMapping("/scheduleJob")
public ResponseEntity<ScheduleResponse> scheduleJobs(@RequestBody ScheduleRequest  scheduleRequest) {
    try {
        System.out.println("___________IN CONTROLLER__________");
        System.out.println("--------------zone-----------");
        ZonedDateTime dateTime = ZonedDateTime.of(scheduleRequest.getDateTime(), scheduleRequest.getTimeZone());
        System.out.println("--------------date is-----------" + dateTime);
        System.out.println("dateTime is " + dateTime);
        if(dateTime.isBefore(ZonedDateTime.now())) {
            ScheduleResponse scheduleResponse = new ScheduleResponse(false,
                    "dateTime must be after current time");
            System.out.println("--------------1-------------------");
            return ResponseEntity.badRequest().body(scheduleResponse);
        }
//rest code

我沒有收到數據。 當我檢查調試模式時，我發現我的毛只有2個鍵，我不明白為什么它沒有捕獲租金數據。

Answer 1

在您的情況下，因為您已在表單中提供了action和method參數，並且由於您在表單上有一個提交按鈕，因此在單擊提交按鈕時，將觸發POST請求，並且此請求的內容類型將為application/x-www-form-urlencoded默認情況下。 因此，如果您希望將其更改為json，則必須使用enctype屬性，如：

<form method="post" enctype="multipart/form-data">

但不幸的是，HTML無法從表單數據生成JSON 。 如果您真的想從客戶端處理它，那么您將不得不求助於使用JavaScript

因此，您必須首先禁用html表單提交然后收集數據並使用jquery ajax執行發布請求，並將內容類型設置為application/json 。

嘗試使用以下jquery來觸發jquery表單提交：

$("#schedulejob").on('submit',function( event ) { 

event.preventDefault();

var scheduleRequest = {};
scheduleRequest["corporateClientCare"] = verifychecked("corporateClientCare");
scheduleRequest["dayforce"] = verifychecked("dayforce");
scheduleRequest["tss"] = verifychecked("tss");
scheduleRequest["multimax"] = verifychecked("multimax");
scheduleRequest["arcot"] = verifychecked("arcot");
scheduleRequest["dateTime"] = document.getElementById("dateTime").value;
scheduleRequest["timeZone"] = "Asia/Kolkata";

$.ajax({

type : form.attr('method'),
contentType : "application/json;charset=utf-8",
url : form.attr('action'),
data : JSON.stringify(scheduleRequest),
dataType : 'json',              
success : function(data) {

                    }
                });
         });

        function verifychecked(value) {
        var varr = '';
        if(document.getElementById(value).checked)
        {
           varr = value;
        }
        else{
            varr = null;
        }
          return varr;

  }); 
});

在您的代碼中，您沒有將'event'傳遞給函數。根據jquery文檔，您應該這樣做：Refer link

或者使用以下代碼而不是使用輸入類型提交按鈕：

<button type="button" id="submitBtn">Submit Form</button>

$(document).ready(function(){
$("#submitBtn").click(function(){        
   // Submit the form using jquery like above
});
});

如何將json數據從jsp頁面發送到彈簧控制器

問題描述

1 個解決方案

解決方案1
0 2019-06-06 07:42:46

如何將json數據從jsp頁面發送到彈簧控制器

問題描述

1 個解決方案

解決方案1 0 2019-06-06 07:42:46

解決方案1
0 2019-06-06 07:42:46