Polymer, auto binding not working

Hi i have a problem with Polymer.. This component is a detail of a listbox when it is clicked on a row. When the row is clicked, an ajax call get’s the data and calls the details.setItems(data) function. The console.log shows the this.item everywhere the function get called, the datas are in the variable, everything is fine just the GUI is not refreshing. maybe binding is not working? What should I do?

<polymer-element name="cegnyilvantarto-details" extends="base-details">
    <template>
        <page-structure dialog="{{dialog}}" flex style="height:100%">
            <div left-top>
                <table>
                    <td>
                        <tr>
                            <td>
                                <core-label for="#id">Azonosító:</core-label>
                            </td>
                            <td>
                                <paper-input id="id" disabled="true" value="{{item[0].id}}" style="text-align:center"></paper-input>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <core-label for="#name">Rendszám:</core-label>
                            </td>
                            <td>
                                <paper-input id="name" value="{{$.item[0].name}}"></paper-input>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <core-label for="#address">Gyártó:</core-label>
                            </td>
                            <td>
                                <paper-input id="address" value="{{$.item[0].address}}"></paper-input>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <core-label for="#phone">Telefonszám:</core-label>
                            </td>
                            <td>
                                <paper-input type="phone" id="phone" value="{{item[0].phone}}"></paper-input>
                            </td>
                        </tr>
                        <tr style="padding-bottom:30px;">
                            <td>
                                <core-label for="#contactname">Kapcsolattartó:</core-label>
                            </td>
                            <td>
                                <paper-input id="contactname" value="{{item[0].contactname}}"></paper-input>
                            </td>
                        </tr>
                        <tr style="padding-bottom:30px;">
                            <td>
                                <core-label for="#contactphone1">Telefonszám 1:</core-label>
                            </td>
                            <td>
                                <paper-input id="contactphone1" value="{{item[0].contactphone1}}"></paper-input>
                            </td>
                        </tr>
                        <tr style="padding-bottom:30px;">
                            <td>
                                <core-label for="#contactphone2">Telefonszám 2:</core-label>
                            </td>
                            <td>
                                <paper-input id="contactphone2" value="{{item[0].contactphone2}}"></paper-input>
                            </td>
                        </tr>
                        <tr style="padding-bottom:30px;">

                            <td>
                                <core-label>Cégcsoport:</core-label>
                            </td>
                            <td>
                                <me-combobox id="cgroupsCombobox" width="250"></me-combobox>
                            </td>
                            <td>
                            </td>
                            <td>
                            </td>
                        </tr>

                    </td>
                </table>
            </div>
            <div left-bottom flex style="height:100%">
                <div layout vertical flex style="min-height:140px;">
                    <core-label style="margin-top:10px;" for=" #comment ">Megjegyzés</core-label>
                    <paper-shadow z=1 flex style="width:100%; padding:10px; margin-top:10px; ">
                        <paper-autogrow-textarea flex style="width:100%; ">
                            <textarea id="comment " flex style="width:100%; " value="{{item[0].comment}} "></textarea>
                        </paper-autogrow-textarea>
                    </paper-shadow>

                </div>
            </div>
            <div right-top>
                <core-field>

                </core-field>
            </div>
            <div right-bottom>
                {{item | json}}
            </div>
            <div bottom-bar>
                <paper-button style="margin-left:15px;margin-bottom:15px;margin-top:5px; " self-start>Save</paper-button>
            </div>
        </page-structure>

        <core-ajax id="ajaxCGroupsCombobox" method="POST" handleAs="json" on-core-response="{{onCGroupsResponse}}"></core-ajax>

    </template>
    <script>
        Polymer('cgroups-details', {


            init: function () {
                this.getCGroupsCombobox();
                 },
            ready: function () {
                this.super();

            },
            setItems(item) {
                this.$.item = item;
                this.init();
                console.log("IDEJUTOTT");


            },
            getCGroupsCombobox: function () {
                var ajax = this.$.ajaxCGroupsCombobox;

                ajax.body = this.getComboboxBody();
                ajax.url = this.getServerAddress('get', 'cgroups');

                ajax.go();

            },

            onCGroupsResponse: function (event, response) {

                var res = response.response.res;
                var vehicles = [];
                //console.log(res);
                for (var i = 0; i < res.length; i++) {
                    var vehicle = {};
                    vehicle.text = res[i].name;
                    vehicle.id = res[i].id;
                    vehicle.name = res[i].name;
                    vehicle.comment = res[i].comment;
                    vehicles.push(vehicle);
                    // console.log(vehicle);
                }
                console.log(vehicles);
                this.$.cgroupsCombobox.setItems(vehicles);
            },


        });
    </script>
</polymer-element>


Source: html5

Leave a Reply