passing json array to ajax call in Javascript

Question

guys i know its dummy questions but i spent hours on this and cant reach .. I am trying to pass a JSON array to JSP via an AJAX call in another JS file. It is giving me a 404 error. Any help would be appreciated. Here is my code:

function GridLibrary(fileName) {
    this.fileName = fileName;
}

GridLibrary.prototype = {
    setFileName : function(fileName) {
        this.fileName = fileName;
    },
    getFileName : function() {
        return this.fileName;
    }
};

GridLibrary.prototype.display = function() {
    $.ajax({
        url : this.getFileName(),
        dataType: "json",
        error : function(that, e) {
            console.log(e);
        },
        success : function(data) {
            alert("found");
        }
    });
};

var Json = [{
    "id": 1,
    "name": "name1",
    "age" : 10,
    "feedback": "feedback1"
}, {
    "id": 2,
    "name": "name2",
    "age" : 90,
    "feedback": "feedback2"
}, {
    "id": 3,
    "name": "name3",
    "age" : 30,
    "feedback": "feedback3"
}, {
    "id": 4,
    "name": "name4",
    "age" : 50,
    "feedback": "feedback4"
}];

new GridLibrary(Json).display();

What is data passed in the constructor? and you should remove the () from the ajax: url : this.getFileName, — Jai
– Jai, Commented Mar 14, 2016 at 8:19
isn't data should be Json? and then it just doesn't make sense to add data as a url in the ajax. — Jai
– Jai, Commented Mar 14, 2016 at 8:21
yes you are right .. i just mistaken in wrirting .. but still the same problem occurs — dina saber
– dina saber, Commented Mar 14, 2016 at 8:22
what is the method that you send to this request? POST || GET — Zamboney
– Zamboney, Commented Mar 14, 2016 at 8:23

Jai · Accepted Answer · 2016-03-14 10:15:14Z

1

You need to have a valid url to send the values to the backend:

function GridLibrary(url, data) {
  this.url = url;
  this.data = data;
}

GridLibrary.prototype = {
  setData: function(data) {
    this.data = data;
  },
  getData: function() {
    return this.data;
  },
  setUrl:function(url){ this.url = url; },
  getUrl:function(){ return this.url; },

  display : function() {
    $.ajax({
      url: this.getUrl, // <----the url where you want to send the data
      data:this.getData, //<----should be the array data
      dataType: "json",
      contentType:"application/json", // <----add this contentType
      error: function(that, e) {
        console.log(e);
      },
      success: function(data) {
        alert("found");
      }
    });
  }
};

var url = '/url/to/send',
    data = [{}....];

new GridLibrary(url, data).display();

edited Mar 14, 2016 at 10:15

answered Mar 14, 2016 at 8:33

Jai

74.8k12 gold badges76 silver badges104 bronze badges

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

4 Comments

Jai Over a year ago

which line @mmmm? this isn't helping. may be you should add contentType:"application/json" too to the ajax.

dina saber Over a year ago

@MichaelGeary so no other suggestions for this parse error ?

dina saber Over a year ago

@Jai no other suggestions for the parse error i have ?

Michael Geary Over a year ago

What does the parse error point to? Is it the display =? Change that to display:. Then you'll also need the actual data in the data = [].

Collectives™ on Stack Overflow

passing json array to ajax call in Javascript

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related