passing dynamic variable from parent template to child template in django

Question

I have a template songs.html that includes a child template addToPlaylist.html. I need the title of the song that is to be added to the playlist dynamically. Here is the code for songs.html which includes addToPlaylist.html.

                {% for song in songs  %}
                <div class="col-16 col-sm-4 col-md-3 col-lg-2 single-album-item">
                    <div class="single-album">
                        <img src="{{MEDIA_URL}}{{song.image.url}}" alt="">
                        <div class="album-info">
                            <a href="{% url 'playSong' 'song' song.tittle %} ">
                                <h5>{{song.tittle}}</h5>
                            </a>
                            <p>{{song.album}}</p>
                            {% include "songs/addToPlaylist.html" with song_to_add=song.tittle %}
                            <a data-toggle="modal" href="#addToPlaylist" style="color: dimgrey; font-size: small;">Add to Playlist</a>
                        </div>
                    </div>
                </div>
                {% endfor %}

And this is the code for addToPlaylist.html

              <div class="form-group" style="width: 100%;">
                  <ul class="list-group list-group-flush" style="width: 100%;">
                    {% for playlist in playlists %}
                    <li class="list-group-item"><a href="{% url 'addToPlaylist' playlist.name song_to_add %}">{{playlist.name}}</a></li>
                    {% endfor %}
                </ul>
                  </div>

But assigning dynamic value to song_to_add does not work. The variable does not pass down to the child template.

This is the views.py code that passes the value of playlists

    if request.user.is_authenticated:
        playlists = Playlist.objects.filter()
    songs = Song.objects.all()
    return render(request, "songs\\songs.html", {'songs': songs, 'playlists':playlists,})

This is my Song model

class Song(models.Model):
    GENRES = [
        ('Rock','Rock'),
        ('Hip Hop','Hip Hop'), 
        ('Blues', 'blues'), 
        ('Heavy Metal', 'Heavy Metal'), 
        ('Classical', 'Classical'), 
        ('Funk', 'Funk')]
    tittle = models.CharField(max_length=255)
    album = models.CharField(max_length=255, null = True, blank = True)
    genre = models.CharField(max_length = 30, choices=GENRES)
    image = models.ImageField(upload_to='images/', blank = True , null = True)
    songFile = models.FileField(upload_to='musics/', help_text=("Allowed type - .mp3, .wav, .ogg"))
    uploaded_at = models.DateTimeField(auto_now_add=True)

Also, I tried this solution.

Answer 1

I solved my problem by putting child template modal form in the parent template file and assigning unique id to modal form. In this way I was able to call addToPlaylist for each song uniquely.