NewJsGuy
NewJsGuy

Reputation: 113

reload polymer-elements or ajax call from a custom element

I has been working on this for days and nothing good get out of my head! I have an application that uses cookies for the session handling. The application use several custom elements that I import in the header, some of them need to use information form the cookie session to make an ajax-core call. The problem is when the cookie is not set (case: first start) so, I log into the app and I must reload the page in order to start getting the 'core-ajax auto' results. I dont know how to do a listener or how to reload all the custom elements or how to reload specifics core-ajax calls.

some one of you guys had/have similiar situations? which is the best way to fix it?

Thanks in advance!

Upvotes: 0

Views: 1235

Answers (2)

NewJsGuy
NewJsGuy

Reputation: 113

I had the same idea, but if the users doesn't log for a while, it will being in an undesired loop (I think that, maybe i'm wrong) so, what I finally did?

I have my ajax call, and in the response action I import files into the header with a dumb function

if(data.user){
   this.importLinks();
} else {
.....
}


importLinks: function () {
    this.createLinkRel('/static/resources/custom-elements/file.html');
    this.createLinkRel('/static/resources/custom-elements/log.html');
    this.createLinkRel('/static/resources/custom-elements/us.html');
    this.createLinkRel('/static/resources/custom-elements/shop.html');
},


createLinkRel: function (href){
    var script = document.createElement('link');
    script.rel = 'import';
    script.href = href;
    document.getElementsByTagName('head')[0].appendChild(script);
}

Thanks for take your time to read my post and for the answer!

Upvotes: 0

jimi dough10
jimi dough10

Reputation: 2016

it sounds to me as if you need to set core-ajax auto="false" and delay the query with setTimeout();

you can call the ajax call inside a polymer element by assigning it a id (i.e ajax for this example) and calling the go(); function

this.$.ajax.go(); 

to call it from outside the element you have to first make the function inside the element.

Polymer('custom-element', {
   doSend: function (event, detail, sender) {
     this.$.ajax.go();
   }
});

then call that from your main js file with

document.querySelector('custom-element').doSend(); 

so to put that all together and delay a query you could use

setTimeout(function () {
    document.querySelector('custom-element').doSend();
}, 1000);

would call the go function of core-ajax inside the custom-element after waiting 1 second.

Upvotes: 2

Related Questions