Ajax javascript Map to Spring controller

Question

I am trying ajax Javascript Map, to spring controller. but it's getting null in backend. Please excuse if i am repeating question.

I can't change Map type, as my whole front end logic on it. Because set, get and has method from Map is what I need.

var ansMap = new Map(); // This way i created object

// added many values in ansMap,

$.ajax({
        type: "POST",
        url: myUrl,
        contentType : 'application/json',
        //cache: false,
        dataType : 'json',
        data : ansMap, // can't JSON.stringy(ansMap) as it gives empty json
        success: function(result) {
            console.log(result);
        },

Spring code

@RequestMapping (value="myUrl", method=RequestMethod.POST)
    public @ResponseBody String saveData(@RequestParam(required = false, value = "mapData") Map<String,List<String>> mapData, Model map)
    {
        log.info("Call Success");
        log.info("mapData: "+mapData);

Please suggest what needs to be done here.

jstuartmilne · Accepted Answer · 2019-10-21 15:26:17Z

1

You can actually send your Map without mutating the value

var ansMap = new Map(); // This way i created object

// added many values in ansMap,

$.ajax({
        type: "POST",
        url: myUrl,
        contentType : 'application/json',
        //cache: false,
        dataType : 'json',
        data : JSON.stringify(Object.fromEntries(ansMap)), // can't JSON.stringy(ansMap) as it gives empty json
        success: function(result) {
            console.log(result);
        },

That will turn it into a javascript object.

Object.fromEntries Will turn you Map into a javascript object, without altering the original Map

Regarding your backend i think you mis-interpret the @RequestParam annotation The @RequestParam is to extract query parameters, form parameters and even files from the request.

I think that what you are looking for is @RequestBody. Meaning you would be looking for something similar to :

@RequestMapping(value="/myUrl",method = RequestMethod.POST) 
    public String saveData( @RequestBody Map<String,Object> body) {

edited Oct 21, 2019 at 15:26

answered Oct 21, 2019 at 14:59

jstuartmilne

4,5181 gold badge22 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Amol Bais Over a year ago

I am getting null in back end, do i need to change to modify my java file also ?

Amol Bais Over a year ago

getting Method Not Allowed after updating java, also i don't have pojo for this request, this is simple key value pair

jstuartmilne Over a year ago

Your "POJO" is the Map<string,object> im asuming your myUrl variable is set to the right url. You can add this consumes = { "application/json" } to your RequestMapping annotation to be more specific

Amol Bais Over a year ago

yes, it is correct url. it's corporate url. hence I didn't disclosed here. getting same error Method Not Allowed . m also trying other approaches.

jstuartmilne Over a year ago

basic @RequestBody with a java.util. Map should work. Method not allowed can be because of a number of things. one being having something as required which isn't

|

Dirk Deyne · Accepted Answer · 2019-10-21 17:34:11Z

This should work

page

<button id="doPost"> post </button>
    <script>
        $(function () {
            var map = new Map();
            map.set('CIQ_2','aa');
            map.set('CIQ_3','78965412300');

            console.log(map);

            $("#doPost").click (function() {
                var settings = {
                    beforeSend: function(xhr, options) {
                        xhr.setRequestHeader("content-type" ,"application/json; charset=utf-8");
                    },
                    type: 'POST',
                    url:  '/post' ,
                    data: JSON.stringify(Object.fromEntries(map))
                }

                $.ajax(settings).done(function(result) {
                    console.log("done : " + result);
                });
            });

        });

    </script>

Controller

    @PostMapping("/post")
    @ResponseBody
    public String post(@RequestBody Map<String,String> data) {
        System.out.println(data);
        return "data well received";
    }

will print {CIQ_2=aa, CIQ_3=78965412300}

working code on GitHub

Collectives™ on Stack Overflow

Ajax javascript Map to Spring controller

2 Answers 2

6 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related