Uncaught InvalidStateError in JSON.stringify

Question

I've read this other thread and it was no good: Put data into JSON with Jquery

Whenever I try to JSON.stringify an object array I get an error saying:

Uncaught InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable. 

Here is my JS:

            var responseItems = [];

            var keynoteContainer = $('div.keynote-questions');
            var eventQuestionContainer = $('div.event-questions');
            var sessionContainer = $('div.session-questions');
            var eventId = $('#Evaluation-Event-Id').val();

            keynoteContainer.children().each(function (index, el) {
                var element = $(el);

                var id = "-1";
                var parentId = element.find('input[type=hidden]').val();
                var parentType = "Keynote";
                var responseValue = element.find('.response-item-slider').slider("option", "value");
                var responseText = "";

                var response = { "Id": id, "EventId": eventId, "ParentId": parentId, "ParentType": parentType, "ResponseValue": responseValue, "ResponseText": responseText };
                responseItems.push(response);
            });                    

            eventQuestionContainer.children().each(function (index, el) {
                var element = $(el);

                var id = "-1";
                var parentId = element.find('input[type=hidden]').val();
                var parentType = "EventQuestion";
                var responseValue = element.find('.response-item-slider').slider("option", "value");
                var responseText = element.find('textarea').val();

                var response = { "Id": id, "EventId": eventId, "ParentId": parentId, "ParentType": parentType, "ResponseValue": responseValue, "ResponseText": responseText };
                responseItems.push(response);
            });

            sessionContainer.children().each(function (index, el) {
                var element = $(el);

                var id = "-1";
                var parentId = element.find('input[type=hidden]').val();
                var parentType = "Session";
                var responseValue = element.find('.response-item-slider').slider("option", "value");
                var responseText = "";

                var response = { "Id": id, "EventId": eventId, "ParentId": parentId, "ParentType": parentType, "ResponseValue": responseValue, "ResponseText": responseText };
                responseItems.push(response);
            });

            responseItems = JSON.stringify(responseItems);

I've tried to log everything and it only breaks at the last line where I stringify it.

How can I fix this? Any piece of advise or information would be highly appreciated.

Answer 1

I had the same problem. In my case it was fixed casting my trouble variable toArray(). I mean something like this:
responseItems = responseItems.toArray();
I don't know why that variable looks like an Array but it isn't after that you can call:
JSON.stringfy(responseItems);
without problems.
PD: sorry for my english I'm not native english speaker

Answer 2

I had the same error. In my case, I had forgotten the .val() when I was setting one of the model properties. There wasn't an error until I tried to JSON.stringify the model

        this.model.set(
        {
            customername: this.$("#customername").val(),
            jobtitle: this.$("#jobtitle"),  //This was the line causing the error
            testimonialtext: this.$("#testimonialtext").val()
        });