2016-06-02 1 views
1

철 폼 폴리머에 addEventListener를 구현하는 방법은 무엇입니까? 정의되지철 폼 폴리머에 addEventListener를 구현하는 방법

<form is="iron-form" method="get" action="/" id="eventsDemo"> 
    <paper-input name="name" label="Name" required auto-validate></paper-input> 
    <paper-input name="password" label="Password" type="password" required auto-validate></paper-input> 
    <paper-checkbox name="read" required>You must check this box</paper-checkbox><br> 
    <paper-button raised onclick="_delayedSubmit(event)" disabled id="eventsDemoSubmit"> 
    <paper-spinner id="spinner" hidden></paper-spinner>Submit</paper-button> 
    <paper-button raised onclick="_reset(event)">Reset</paper-button> 
    <div class="output"></div> 
</form> 
<script> 
    eventsDemo.addEventListener('change', function(event) { 
    // Validate the entire form to see if we should enable the `Submit` button. 
    eventsDemoSubmit.disabled = !eventsDemo.validate(); 
    }); 
    function _delayedSubmit(event) { 
    spinner.active = true; 
    spinner.hidden = false; 
    eventsDemoSubmit.disabled = true; 
    // Simulate a slow server response. 
    setTimeout(function() { 
     Polymer.dom(event).localTarget.parentElement.submit(); 
    }, 1000); 
    } 
    function _reset(event) { 
    var form = Polymer.dom(event).localTarget.parentElement 
    form.reset(); 
    form.querySelector('.output').innerHTML = ''; 
    } 
    document.getElementById('eventsDemo').addEventListener('iron-form-submit', function(event) { 
    spinner.active = false; 
    spinner.hidden = true; 
    eventsDemoSubmit.disabled = false; 
    this.querySelector('.output').innerHTML = JSON.stringify(event.detail); 
    }); 
</script> 

내 양식 아이디 'eventsDemo', 이유 :

내가 이미이 가이드 다음 iron-form

을이 내 코드?

Uncaught ReferenceError: eventsDemo is not defined 
+0

이 HTML 또는 다른 사용자 정의 요소에 있습니까? 'var eventsDemo = document.getElementById ('eventsDemo')'또는'this. $. eventsDemo'를 사용하는 것이 어떻습니까? –

+0

@TomaszPluskiewicz "