https://github.com/kartik-v/bootstrap-fileinput
Robie tak: na gorze strony:
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"> <link href="path/to/css/fileinput.min.css" media="all" rel="stylesheet" type="text/css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="path/to/js/plugins/canvas-to-blob.min.js" type="text/javascript"></script> <script src="path/to/js/fileinput.min.js"></script> <!-- bootstrap.js below is only needed if you wish to the feature of viewing details of text file preview via modal dialog --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" type="text/javascript"></script> <!-- optionally if you need translation for your language then include <script src="path/to/js/fileinput_locale_<lang>.js"></script>
I jakies przykladowe...
<form enctype="multipart/form-data"> <br> <button type="submit" class="btn btn-primary">Submit</button> <button type="reset" class="btn btn-default">Reset</button> </form> <hr> <form enctype="multipart/form-data"> <label>Test invalid input type</label> <script> $(document).on('ready', function(){$("#file-0b").fileinput();}); </script> </form> <hr> <form enctype="multipart/form-data"> <hr> <div class="form-group"> <input id="file-0b" class="file" type="file"> </div> <hr> <div class="form-group"> <input id="file-1" type="file" multiple class="file" data-overwrite-initial="false" data-min-file-count="2"> </div> <hr> <div class="form-group"> <input id="file-2" type="file" class="file" readonly data-show-upload="false"> </div> <hr> <div class="form-group"> <input id="file-3" type="file" multiple=true> </div> <hr>
Tylko css ani js tego nie lapie , dlaczego?
Scieżki sa na 100% poprawne