link(rel="import", href="/bower_components/polymer/polymer.html")
link(rel="import", href="/bower_components/core-ajax/core-ajax.html")
polymer-element(name='my-element', constructor='MyElement')
template
a(id='send', on-click='{{fileUpload}}')
form(id='filePost', action='', method='POST', accept-charset='utf-8', enctype='multipart/form-data')
input(id='fileinput', name='file', type='file')
script.
Polymer({
ready: function(){
//do something
},
launch:function(){
// prepare polymer element
},
fileUpload:function(){
// create XHR request and post file and on complete event exit to home view
},
exitUploader:function(){
history.pushState(null, null, '/home');
this.fire('goUrl');
this.remove();
},
});ok so this works fine, on its own... although I have a basic app router that calls the file upload and navigation to the site. that goes something like this:
link(rel='import', href='/bower_components/polymer/polymer.html')
link(rel='import', href='/polymer/my-element') //api that returns jade to rendered html
polymer-element(name='router', attributes='attributes')
template
div(class='container', id='appView')
script.
(function(){
var routerView = document.querySelector('router')
//listen for 'navigate event' and render view
addEventListener('goUrl',function(e){
routerView.navigation(e);
});
Polymer({
ready:function(){
//do something
},
launch:function(){
// prepare polymer element
},
navigation: function(){
var self = this;
event.preventDefault();
event.stopPropagation();
this.location = window.location.pathname;
switch(true){
case(self.location == '/maker'):
var maker = new MyElement();
maker.launch();
this.$.appView.firstChild.remove();
this.$.appView.appendChild(maker);
break;
case(self.location == '/anotherlocation'):
var anyOtherElement = newPolymerElement();
this.$.appView.firstChild.remove();
this.$.appView.appendChild(anyOtherElement);
break;
}
},
});
})();ok, so this works as well, my problem begins when i remove and re-render a new 'my-element' instance. when i upload such form it uploads an array of files pertinent to the history of files uploaded in previous visits. I was sure it had to do with removing the element properly from the dom on polymer, tried resetting the form on each time viewed the element. no dice. I need help! hahaha
also, i've tried calling elements locally through a fire event and do a this.remove(); when I do a this.remove i get an error saying this is undefined or null, so i'm having a hard time pinpointing whenre the problem occours
thanks in advance