title: Pass polymer form data to rest api
body: <p>I'm looking for some way to pass data from a Polymer form fields to REST API,
  actually, I'm using core-ajax to do it but I think is a bit heavy method to do it.</p>
  
  <p>Are any standard way to do it?</p>
  
  <p>This is my code:</p>
  
  <pre><code>&lt;template&gt;
  &lt;section&gt;
      &lt;file-input class="blue" id="file" extensions='[ "xls" ]' maxFiles="1"&gt;{{ FileInputLabel }}&lt;/file-input&gt;
  &lt;/section&gt;
  &lt;section&gt;
      &lt;paper-button raised class="blue" disabled?="{{ (! Validated) || (Submitted) }}" on-tap="{{ Submit }}"&gt;
      &lt;core-icon icon="send"&gt;&lt;/core-icon&gt; 
               Process
      &lt;/paper-button&gt;
  &lt;/section&gt;
  
  &lt;paper-toast id="toast" text=""&gt;&lt;/paper-toast&gt;
  
  &lt;core-ajax id="ajax" url="/import-pdi" method="POST" handleAs="json" response="{{ response }}" on-core-complete="{{ SubmitFinished }}"&gt;&lt;/core-ajax&gt;
  &lt;/template&gt;
  
      &lt;script&gt;
          Polymer("import-pdi-form", {
  
              Validated: false,
              Submitted: false,
  
              FileInputLabel: "SELECT",
              ready: function () {
                  this.shadowRoot.querySelector("#file").addEventListener("change", function(event) {
                      var container = document.querySelector("import-pdi-form");
                      container.Validated = (event.detail.valid.length != 0);
                      if (event.detail.valid.length == 0) {
                          container.shadowRoot.querySelector("#toast").text = "Invalid Format";
                          container.shadowRoot.querySelector("#toast").show();
                          container.FileInputLabel = "SELECCIONA L'ARXIU";
                      }
                      else {
                          container.FileInputLabel = event.detail.valid[0].name;
                          var form_data = new FormData();
                          form_data.append("file", event.detail.valid[0], event.detail.valid[0].name);
                          container.shadowRoot.querySelector("#ajax").body = form_data;
                          container.shadowRoot.querySelector("#ajax").contentType = null;
                      }
                  });
              },
              Submit: function() {
                  if ((this.Validated) &amp;&amp; (! this.Submitted)) {
                      this.Submitted = true;
                      this.shadowRoot.querySelector("#ajax").go();
                  }
              },
              SubmitFinished: function(event, detail, sender) {
                  if (detail.xhr.status == 200) {
                      this.shadowRoot.querySelector("#toast").text = JSON.parse(detail.xhr.response).message;
                  }
                  else {
                      this.shadowRoot.querySelector("#toast").text = "Server Error";
                  }
                  this.shadowRoot.querySelector("#toast").show();
                  this.FileInputLabel = "SELECCIONA L'ARXIU";
                  this.shadowRoot.querySelector("#file").reset();
                  this.Submitted = false;
              }
          });
       &lt;/script&gt;
  </code></pre>