Почему на этой странице не отображается пользовательский интерфейс аудиоплеера?

Question

Я пишу веб-приложение, которое должно отображать следующие вещи на определенной странице:

1. AudioJS плеер
2. Панель обратной связи (оценка и комментарий)

Я хочу, чтобы плеер появился перед панелью обратной связи.

Если я добавлю следующий код на эту страницу, появится аудиоплеер.

Код:

<h2><%= I18n.t(:home_title) %></h2>
<script src="/audiojs/audio.min.js"></script>
<script>
  audiojs.events.ready(function() {
    var as = audiojs.createAll();
  });
</script>
<h3><%= I18n.t(:playback_feedback_title) %></h3>
<%= I18n.t(:playback_feedback_body) %>
<form action="/<%= I18n.locale %>/save_feedback" method="post">
    <%= I18n.t(:playback_rating) %>
    <select name="grade">
      <option value="0"><%= I18n.t(:playback_rating_0) %></option>
      <option value="1"><%= I18n.t(:playback_rating_1) %></option>
      <option value="2"><%= I18n.t(:playback_rating_2) %></option>
      <option value="3"><%= I18n.t(:playback_rating_3) %></option>
      <option value="4"><%= I18n.t(:playback_rating_4) %></option>
      <option value="5"><%= I18n.t(:playback_rating_5) %></option>
    </select>
    <br/>
    <%= I18n.t(:playback_comment) %>
    <br/>
    <textarea name="comment" rows="5" cols="50">
    </textarea>
    <br/>
    <input type="hidden" name="person_id" value="<%= @person_id.to_s %>">
    <input type="hidden" name="song_id" value="<%= @songId %>"> 
    <br/>
    <input type="submit" value="<%= I18n.t(:playback_submit) %>">
</form>
<audio src="<%= @songPath %>" preload="auto" />´

Результат:

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

Код:

<h2><%= I18n.t(:home_title) %></h2>
<script src="/audiojs/audio.min.js"></script>
<script>
  audiojs.events.ready(function() {
    var as = audiojs.createAll();
  });
</script>
<audio src="<%= @songPath %>" preload="auto" />
<h3><%= I18n.t(:playback_feedback_title) %></h3>
<%= I18n.t(:playback_feedback_body) %>
<form action="/<%= I18n.locale %>/save_feedback" method="post">
    <%= I18n.t(:playback_rating) %>
    <select name="grade">
      <option value="0"><%= I18n.t(:playback_rating_0) %></option>
      <option value="1"><%= I18n.t(:playback_rating_1) %></option>
      <option value="2"><%= I18n.t(:playback_rating_2) %></option>
      <option value="3"><%= I18n.t(:playback_rating_3) %></option>
      <option value="4"><%= I18n.t(:playback_rating_4) %></option>
      <option value="5"><%= I18n.t(:playback_rating_5) %></option>
    </select>
    <br/>
    <%= I18n.t(:playback_comment) %>
    <br/>
    <textarea name="comment" rows="5" cols="50">
    </textarea>
    <br/>
    <input type="hidden" name="person_id" value="<%= @person_id.to_s %>">
    <input type="hidden" name="song_id" value="<%= @songId %>"> 
    <br/>
    <input type="submit" value="<%= I18n.t(:playback_submit) %>">
</form>

Результат:

Как я могу это исправить (сделать так, чтобы аудиоплеер появился перед формой обратной связи)?

Answer 1

Проблема мб <audio> требует закрытия тега.