nim
nim

Reputation: 328

Polymer core-ajax why callback not work?

Here my code:

<!DOCTYPE html>
<html>
<head>
    <script src="/client/polymer-0.5.2/bower_components/webcomponentsjs/webcomponents.min.js"></script>

    <link href="/client/polymer-0.5.2/bower_components/polymer/polymer.html" rel="import">
    <link href="/client/polymer-0.5.2/bower_components/core-ajax/core-ajax.html" rel="import">

</head>
<body>

    <core-ajax id="directorInfoAjax" url="/main.ashx?action=directorInfo" handleAs="text" on-core-response="callback">
        <script>
            Polymer(
            {
                callback: function ()
                {
                    var bp = this.response;
                }
            });
        </script>
    </core-ajax>

    <script>
        document.addEventListener('polymer-ready', function()
        {
            document.querySelector("#directorInfoAjax").go();
        });
    </script>
</body>
</html>

What wrong? Call back not fire.

111111111111111111111111111111111111 222222222222222222222222222222222222 333333333333333333333333333333333333

Upvotes: 0

Views: 741

Answers (2)

LostInBrittany
LostInBrittany

Reputation: 1162

As far as I know, you aren't using <core-ajax> as it should be used.

Here you have a working example for <core-ajax>:

<!doctype html>
<html>
<head>
  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
  <title>seed-element Demo</title>
  <script src="https://www.polymer-project.org/components/webcomponentsjs/webcomponents.js"></script>
  <link rel="import" href="https://www.polymer-project.org/components/polymer/polymer.html">
  <link rel="import" href="https://www.polymer-project.org/components/core-elements/core-elements.html">
  <link rel="import" href="https://www.polymer-project.org/components/paper-elements/paper-elements.html">

</head>

<body>

 <core-ajax id="directorInfoAjax" url="http://echo.jsontest.com/key/value" handleAs="text" on-core-response="{{callback}}"></core-ajax>


  <script>
    document.addEventListener('polymer-ready', function() {
      var ajax = document.querySelector("core-ajax");
      ajax.addEventListener("core-response", function(e) {
          alert("I received a response "+ this.response);
          console.log(this.response);
        }
      );
      ajax.go(); // Call its API methods.
    });
  </script>
</body>
</html>

In your code, the Polyymer declaration inside the component doesn't seem to work, and even if it worked, the callback function need to be wrapped in {{ }}.

A Plunker here: http://plnkr.co/edit/rOuNPu99D7ROX4ewbLnK?p=preview

I hope it helps, but if not, don't hesitate to ask for further information!

[EDIT] I wrote a simpler example

Upvotes: 1

sandeep patel
sandeep patel

Reputation: 436

Check the below tutorial it might help you to figure out the issue:- http://www.tutorialsavvy.com/2014/07/understanding-polymer-core-ajax-element.html

Upvotes: 0

Related Questions