Polymer 1.0 Eisenform verweigern, um Daten anzuzeigen

Question

für einige Tage Ich habe Seraching warum meine Eisen-Form mit meinem Polymer-Element nicht richtig funktionieren. Wenn ich sehen möchte, wie mein Wert aus meinem Papier-Textbereich aussieht, kann ich das nicht, weil meine Datei meine ID nicht erkennt: feedbackForm. Hier ist mein Code:

<form is="iron-form" method="get" action="/" id="feedbackForm"> 
     <paper-textarea name="feedbacks" value="{{feedbackValue::input}}" 
         label="Explain your feedback - required" required></paper-textarea> 
     <paper-checkbox name="read" required>You must check this box</paper-checkbox> 
     <br> 
     <paper-button class="custom indigo popup" type="submit" raised onclick="submitForm(event)"></iron-icon> 
      Submit 
     </paper-button> 
     <div class="output"></div> 
    </form> 

Und hier ist mein Skript:

<script> 

    function submitForm(event) { 
     console.log('enfin'); 
     Polymer.dom(event).localTarget.parentElement.submit(); 
     console.log(Polymer.dom(event).localTarget.parentElement); 
    } 

    feedbackForm.addEventListener('iron-form-submit', function (event) { 
     this.querySelector('.output').innerHTML = JSON.stringify(event.detail); 
    }); 

    Polymer({ 
     is: 'at-feedback-panel', 

    }); 


</script> 

Kennt jemand was mit Eisen-Form vorgeht. Wenn ich das versuche, sagt mir mein Browser, dass feedbackForm unbekannt ist.

Answer 1

1. Versuchen "feedbackForm.addEventListener (..." zu

Ereignis-Listener Ändern "document.getElementById ('feedback') addEventListener (...":

document.getElementById('feedbackForm').addEventListener('iron-form-submit', function (event) { 
    this.querySelector('.output').innerHTML = JSON.stringify(event.detail); 
}); 

2. Der Event-Listerner sollte aufgerufen werden, wenn das HTML-DOM bereit ist.So verschieben Sie alle script Codes in $(document).ready(function(){...})

Sieht aus wie:

<script> 

$(document).ready(function({ 

    function submitForm(event) { 
    console.log('enfin'); 
    Polymer.dom(event).localTarget.parentElement.submit(); 
    console.log(Polymer.dom(event).localTarget.parentElement); 
    } 

    document.getElementById('feedbackForm').addEventListener('iron-form-submit', function (event) { 
    this.querySelector('.output').innerHTML = JSON.stringify(event.detail); 
    }); 

    Polymer({ 
    is: 'at-feedback-panel', 
    }); 

}));