title: When Select Option is selected and submitted, it shows all option in hidden all the hidden text area text
body: <p>I'm encountering two problems,</p>
  <ol>
  <li><p>I have made a request form for my clients but when I submit the form and I get the email(testing the form) I see all the hidden text area text in the HTML email. For example, if I select the GM option from the select and submit it, in the email I will see the GM option plus the AGM option.</p>
  </li>
  <li><p>When I select and submit another category request from the form, I will get the hidden textarea text option in email too</p>
  </li>
  </ol>
  <p>Is there a fix for these two problems in encountering?</p>
  <p>Here are the two codes from my send_mail.php</p>
  <pre><code>$usersGMGroup = nl2br($_POST[&quot;acc_GMGroup&quot;]);                                       
  $usersAGMGroup = nl2br($_POST[&quot;acc_AGMGroup&quot;]);
  </code></pre>
  <p>Im using <code>nl2br</code> for making the codes in hidden textarea go in the next line.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(function() {
    $("#groups").change(function() {
      //GM Group
      {
        if ($(this).val() == "GM") {
          $("#groups_GM").show();
          $("#acc_GMGroup").show();
        } else {
          $("#groups_GM").hide();
          $("#acc_GMGroup").hide();
        }
      }
      //AGM Group
      {
        if ($(this).val() == "AGM") {
          $("#groups_AGM").show();
          $("#acc_AGMGroup").show();
        } else {
          $("#groups_AGM").hide();
          $("#acc_AGMGroup").hide();
        }
      }
    });
  });
  $('#groups').trigger('change');</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>html,
  body {
    min-height: 100%;
  }
  
  body,
  div,
  form,
  input,
  label {
    padding: 0;
    margin: 0;
    outline: none;
    font-family: Roboto, Arial, sans-serif;
    font-size: 15px;
    color: #666;
    line-height: 19px;
  }
  
  legend {
    color: #fff;
    background-color: #095484;
    padding: 3px 5px;
    font-size: 20px;
  }
  
  h1 {
    position: absolute;
    margin: 0;
    font-size: 36px;
    color: #fff;
    z-index: 2;
  }
  
  .testbox {
    display: flex;
    justify-content: center;
    align-items: center;
    height: inherit;
    padding: 20px;
  }
  
  form {
    width: 75%;
    padding: 20px;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 0 50px 0 #095484;
  }
  
  .banner {
    position: relative;
    height: 300px;
    background-image: url("/New_Website/Walgreens Logo's/Walgreens New Logo/banner.png");
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
  }
  
  .banner::after {
    content: "";
    background-color: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
  }
  
  input {
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 3px;
    font-size: 17px;
    font-weight: bold;
  }
  
  input {
    width: calc(100% - 10px);
    padding: 5px;
  }
  
  select {
    width: 100%;
    padding: 3px 0;
    background: transparent;
    font-size: 17px;
    font-weight: bold;
  }
  
  .hiddenField {
    display: none;
  }
  
  table.tb {
    border-collapse: collapse;
    width: 650px;
  }
  
  .tb th,
  .tb td {
    padding: 6px;
    border: solid 1px #262626;
  }
  
  .tb th,
  .tb td {
    color: #262626;
  }
  
  .tb th {
    background-color: lightblue;
  }
  
  textarea {
    white-space: pre;
    text-align: left;
    width: 650px;
  }
  
  span {
    text-decoration: underline;
  }
  
  div.a {
    text-indent: 50px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div class="col-6"&gt;
    &lt;label for="userReqEmp"&gt;Requestor Name&lt;/label&gt;
    &lt;input type="text" class="form-control w-100" id="userReqEmp" name="userReqEmp" placeholder="Type Here..."&gt;
  &lt;/div&gt;
  &lt;div class="col-6"&gt;
    &lt;label for="userNameEmp"&gt;Full Name&lt;/label&gt;
    &lt;input type="text" class="form-control w-100" id="userNameEmp" name="userNameEmp" placeholder="Type Here..."&gt;
  &lt;/div&gt;
  &lt;div class="col-6"&gt;
    &lt;label for="userComEmp"&gt;Comments (Optional)&lt;/label&gt;
    &lt;textarea type="text" class="form-control w-100" id="userComEmp" name="userComEmp" rows="7" placeholder="Type Here..."&gt;&lt;/textarea&gt;
  &lt;/div&gt;
  &lt;div class="col-6"&gt;
    &lt;div class="row"&gt;
      &lt;label class="col-12" for="userEIDEmp"&gt;Employee ID&lt;/label&gt;
    &lt;/div&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-12"&gt;
        &lt;input type="text" class="form-control w-100" id="userEIDEmp" name="userEIDEmp" placeholder="Type Here..."&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="row"&gt;
      &lt;label class="col-12" for="userOIDEmp"&gt;One ID&lt;/label&gt;
    &lt;/div&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-12"&gt;
        &lt;input type="text" class="form-control w-100" id="userOIDEmp" name="userOIDEmp" placeholder="Type Here..."&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="row"&gt;
      &lt;label class="col-12" for="userDateEmp"&gt;Start Date&lt;/label&gt;
    &lt;/div&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-12"&gt;
        &lt;input type="date" class="form-control w-100" id="userDateEmp" name="userDateEmp" placeholder="Type Here..."&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-6"&gt;
    &lt;!-- style="visibility:hidden;" --&gt;
    &lt;!-- acc means account --&gt;
    &lt;!-- GM Group --&gt;
    &lt;textarea style="visibility:hidden;" class="textarea" id="acc_GMGroup" name="acc_GMGroup" rows="2"&gt;
              &lt;u&gt;Domain Group Access&lt;/u&gt;
              AP
              FunctionManagers
              Managers
  
              &lt;u&gt;Distribution List&lt;/u&gt;
              Woodland Mgmt
              WoodlandDCManager
              InboundManagers
  
              &lt;u&gt;Additional Access&lt;/u&gt;
              DCNet
              AS400 (JOB-CAT-01)
              VPN Non-Standard
          &lt;/textarea&gt;
  &lt;/div&gt;
  &lt;div class="col-6"&gt;
    &lt;!-- style="visibility:hidden;" --&gt;
    &lt;!-- acc means account --&gt;
    &lt;!-- AGM Group --&gt;
    &lt;textarea style="visibility:hidden;" class="textarea" id="acc_AGMGroup" name="acc_AGMGroup" rows="2"&gt;
              &lt;u&gt;Domain Group Access&lt;/u&gt;
              AP
              FunctionManagers
              Managers
  
              &lt;u&gt;Distribution List&lt;/u&gt;
              Woodland Mgmt
              WoodlandDCManager
              InboundManagers
  
              &lt;u&gt;Additional Access&lt;/u&gt;
              DCNet
              AS400 (JOB-CAT-01)
              VPN Non-Standard
          &lt;/textarea&gt;
  &lt;/div&gt;
  &lt;!-- Main Selection --&gt;
  &lt;div class="col-6"&gt;
    &lt;div class="row"&gt;
      &lt;label class="col-12"&gt;Select Department&lt;/label&gt;
    &lt;/div&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-12"&gt;
        &lt;select id="groups" name="groups" class="form-control w-100"&gt;
          &lt;option selected value=""&gt;Select an option&lt;/option&gt;
          &lt;option value="GM"&gt;GM&lt;/option&gt;
          &lt;option value="AGM"&gt;AGM&lt;/option&gt;
          &lt;option value="AP"&gt;AP&lt;/option&gt;
          &lt;option value="IO"&gt;IO&lt;/option&gt;
        &lt;/select&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;br&gt;
    &lt;!-- GM --&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-12" id="groups_GM" name="groups_GM" style="display: none;"&gt;
        &lt;h2&gt;DC GM Group&lt;/h2&gt;
        &lt;table class="tb"&gt;
          &lt;tr&gt;
            &lt;th&gt;Domain Group Access&lt;/th&gt;
            &lt;!-- Title --&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;AP&lt;br&gt;FunctionManagers&lt;br&gt;Managers&lt;/td&gt;
            &lt;!-- Content --&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;th&gt;Distribution List&lt;/th&gt;
            &lt;!-- Title --&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;Woodland Mgmt&lt;br&gt;WoodlandDCManager&lt;br&gt;InboundManagers&lt;/td&gt;
            &lt;!-- Content --&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;th&gt;Additional Access&lt;/th&gt;
            &lt;!-- Title --&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;DCNet&lt;br&gt;AS400 (JOB-CAT-01)&lt;br&gt;VPN Non-Standard&lt;/td&gt;
            &lt;!-- Content --&gt;
          &lt;/tr&gt;
        &lt;/table&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-12" id="groups_AGM" name="groups_AGM" style="display: none;"&gt;
        &lt;h2&gt;DC AGM Group&lt;/h2&gt;
        &lt;table class="tb"&gt;
          &lt;tr&gt;
            &lt;th&gt;Domain Group Access&lt;/th&gt;
            &lt;!-- Title --&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;AP&lt;br&gt;FunctionManagers&lt;br&gt;Managers&lt;/td&gt;
            &lt;!-- Content --&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;th&gt;Distribution List&lt;/th&gt;
            &lt;!-- Title --&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;Woodland Mgmt&lt;br&gt;WoodlandDCManager&lt;br&gt;InboundManagers&lt;/td&gt;
            &lt;!-- Content --&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;th&gt;Additional Access&lt;/th&gt;
            &lt;!-- Title --&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;DCNet&lt;br&gt;AS400 (JOB-CAT-01)&lt;br&gt;VPN Non-Standard&lt;/td&gt;
            &lt;!-- Content --&gt;
          &lt;/tr&gt;
        &lt;/table&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>