haml
1%form#channel-form 2 .input-field.col.s6 3 %input#channel-input{:placeholder => "Enter Channel Name", :type => "text"} 4 %input.btn.grey.lighten-2#submits__btn{:type => "submit", :value => "Get Channel Data"}
js
1var channelForm = document.getElementById('channel-form'); 2 3channelForm.addEventListener('submit', function(e){ 4 e.preventDefault(); 5 6 var channel = channelInput.value; 7 8 getChannel(channel); 9});
formタグの#channel-formを取得してaddEventListenerを機能させたいのですが、
Uncaught TypeError: Cannot read property 'addEventListener' of nullというエラーがコンソールで表示されます。
対策:
:type => "submit"のinputタグのidを取得してきて
js
1var submitButton = document.getElementById('submits__btn'); 2 3submitButton.addEventListener('submit', function(e){ 4 e.preventDefault(); 5 6 var channel = channelInput.value; 7 8 getChannel(channel); 9});
このように変更したが同じエラー文が表示されます。
どなたかお力添えよろしくお願い致します。
追記:
haml
1%form#channel-form 2 .input-field.col.s6 3 %input#channel-input{:placeholder => "Enter Channel Name", :type => "text"} 4 %input.btn.grey.lighten-2#submits__btn{:type => "submit", :value => "Get Channel Data"} 5 6%script{:src => "/assets/main.js"}
scriptタグの位置を追記しました。
haml内に直接javascriptを書いたりしたのですがうまくいきません。
haml
1!! 2%html 3 %head 4 %meta{:content => "text/html; charset=UTF-8", "http-equiv" => "Content-Type"}/ 5 %title Tube 6 = csrf_meta_tags 7 = stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' 8 = javascript_include_tag 'application', 'data-turbolinks-track': 'reload' 9
application.html.haml内のheadタグはこのようになっています。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/01/30 11:30
2020/01/30 11:40
2020/01/30 12:39
2020/01/30 12:41
2020/01/30 13:27
2020/01/31 07:42
2020/01/31 07:45
2020/01/31 08:01