PROBLEM:
The JQuery File Upload plugin works fine when I open its basic-plus.html
file in the browser, but it links to a few .css
and .js
files on the internet in the href
and src
attributes of its style
and script
tags.
After I downloaded those files from the internet and linked to their local versions in basic-plus.html
, I get
File Upload Failed
when I try to upload a file.
The question is why and how do I fix this?
EXPLANATION:
I am trying to use the JQuery-File-Upload plugin. I followed their setup guide and it worked. That is I downloaded the .zip repository from their Github and extracted it in my LAMPP's htdocs
folder. Then I opened basic-plus.html
in browser and it worked perfectly fine.
The thing is that the basic-plus.html
has the following statements:
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
...
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- The jQuery UI widget factory, can be omitted if jQuery UI is already included -->
<script src="js/vendor/jquery.ui.widget.js"></script>
<!-- The Load Image plugin is included for the preview images and image resizing functionality -->
<script src="//blueimp.github.io/JavaScript-Load-Image/js/load-image.all.min.js"></script>
<!-- The Canvas to Blob plugin is included for image resizing functionality -->
<script src="//blueimp.github.io/JavaScript-Canvas-to-Blob/js/canvas-to-blob.min.js"></script>
<!-- Bootstrap JS is not required, but included for the responsive demo navigation -->
<script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
That is, this .html
page is including .css
and .js
files from the internet.
My requirement is to make a webpage (which contains a PHP file uploader) which works offline.
So I opened in the browser the links given in the values of href
and src
attributes of the <link>
and <script>
elements above, and I downloaded those .css
and .js
files into my project folder, and changed the paths in the values of href
and src
attributes to local paths where I placed the files:
<!-- Bootstrap styles -->
<link rel="stylesheet" href="css/bootstrap.min.css">
...
<script src="js/jquery.min.js"></script>
<!-- The jQuery UI widget factory, can be omitted if jQuery UI is already included -->
<script src="js/vendor/jquery.ui.widget.js"></script>
<!-- The Load Image plugin is included for the preview images and image resizing functionality -->
<script src="js/load-image.all.min.js"></script>
<!-- The Canvas to Blob plugin is included for image resizing functionality -->
<script src="js/canvas-to-blob.min.js"></script>
<!-- Bootstrap JS is not required, but included for the responsive demo navigation -->
<script src="js/bootstrap.min.js"></script>
Now when I open basic-plus.html
in the browser, I get File Upload Failed
when I try to upload a file.
Why is this happening? How can I fix it?