removal of in line JS (#4876)

* removal of in line JS * changed element name
ideacrew · Dec 24, 2024 · d5a5c35 · d5a5c35
1 parent e9ee47a
commit d5a5c35
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 11 deletions.
diff --git a/app/assets/javascripts/keyboard_navigation.js b/app/assets/javascripts/keyboard_navigation.js
@@ -43,6 +43,13 @@ function handleContactInfoKeyDown(event, radioId, modifyDiv) {
   }
 }
 
+$(document).on('keydown', '.plan-contact-info-alt', function (event) {
+  if (event.key === 'Enter' || event.key === ' ') {
+    event.preventDefault();
+    document.getElementById($(this).data('contact-click-id')).click();
+  }
+});
+
 document.addEventListener('turbolinks:load', () => {
   // Use event propogation to handle `Enter` keydown events for HTML elements with the attribute `data-keydown-id`.
   // Using event propogation is mainly a workaround for FA Income pages, which load income forms by cloning dummy hidden forms.

diff --git a/app/views/insured/families/_enrollment_refactored.html.erb b/app/views/insured/families/_enrollment_refactored.html.erb
@@ -115,13 +115,13 @@
             <%= render partial: "shared/plan_shoppings/sbc_link", locals: { plan: product, custom_css: false, hbx_id: hbx_enrollment.hbx_id } %>
             <% unless details_page %>
               <a
-                class="ml-4"
+                class="ml-4 plan-contact-info-alt"
                 id="plan_contact_info-<%= hbx_enrollment.hbx_id%>"
                 data-toggle="modal"
                 data-target="#<%= product.kind.to_s %>-<%= product.id %>-<%= hbx_enrollment.hbx_id%>"
                 tabindex="0"
                 href="#"
-                onkeydown="handleContactInfoKeyDownAlt(event, 'plan_contact_info-<%= hbx_enrollment.hbx_id%>', '#<%= product.kind.to_s %>-<%= product.id %>-<%= hbx_enrollment.hbx_id%>')"
+                data-contact-click-id="plan_contact_info-<%= hbx_enrollment.hbx_id%>"
                 >
 
                 <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
@@ -141,15 +141,6 @@
         </div>
       </div>
     </div>
-
-    <script>
-      function handleContactInfoKeyDownAlt(event, id, modalId) {
-        if (event.key === 'Enter' || event.key === ' ') {
-          event.preventDefault();
-          document.getElementById(id).click();
-        }
-      }
-    </script>
   <% else %>
     <div class="hbx-enrollment-refactored-panel plan-tile panel panel-default module <%= "initially_hidden_enrollment hidden" if initially_hide_enrollment?(hbx_enrollment) %>">
       <div class="plan-header">