CODEWITHSUNDEEP
javascripthtmlarrayspolymer
LoveAndHappiness
LoveAndHappiness

Reputation: 10135

PolymerJS: Pass array of items to function - Uncaught Typeerror: Converting circular structure into JSON

I've got a simple app that looks like this:

Polymer Todo App

The app has a Complete All Button which should do what the label says it should and it works. But after I push the button I get the following error message in my console:

Uncaught Typeerror: Converting circular structure into JSON

Uncaught Typeerror: Converting circular structure into JSON

This is what the function that completes all tasks looks like:

setItemsCompleted: function(completed) {
    for (var i = 0; i < this.items.length; ++i) {
        this.set(['items', i, 'completed'], completed);
    }
}

It seems to be accepting an array of items. I'd like to pass it an array of items, but this is my function that gets triggered by the complete All button:

completeAll: function(e) {
    console.log(this.items);
    this.model.setItemsCompleted(this.items);
},

Here is the code of my complete All button in my td-todos.html:

<template is="dom-if" if="{{!allCompleted}}">
    <paper-button 
        raised 
        tabindex="1" 
        class="colorful" 
        id="complete-all" 
        on-tap="completeAll">
        Complete All
    </paper-button>
</template>

My question is, how do I pass it an array of items instead of an object with the items?

Or maybe it accepting function is wrong, because it initially accepted an event fired by a checkbox that looked like this:

toggleAllCompletedAction: function(e) {
    this.model.setItemsCompleted(e.target.checked);
},

The code above is taken straight out of the TodoMVC example of the Polymer Library and just slightly modified. So the question can be reduced to, how do I use the button, instead of a checkbox?

Upvotes: 1

Views: 65

Answers (1)

Maria
Maria

Reputation: 5604

setItemsCompleted takes a Boolean as an argument. In the original, the checked status of the checkbox is passed in. So either all items were marked as completed or not completed depending on the status of the checkbox. Now, if you want to set all to completed with a button, just pass in true. 

completeAll: function(e) {
    this.model.setItemsCompleted(true);
},

Upvotes: 1

Related Questions