|
|
@ -12,7 +12,7 @@ |
|
|
<label for="album_id">Álbum:</label> |
|
|
<label for="album_id">Álbum:</label> |
|
|
<select id="album_id" name="album_id" required> |
|
|
<select id="album_id" name="album_id" required> |
|
|
{% for album in albums %} |
|
|
{% for album in albums %} |
|
|
<option value="{{ album.id }}">{{ album.name }} by {{ album.artist }}</option> |
|
|
|
|
|
|
|
|
<option value="{{ album.id }}" data-artist="{{ album.artist }}">{{ album.name }} by {{ album.artist }}</option> |
|
|
{% endfor %} |
|
|
{% endfor %} |
|
|
</select> |
|
|
</select> |
|
|
|
|
|
|
|
|
@ -21,4 +21,18 @@ |
|
|
|
|
|
|
|
|
<button type="submit">Añadir canción</button> |
|
|
<button type="submit">Añadir canción</button> |
|
|
</form> |
|
|
</form> |
|
|
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
|
function updateAuthor() { |
|
|
|
|
|
var albumSelect = document.getElementById("album_id"); |
|
|
|
|
|
var selectedAlbum = albumSelect.options[albumSelect.selectedIndex]; |
|
|
|
|
|
var artist = selectedAlbum.getAttribute("data-artist"); |
|
|
|
|
|
document.getElementById("author").value = artist; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// Initialize the author field with the artist of the first album |
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
|
|
|
updateAuthor(); |
|
|
|
|
|
}); |
|
|
|
|
|
</script> |
|
|
{% endblock %} |
|
|
{% endblock %} |