0

So I am new in here , currently working on a Django project. So I was facing an Issue. Let me give a detailed description of the problem: So I have a model called Music:

class Music(models.Model):
    musicid = models.AutoField(primary_key=True)
    title = models.CharField(max_length=200)
    # category = models.ForeignKey(Category, on_delete=models.CASCADE, related_name='category')
    audio = models.FileField(upload_to='music/')
    published_at = models.DateTimeField(default=datetime.now , blank=True)
    def __str__(self):
        return str(self.musicid)

View File is as follows

def index(request):
    songs = Music.objects.all()
    context = {
        'title':'Home',
        'songs':songs,
    }
    return render(request , 'index.html',context)

So now in my html i render all my music which i am storing in my local DB.

They can be easily fetched via the getting the url of audio file.Now I made a common Player for all my songs. Here comes the real ISSUE.

Suppose I have 10 songs , and I click any one of them , how do I send an AJAX request with the specific music id so that I can render the audio url for that specific song.

//PLAYER SECTION WITH ONE SONG PLAY AT A TIME WITHOUT REDIRECTING TO OTHER PAGE
<section class="current-track" style="height:61.2px !important">

<audio id="music" class="current-track" >


<source src="{{songs.audio.url}}" type="audio/mpeg">


</audio>

here songs is the queryset of the specific song id. I am using AJAX as it's clearly evident I dont want the page to redirect to somewhere else for better UI.I just want to change the source of this audio file on the basis of my click listener.How can i go about this directly or by fetching the music id to my views and then firing a AJAX req to fetch the new source file? PLEASE HELP.....TYSM in advance.^__^ ''' //SHOWING ALL SONG LIST {%for song in songs%}

                <div class="track__number">{{song.id}}</div>

                <div class="track__added">

                  <i class="ion-checkmark-round added"></i>

                </div>

                <div class="track__title">{{song.title}}</div>

                <div class="track__explicit">

                  <span class="label">Explicit</span>

                </div>

                <div class="track__plays">147,544,165</div>

              </div>

              <div class="track">

                <div class="track__art">

                  <img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/7022/tth.jpg" alt="These Things Happen" />

                </div>

{%endfor%} '''

user13539671
  • 3
  • 2
  • What you're looking for is a tutorial on how to integrate AJAX into Django. You can do a Google search for this or look at similar questions on this site: https://stackoverflow.com/questions/20306981/how-do-i-integrate-ajax-with-django-applications – voodoo-burger May 16 '20 at 15:19
  • Can you show us your code in the template? Where is your loop that is fetching the songs? Also in your template you need to use something like `song.pk` as an attribute in order to send it to the server with get request when the user clicks – csandreas1 May 16 '20 at 17:48
  • edited please acknowledge – user13539671 May 16 '20 at 20:17

0 Answers0