From 9589c63a07fd4c681d31d1d0de5f2e99f5201e90 Mon Sep 17 00:00:00 2001
From: Britney Wang <britney.wang@canonical.com>
Date: Tue, 3 Sep 2024 14:50:33 +0800
Subject: [PATCH] Include comments to payload message

---
 static/js/src/dynamic-forms.js                |  3 +++
 templates/shared/forms/interactive/kafka.html | 21 ++++++++-----------
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/static/js/src/dynamic-forms.js b/static/js/src/dynamic-forms.js
index 443bc289f9b..b0689d392cf 100644
--- a/static/js/src/dynamic-forms.js
+++ b/static/js/src/dynamic-forms.js
@@ -313,6 +313,9 @@ import { prepareInputFields } from "./prepare-form-inputs.js";
         const contactModal = document.getElementById("contact-modal");
         var message = "";
         var commentsFromLead = document.querySelector("#Comments_from_lead__c");
+        if (commentsFromLead.value != "") {
+          message += commentsFromLead.value;
+        }
         if (contactModal) {
           var formFields = contactModal.querySelectorAll(".js-formfield");
 
diff --git a/templates/shared/forms/interactive/kafka.html b/templates/shared/forms/interactive/kafka.html
index b27a5dfd120..ff7caf22368 100644
--- a/templates/shared/forms/interactive/kafka.html
+++ b/templates/shared/forms/interactive/kafka.html
@@ -24,11 +24,11 @@ <h3 class="p-heading--5">How should we get in touch?</h3>
               </li>
               <li class="p-list__item">
                 <label for="company">Company name:</label>
-                <input required id="company" name="company" maxlength="255" type="text">
+                <input required id="company" name="company" maxlength="255" type="text" />
               </li>
               <li class="p-list__item">
                 <label for="title">Job title:</label>
-                <input required id="title" name="title" maxlength="255" type="text">
+                <input required id="title" name="title" maxlength="255" type="text" />
               </li>
               <li class="p-list__item">
                 <label for="email">Work email:</label>
@@ -40,7 +40,7 @@ <h3 class="p-heading--5">How should we get in touch?</h3>
               </li>
               <li class="p-list__item">
                 <label class="p-checkbox">
-                  <input class="p-checkbox__input" value="yes" aria-labelledby="canonicalUpdatesOptIn" name="canonicalUpdatesOptIn" type="checkbox">
+                  <input class="p-checkbox__input" value="yes" aria-labelledby="canonicalUpdatesOptIn" name="canonicalUpdatesOptIn" type="checkbox" />
                   <span class="p-checkbox__label" id="canonicalUpdatesOptIn">I agree to receive information about Canonical's products and services.</span>
                 </label>
               </li>
@@ -88,15 +88,12 @@ <h3 class="p-heading--2">Thank you for enquiring about Kafka</h3>
             <p class="p-heading--4">A member of our team will be in touch within one working day.</p>
           </div>
           <div class="col-5 u-vertically-center u-hide--medium u-hide--small u-align--center">
-            {{
-              image(
-              url="https://assets.ubuntu.com/v1/cbae9a60-thank_you_orange_cmyk.svg",
-              alt="smile",
-              width="200",
-              height="200",
-              hi_def=True,
-              loading="auto",
-              ) | safe
+            {{ image(url="https://assets.ubuntu.com/v1/cbae9a60-thank_you_orange_cmyk.svg",
+                      alt="smile",
+                      width="200",
+                      height="200",
+                      hi_def=True,
+                      loading="auto") | safe
             }}
           </div>
         </div>