CODEWITHSUNDEEP
javascriptinputpolymer
durgesh.patle
durgesh.patle

Reputation: 720

Polymer: Not able to get input from paper-input element

I have just started exploring polymer.js. I want to get input from paper-input element. And want to read it. I have a paper button. On clicking that button, value in paper-input should be stored in global variable USER_NAME.

I referred the stackoverflow post Polymer: get the value of paper-input inside a paper-dialog after paper-button press "ok"

But it is not working for me. Here is my code:

<div id="profileInfoForm">
 <h2>Tell us about you...</h2>
 <div class="profileField">
                    <h5>Name :</h5>
                    <paper-input name="profileName" id="profileNameId" inputValue="{{ valHeader }}" label="What will we call you ?"></paper-input>
                </div>

                <div class="profileField" style="text-align: center;">
                    <div onclick="fetchDataFromForm();" id="proceedButton" class="button raised blue" style="text-align: center">
                        <div class="center" fit>Proceed</div>
                        <paper-ripple fit></paper-ripple>
                    </div>
                </div>

</div>


<script>
 var USER_NAME="";
Polymer('note-list',{
    fetchDataFromForm: function(e, detail, sender)
      {
        USER_NAME = this.valHeader;

      }
    });
</script>

Thanks.

Upvotes: 1

Views: 1598

Answers (1)

CletusW
CletusW

Reputation: 3980

The example you copied from was not complete. The script at the bottom is defining an element called note-list, but they omitted the part where they began the element's definition. See this jsbin for a working version of your code.

Two takeaways:

  1. Polymer('note-list', ... is only useful if you also create a polymer-element definition.
  2. To use Polymer's declarative event handling you must use the on-[event] syntax (notice the dash) and use handlebars {{ }} around the handler name in the attribute value.

Upvotes: 3

Related Questions