1

I am using this piece of code in a function but its really buggy, the modal opens but the download doesn't.

I need the modal to open and the download happen in the background.

echo "<a id='download-item' class='button left' onclick='count();' href='".$mp3->guid."' data-toggle="modal" data-target="#myModal">Download</a>";
Brad Fletcher
  • 3,547
  • 3
  • 27
  • 42
  • What does `$mp3->guid` return? And what is the filename? What do you mean by buggy? Any error's thrown? – choz Mar 15 '16 at 15:46

3 Answers3

0

First, you need to set the " and ' correctly:

echo "<a id='download-item' class='button left' onclick='count();' href='".$mp3->guid."' data-toggle='modal' data-target='#myModal'>Download</a>";

And then make the function count() call the desired file to download:

Download File Using jQuery

Community
  • 1
  • 1
JP. Aulet
  • 4,375
  • 4
  • 26
  • 39
0

You should put the download attribute at the tag 

echo "<a id='download-item' download='filename.mp3' class='button left' onclick='count();' href='".$mp3->guid."' data-toggle="modal" data-target="#myModal">Download</a>";

this might works fine

Marvin Medeiros
  • 202
  • 4
  • 22
0

I didn't have a closer look at the bootstrap implementation, but I think the data-toggle handler uses event.preventDefault() which prevents the file from being downloaded (assuming that you start the download in your click() function.

I tested the following code locally and the modal opened the same time as the download started:

echo "<a id='download-item' class='button left' onclick='jQuery(\"#myModal\").modal();' href='".$mp3->guid."' download>Download</a>";
Jan Wendland
  • 1,350
  • 9
  • 17