Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
<link rel="import" href="../../bower_components/polymer/polymer.html">
<link rel="import" href="../../bower_components/iron-ajax/iron-ajax.html">
<link rel="import" href="../../bower_components/paper-input/paper-input.html">
<dom-module id="ajax-multiple">
<template>
<section id="content">
<paper-input id="post" label="Post" value="{{title}}" on-blur="resolve">
</paper-input>
<iron-ajax auto url="{{resolveUrl}}" handle-as="json" on-response="onResponse" id="xhr"></iron-ajax>
</section>
</template>
<script>
(function(){
'use strict';
const url = "https://jsonplaceholder.typicode.com/posts/";
Polymer({
is: 'ajax-multiple',
properties:{
title: {
type: String
},
resolveUrl: {
type: String
},
},
resolve: function(event) {
if(event.target.value.match(/^[0-9]+$/)) {
this.set('resolveUrl', url + event.target.value);
}
},
onResponse: function(response){
this.set('title', response.detail.response.title);
}
});
</script>
</dom-module>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment