我正在开发一个自定义元素,它将用作使用restful服务将地图节点数据发送到数据库的表单.
我有3个关于这个元素的问题.
>这甚至可以工作吗?我正在尝试使用一种方法,当从服务器收集数据时,这种方法与直接数据绑定方法完全相反.这可以用于发送到服务器.
>在core-ajax元素中我正在使用auto =“false”属性.当用户点击纸质按钮时,我将如何调用go()命令?
>如果这个发送方法可以工作,我如何在提交时在PHP中捕获body =“{}”行?我知道它不是作为$_GET发送的.是作为$_POST发送还是我需要使用另一种方法来捕获它?
我的元素模板目前看起来像
<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="../bower_components/paper-input/paper-input.html">
<link rel="import" href="../bower_components/paper-button/paper-button.html">
<link rel="import" href="../bower_components/core-ajax/core-ajax.html">
<polymer-element name="add-node" attributes="url">
<template>
<style>
paper-input {
color:#000000;
text-align:left;
}
paper-button.colored {
background:#000000;
color:#ffffff;
}
.centered {
display:block;
text-align:center;
width:100%;
}
</style>
<geo-location latitude="{{lat}}" longitude="{{lng}}"></geo-location>
<form id="form_1">
<paper-input floatingLabel label="Name:" value="{{name}}"></paper-input>
<br>
<paper-input floatingLabel label="Street Address:" value="{{address}}"></paper-input>
<br>
<paper-input floatingLabel label="City" value="{{city}}"></paper-input>
<br>
<paper-input floatingLabel label="State" value="{{state}}"></paper-input>
<br>
<paper-input floatingLabel label="Zip" value="{{zip}}"></paper-input>
<br>
<paper-input floatingLabel label="Phone:" value="{{phone}}"></paper-input>
<br>
<paper-input floatingLabel label="Description:" value="{{description}}"></paper-input>
<br>
<div class="centered">
<paper-button on-tap="{{doSend}}" raisedButton class="colored" label="Save"></paper-button>
</div>
</form>
<core-ajax id="ajax" auto="false" method="POST" contentType="application/json" url="{{url}}"
body='{"name":"{{name}}","address":"{{address}}","city":"{{city}}","state":"{{state}}","zip":"{{zip}}","phone":"{{phone}}","description":"{{description}}","longitude":"{{lng}}","latitude":"{{lat}}"}' response="{{response}}">
</core-ajax>
<template repeat="{{response}}">{{data}}</template>
</template>
<script>
polymer('add-node',{
doSend: function(event,detail,sender){
this.$.ajax.go();
}
});
</script>
</polymer-element>
它应该工作正常.要调用go(),请将ajax元素设为id,以便于访问,即
<core-ajax id="foobar" auto="false" ...></core-ajax>
将事件处理程序附加到按钮
<paper-button ... on-tap="{{doSend}}"></paper-button>
并在元素脚本部分实现doSend()处理程序(不要忘记在元素声明中删除noscript)
<script>
polymer('add-node',{
doSend: function(event,sender){
this.$.foobar.go();
}
});
</script>
在服务器端处理数据时 – 是的,你应该在$_POST中查找数据.