如何通过纸张按钮点击触发iron-ajax请求？

本文介绍了如何通过纸张按钮点击触发iron-ajax请求？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我希望< iron-ajax> 到 POST 来自的动态数据< textarea> 到 http://example.net 当我点击< paper-button> 元素：

I would like <iron-ajax> to POST dynamic data from a <textarea> to http://example.net when I click a <paper-button> element:

function get_data() {
  return {content:document.getElementById("mycontent").html()}
}

<html>
  <head>
    <!-- Imports-->
  </head>
  <body>
    <iron-ajax
      url="//example.net"
    ></iron-ajax>
    <paper-button id="mybutton"></paper-button>
    <textarea id="mycontent"></textarea>
  </body>
</html>

我该怎么办？结合和元素将数据发送到服务器？

How can I combine the iron-ajax and paper-button elements to send the data to the server?

推荐答案

您需要将聚合物元素包装在将注册为聚合物元素的标签中。你可以使用 dom-bind 。

You need to wrap your polymer elements in a tag that will register as polymer element. You can use dom-bind in your case.

<template id="t" is="dom-bind">
    <textarea value="{{dataToPost::input}}"></textarea>
    <paper-button on-tap="postData">Post Data</paper-button>
    <iron-ajax
    id="dataAjax"
    method="post"
    url="data/url"
    on-response="postComplete"></iron-ajax>
</template>

在脚本中你需要调用 generateReqeust 在 iron-ajax 元素。

In the script you need to call generateReqeust on iron-ajax element.

(function (document) {
'use strict';
document.addEventListener('WebComponentsReady', function() {

    // We have to bind the template with the model
    var t = document.querySelector('#t');
    var ajaxRequest = t.$.dataAjax;

    // make the iron-ajax call
    t.postData = function() {
      ajaxRequest.body = {
        'text': t.dataToPost;
      }
      ajaxRequest.generateRequest();
    }

    //callback on request complete
    t.postComplete = function(){
      alert('whoa! request complete');
    }
});
})(document);

GET 的工作plunker：

Working plunker for GET: http://plnkr.co/edit/13QJ7QFETIBg4bEiCMS7?p=preview

这篇关于如何通过纸张按钮点击触发iron-ajax请求？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！