how to access a polymer element's function externally with javascript

[emails....@gmail.com]

Hi:

given that I have defined my polymer element 

<my-element></my-element>

in the html

and I have written a some Polymer functions. 

i.e.  

<dom-module id="my-element">

    <template>

        <div>content</div>

    </template>

    <script>

        (function(){

            Polymer({

                is: 'my-element',

                properties: {

                  

                },

                doStuff: function(){

                    alert('hello'); 

                }

            });

        })();

    </script>

</dom-module>

How do can I call doStuff() using javascript in the html??? 

<script>

var myelement = ?????? (is it document.get??? or Polymer.dom(??).querySelector(??) ???

myelement.doStuff();

</script>

Thanks 

J. 

[Francisco Revelles]

this.doStuff()

Sent from my iPhone

Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/02ed261a-28e1-466f-8b9d-c2c1af933146%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Eric Bidelman]

Since you're working on the outside of an element, document.querySelector and document.getElementById should be safe here. You're also not manipulating the element (appending/removing children or changing classes/attribute that could affect distribution).

Polymer.dom() is only needed when you're manipulating nodes. https://www.polymer-project.org/1.0/docs/devguide/local-dom.html#dom-api

[Eric Bidelman]

Try waiting for the WebComponentsReady event before poking at an element's properties/methods:

https://www.polymer-project.org/1.0/docs/migration.html#polymer-ready

On Wed, Jul 1, 2015 at 6:52 PM <alebe...@gmail.com> wrote:

Tried with both document.querySelector and document.getElementById but still cant access the function

HTML

<ajx-api 

id="api1"

in1='uname'

in2='pass'

></ajx-api>

</body>

<script src="_js/jquery-1.6.3.min.js"></script>

<script>

$(document).ready(function() {

//$('#form').submit(function() {

var x=document.querySelector("ajx-api ");

var y=document.getElementById("api1");

console.log(x);

console.log(y);

y.reqAjx();

x.reqAjx();

//}); // end submit

}); // end ready

</script>

Element

<dom-module id="ajx-api" >

<template>

<iron-ajax

id="iajax"

handle-as="json"

on-response="hresponse"

></iron-ajax>

</template>

<script>

(function(){

Polymer(

{

is: "ajx-api",

properties: {

prms: Object,

in1: {

type: String,

value: ""

},

in2: {

type: String,

value: "taco"

}

},

hresponse: function(request) {

},

reqAjx: function () {

this.$.iajax.url = this.url_d;

this.$.iajax.method = this.met;

if(this.$.iajax.method=="get") {

this.$.iajax.params = this.parms;

}

else {

this.$.iajax.body = this.parms;

}

},

});

});

</script>

</dom-module>

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/393b549e-0e17-426a-9d0b-73d3fd84e458%40googlegroups.com.

[Ádám Liszkai]

It's work for me but if I load the element asynchronously into the DOM the WebComponentsReady event does not fire. @Eric can you help me? I feel that I just make a little mistake and thats why not working :/

https://groups.google.com/forum/#!topic/polymer-dev/S2Mvf9kO87I