Как сделать простую ajax-форму на Polymer?

Question

[Дмитрий]

Пытаюсь сделать элемент простой контактной ajax-формы с валидацией и откликом "отправлено" или "произошла ошибка". Но вне зависимости от того, что я набираю в полях ввода, отправляется такой запрос:

callback.php?0="&1=n&2=a&3=m&4=e&5="&6=%3A&7=%20&8="&9="&10=%2C&11=%20&12="&13=e&14=m&15=a&16=i&17=l&18="&19=%3A&20=%20&21="&22="&23=%2C&24=%20&25="&26=m&27=e&28=s&29=s&30=a&31=g&32=e&33="&34=%3A&35=%20&36="&37="&38=%7D

Вот код элемента:

<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="../bower_components/iron-ajax/iron-ajax.html">
<dom-module id="callback-dialog">
  <template>
    <div>
      <input type="text" placeholder="Name" value="{{name}}">
    </div>
    <div>
      <input type="text" placeholder="Email" value="{{email}}">
    </div>
    <div>
      <textarea type="text" placeholder="Message" value="{{message}}"></textarea>
    </div>
    <div>
      <button on-click="buttonClick">Send</button>
    </div>
    <iron-ajax
      id="ajaxSubmit"
      url="/callback.php"
      method="POST"
      params='{"name": "{{name}}", "email": "{{email}}", "message": "{{message}}"}'
      response="{{response}}">
    </iron-ajax>
  </template>
  <script>
    Polymer({
      is: 'callback-dialog',
      buttonClick: function() {
        this.$.ajaxSubmit.generateRequest();
      },
      responseChanged: function(oldValue) {
        console.log(this.response);
      }
    });
  </script>
</dom-module>

В общем, что не так? И как исправить?

Кто работал с Polymer, может есть у кого-нибудь элемент с iron-form вместе с iron-ajax и откликом?)

Answer 1

[litvin2]

У полей не заданы атрибуты NAME="xxx"

Скрипт же собирает params='{"name": "{{name}}", "email": "{{email}}", а так как имена не заданы, он передает цифровые порядки полей: 0, 1, 2 и тп.

Правильно как-то так:

<div>
    <input type="text" name="name" placeholder="Name" value="{{name}}">
</div>

<div>
    <input type="text" name="email" placeholder="Email" value="{{email}}">
</div>

<div>
    <textarea type="text" name="message" placeholder="Message" value="{{message}}"></textarea>
</div>

Comments

[Дмитрий]

Попробовал. Ничего не поменялось. Формирует такой же запрос.