Элемент HTML <select>отправляет выбранные по умолчанию, даже если они не выбраны - PullRequest
0 голосов
/ 14 апреля 2020

У меня есть раскрывающийся список, сгенерированный с помощью E JS, который устанавливает значение selected по умолчанию для любого администратора, который в данный момент используется для этой компании.

Пользователи должны иметь возможность отменить выбор текущего администратора и выбрать другой, удаляя текущего администратора в качестве администратора для компании.

Однако выбор другого параметра и / или нажатие клавиши CTRL + щелчок по параметру по умолчанию не отменяет его выбор, а форма отправляет как параметр по умолчанию, так и любые другие параметры. еще может быть выбран.

Я что-то пропустил в том, как работает атрибут selected для option?

<div id="adminDropdown">
  <% if (companyAdmins) { %>
    <select name="chooseAdmins" id="chooseAdmins" form="updateCompany" multiple class="form-control">
      <% for (let location of currentCompany.locations ) { %>
        <% for (let contact of location.contacts) { %> 
          <option value="<%= contact.id %>" <%= contact.isCompanyAdmin ? 'selected' : '' %>><%= contact.firstName %> <%= contact.lastName %></option>
        <% } %>
      <% } %>
    </select>
    <span class="muted"><small>Hold `CTRL` to select multiple admins, or to deselect an admin.<br />
      To add users to this list, first add them to their Location's "Contacts".
    </small></span>
  <% } else { %>
    <div class="alert alert-warning">Error loading admins data</div>
  <% } %>
</div>

Кроме того, при проверке элемента в chrome, Атрибут «selected» правильно отображается при загрузке, но не удаляется go после нажатия или ctrl + щелчок по опции, как и должно быть.

Ответы [ 2 ]

1 голос
/ 14 апреля 2020

Проблема, которую я вижу, состоит в том, что вы не закрываете первую для l oop внутри select

<% for (let location of currentCompany.locations ) { %>
    <% for (let contact of location.contacts) { %> 
        <option value="<%= contact.id %>" <%= contact.isCompanyAdmin ? 'selected' : '' %>><%= `${contact.firstName} ${contact.lastName}` %></option>
    <% } %>
<% } %>

Кстати, по моему мнению, используя строковые литералы внутри e js, вы уменьшаете только читаемость кода.
Вы можете сделать это просто <%= contact.firstName %> <%= contact.lastName %>

0 голосов
/ 14 апреля 2020

Я понял:

Проблема возникает из-за дублирования кода, показанного для раскрывающегося списка chooseAdmins, для другого аналогичного раскрывающегося списка чуть ниже него, где пользователь может выбрать новое местоположение по умолчанию, где я не сделал обновите атрибуты name или id, чтобы они соответствовали содержимому нового раскрывающегося списка. Так что на самом деле ошибки не было, body-parser видел два select элемента с одинаковым именем, поэтому он просто объединял выбранные значения для обоих в один массив.

Чем больше я учусь, тем больше Я понимаю, как мало я понимаю.

...