0

I'm trying to send some FormData via a simple jquery ajax GET/Post but for some reason my formData is not getting set right. I end up with ?[object%20FormData] as my payload.

I'm a bit new to this FormData stuff, but I was able to use it successfully with file uploads no problem using this same technique... Here's what I'm doing with my specified values I want to send:

I should note: I'm not using any form element to grab these values from.

var data = new FormData();
        data.append("date", curDate);
        data.append("serviceID", sID);
        data.append("attSummID", asID);
        data.append("totalCount", 0);
        data.append("visitorCount",0);
        data.append("reset",false);
        $.ajax({
            url: '/4DACTION/WEB_ServiceCounts/',
            processData: false, 
            contentType: false, 
            data: data,
            dataType: 'json',
            type: 'GET',
            success: function(response){
                    console.log(response);
            },
            error: function(jqXHR, textStatus, errorThrown){
                    alert('ERRORS: ' + textStatus);
            }
        });

Any tips?

btbJosh
  • 305
  • 2
  • 12
  • are your input field ids curDate, sID, asID? then, if you want their values you have to use: $("#curDate").val() ... – Birgit Martinelle Oct 03 '14 at 15:08
  • Have you tried removing `contentType: false`? If you're using `FormData`, I think the default `contentType` of `application/x-www-form-urlencoded; charset=UTF-8` is appropriate? – James Thorpe Oct 03 '14 at 15:09
  • @BirgitMartinelle those are declared variables that I am setting. I was under the impression you could just reference variables like this: https://developer.mozilla.org/en-US/docs/Web/Guide/Using_FormData_Objects – btbJosh Oct 03 '14 at 15:09
  • @JamesThorpe this post seems to lead me to believe that I need that there: http://stackoverflow.com/questions/6974684/how-to-send-formdata-objects-with-ajax-requests-in-jquery Also, if I take it out I get an error. – btbJosh Oct 03 '14 at 15:11
  • You have to pass your form to the constructor then .. like this: new FormData($("#formId"); – Birgit Martinelle Oct 03 '14 at 15:11
  • @BirgitMartinelle I'm not using a form. I'm just assigning declared variable values as formData. – btbJosh Oct 03 '14 at 15:13
  • @btbJosh ok - wasn't sure if that was just when you were sending files - what error do you get without it? – James Thorpe Oct 03 '14 at 15:14
  • how do you declare them? – Birgit Martinelle Oct 03 '14 at 15:16
  • @JamesThorpe `Error message: Uncaught TypeError: Illegal invocation URL: http://localhost/js/jquery.min.js Line Number: 5` – btbJosh Oct 03 '14 at 15:18
  • @BirgitMartinelle I really don't think that's relevent as I get the same results if I explicitly type a string into the "value" argument of the `.append()` method. – btbJosh Oct 03 '14 at 15:19
  • Have you tried it as a `POST` instead of `GET` at all? – James Thorpe Oct 03 '14 at 15:20
  • @JamesThorpe I'm trying to handle server-side logic differently based on whether it is a `POST` or a `GET` so I would prefer to use them this way if possible... But it does seem to construct the payload properly on a `POST` – btbJosh Oct 03 '14 at 15:28
  • ok - just wondering if due to how jQuery handles an ajax request, it may always be trying to convert the `data` parameter to something it can put on the query string for the `GET`. – James Thorpe Oct 03 '14 at 15:30
  • I think you're right... Which means I need to restructure my server code. :( – btbJosh Oct 03 '14 at 15:32
  • 1) If you use `GET` then you don't need FormData at all 2) Instead of FormData you could send an object instead that looks like so `data : { key : val , foo : bar }` – Yang Oct 03 '14 at 17:52

0 Answers0