2017-02-15 51 views
0

幾天我一直在研究爲什麼我的聚合物元素的鐵形式拒絕正常工作。當我提交時,我想從我的paper-textarea中查看看起來像是什麼值的我不能,因爲我的文件無法識別我的ID:feedbackForm。這裏是我的代碼:聚合物1.0鐵形式拒絕顯示數據的詳細信息

<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> 

這裏是我的腳本:

<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> 

是否有人知道這是怎麼回事用鐵的形式。當我嘗試這個時,我的瀏覽器告訴我feedbackForm是未知的。

回答

1
  1. 嘗試改變「feedbackForm.addEventListener(...」 到

事件監聽器 「的document.getElementById( 'feedbackForm')的addEventListener(..」:

document.getElementById('feedbackForm').addEventListener('iron-form-submit', function (event) { 
    this.querySelector('.output').innerHTML = JSON.stringify(event.detail); 
}); 
  1. 當HTML DOM準備就緒時,應該調用事件定位器。因此,將所有script代碼移動到$(document).ready(function(){...})

的樣子:

<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', 
    }); 

})); 

+0

謝謝您的回答,我想,這是行不通的,它是一個其他的問題,我與我的高分子元素注意到,我想談談它在另一個話題。我所有的document.getElementById('myElementId')和document.querySelector('myClassElement')都是null。所以addEventListener返回一個錯誤。 – arousseau

+0

'document.getElementById('myElementId')...'返回錯誤,好像您的腳本代碼在HTML DOM尚未準備好時呈現。試試jQuery'$(document).ready()'。 –

+0

那麼,在此之前,我試圖使用JQuery,但似乎JQuery和聚合物有點混亂:http://www.baasic.com/2014/10/03/Using-jQuery-with-Web-components/但我會再次嘗試找到一種在聚合物元素中使用JQuery的方法.. – arousseau