JavaScript jQuery Basics Working with jQuery Collections Changing Element Properties

Carlos Lantigua
Carlos Lantigua
5,937 Points

JQuery Attr method for download not working : (

Trying to turn the pdf file for JQuery Cheatsheet into a download and it does not seem to be working, it still just opens the pdf in a separate tab.

<div id="links">
        <ul>
            <li><a href='https://learn.jquery.com/'>Learn jQuery</a></li>
            <li><a href='http://treehouse-project-downloads.s3.amazonaws.com/jquery-basics/jquery_cheatsheet.pdf' download>jQuery Cheatsheet</a></li>
            <li><a href='https://api.jquery.com/'>jQuery Documentation</a></li>
            <li><a href='https://developer.mozilla.org/en-US/docs/Glossary/jQuery'>jQuery Glossary</a></li>
        </ul>
        <label><input type='checkbox'> Allow PDF downloads</label>
    </div>

```JQuery

const $odd = $('a:odd'); //selects all odd anchor elements
const $secureLinks = $('a[href^="https://"]');
const $pdfs = $('a[href$=".pdf"]');

$secureLinks.attr('target', '_blank');
$pdfs.attr('download', true);

6 Answers

Alan McClenaghan
Alan McClenaghan
Front End Web Development Techdegree Graduate 45,520 Points

This seems to be more of a browser setting issue: Follow these steps for Chrome on a Mac:

  1. Open Google Chrome.
  2. Click on the Menu icon (Google Chrome Menu icon) in the top-right corner of the Window.
  3. Click Settings.
  4. Scroll down to the bottom of the Settings window and click Advanced.
  5. In the Privacy and security section, click Content Settings.
  6. Scroll down and click the PDF documents option.

Check out https://www.computerhope.com/issues/ch001114.htm for preferences in other browsers.

Thanks Alan!

Charles Tillmon
Charles Tillmon
27,973 Points

Thanks Alan! I was scratching my head on this one

Ariful Hoque
Ariful Hoque
3,700 Points

thanks Alan for the help. This saved me some time.

Emilia Jacaszek
Emilia Jacaszek
3,003 Points

Thank you, download works now !

Brilliant!

Luis Ortiz Hinojosa
Luis Ortiz Hinojosa
4,482 Points

Hey Carlos, did you ever get it to work? I also wasn't able to download the file

Carlos Lantigua
Carlos Lantigua
5,937 Points

No I was not, had to move on. Sorry : (

shashi7
shashi7
11,027 Points

I can't download either...phew!!

James March
James March
7,921 Points

Changing preferences worked for me too, nothing wrong with the code thankfully

Jennifer Nordell
STAFF
Jennifer Nordell
Treehouse Staff

Hi there, Carlos! This is tricky to answer because I'm not sure if that final backtick in your code was part of your markdown or not. If it's actually part of your code, then it will cause an error. If it's part of your markdown and not in your code, then the problem is elsewhere. I took your code and pasted it into the workspace and other than that one backtick, it works for me.

So here are a few things to check:

  • Make sure you've saved your work. We all forget sometimes.
  • Try refreshing the page
  • Make sure you've checked "Allow PDF downloads"
  • If none of this is working, you might try deleting your browser cache because it could be loading in older data instead of your new code.

Hope this helps, but let me know if there are still issues! :sparkles:

Carlos Lantigua
Carlos Lantigua
5,937 Points

Thank you for the reply, the back tick is an attempt on my part to quote the code lol. The link is still directing me to view the pdf rather than download the file. At this point in the video it should allow the user to download on click without checking the box as that feature is supposed to be added in the next video. I have tried chrome and firefox, I'm probably misspelling something some where and just can't see it.

Alan McClenaghan
Alan McClenaghan
Front End Web Development Techdegree Graduate 45,520 Points

The "Allow PDF downloads" functionality is added in a later video.

Changing the browser preferences worked for me.

Chris Komaroff
PRO
Chris Komaroff
Pro Student 13,664 Points

All I am able to do for Chrome is drill down to settings | advanced | privacy and security | content settings | Download PDF files instead of automatically opening them in Chrome = Yes / turn on. But of course this is silly because all PDFs download automatically anyway such that I don't need to use the download attribute in the first place. I don't think the anchor tag download attribute is ready for prime time. It sounded like a weird attribute to me when Treasure used it as an example.