execution sequence when there is an EventListener

[lucian vanghele]

I have a login form using ajax-form "submitted" event. Based on this I'm trying to set a cookie with a session value provided by the server and use this in the header of a subsequent iron-ajax call. But, the execution sequence is not the one I was hoping: function inside evenlistener is executed only at the end so my ajax call is done without the proper header. The header value is computed on the sessionid value change.

                Properties{ 

                          headers: {

type: Object,

computed: 'getHeaders(sessionid)'

},

                               sessionid: {

                                    type: String,

                                    value: ''

                                }

}

                          getHeaders: function(customHeader) {

        return {'Token': customHeader}

},

                     _submitOnLogin: function(event) {

this.user = this.$.username.value;

this.pass = this.$.password.value;

var content = this.$$("#loginForm");

content.action = '/api/v1/sessions/login';

content.addEventListener('submitted', this.setCookie); //where I'm getting the session value and change my sessionid 

this.$$("#loginForm").submit();  //I was hoping the setCookie function will be executed here 

                                this._loadAppProfiles(); // triggering the iron-ajax call

},

                setCookie: function(event) {

          if (event.detail.status==200) {

var response=JSON.parse(event.detail.response);

sessionid = response["sessionToken"];

this.sessionid=sessionid;}

                },

                     _loadAppProfiles: function(event) {

this.$.getprofile.generateRequest();

},

What am I missing - it's obvious it's something I wrongly presumed.

Thanks