CODEWITHSUNDEEP
polymerjsonp
Nayan Mistry
Nayan Mistry

Reputation: 11

Polymer iron-jsonp-library component's on-data event not getting called

I am using polymer 1.0's iron-jsonp-library component to fire a cross domain call to get data. My below component's code fires the jsonp request successfully and i get the expected json data in the response. But the event specified in the "on-data" attribute of iron-jsonp-library doesn't fire. There are no javascript errors prompted in the console. Hence could not figure out what is wrong. The on-data attribute works successfully in the sample application posted by angular team member at https://github.com/surma/polymer-reddit-api. But for my cross domain call the iron-jsonp-lib component is not working as expected. Am i doing anything wrong?

<link rel="import" href="bower_components/iron-jsonp-library/iron-jsonp-library.html">
<dom-module id="galpicker-api">
  <template>
    <iron-jsonp-library on-data="_loadNewData" library-url="[[_requestUrl]]" callbackName="_ajaxLoad"></iron-jsonp-library>
  </template>
  <script>
    Polymer({
      is: 'galpicker-api',
      properties: {
        searchtext: {
          type: String,
          reflectToAttribute: true,
          notify: true
        },
        employees: {
          type: Array,
          readOnly: true,
          value: function() {
            return [];
          },
          notify: true
        },
        baseUrl: {
          type: String,
          reflectToAttribute: true,
          value: 'https://example.com'
        },
        _requestUrl: {
          type: String,
          readOnly: true,
          computed: '_computeUrl(baseUrl, searchtext)',
          notify: true
        }
      },
      _computeUrl: function(baseUrl, searchtext) {
        return baseUrl + '/api/v1/Employees/search?q=' + searchtext + '&jsonp=%%callback%%';
      },
      _loadNewData: function(ev) {
        alert(ev);
        this._setEmployees(
          ev.detail[0].map(function(employee) {
          return {
            firstName: employee.firstName,
            lastName: employee.lastName,
            department: employee.department
          };
        }));
      },
      _data: function(ev) {
        alert(ev);
      },
      _ajaxLoad: function(data){
        alert(data);
      }
    });
  </script>
</dom-module>

Upvotes: 0

Views: 368

Answers (1)

Vladimir Brasil
Vladimir Brasil

Reputation: 693

One error is found: callbackName="_ajaxLoad" should be written callback-name=(...). If it is still usefull...

Upvotes: 0

Related Questions