creativetimofficial / ct-paper-kit-2-pro

Paper Kit 2 PRO is a premium Bootstrap 4 UI Kit with a huge number of components, sections and example pages.
https://www.creative-tim.com/product/paper-kit-2-pro
21 stars 6 forks source link

File Input Malformed #11

Closed alvin8t closed 6 years ago

alvin8t commented 6 years ago

In the documentation, it shows a image upload example, however, it doesn't show a file input example. I did realize that the docs had stated that I should visit the Bootstrap Jansy page for more information and examples, so I did go there to find out how to do a file input. I ten copied the example from the docs to my website (look below)

<div class="fileinput fileinput-new input-group" data-provides="fileinput">
    <div class="form-control" data-trigger="fileinput"><i class="glyphicon glyphicon-file fileinput-exists"></i> <span class="fileinput-filename"></span></div>
    <span class="input-group-addon btn btn-default btn-file"><span class="fileinput-new">Select file</span><span class="fileinput-exists">Change</span><input type="file" name="..."></span>
    <a href="#" class="input-group-addon btn btn-default fileinput-exists" data-dismiss="fileinput">Remove</a>
</div>

Once I copied it to my website (while using the New Product Page template provided). It turned out like this: idek

I have tried to mess with the classes and ids, but no luck. Help would be greatly appreciated. Thanks!

groovemen commented 6 years ago

Hello @alvin8t, thank you for using our products, the HTML code looks fine, it should work. Please make sure that you have the Jasny script in your page.

  <!--  for fileupload -->
    <script src="assets/js/jasny-bootstrap.min.js"></script>

All the best, Stefan

alvin8t commented 6 years ago

Hey @groovemen, I do have it included and it appears as successfully loaded in the dev console. (as seen https://i.imgur.com/S0q9YYj.png)

Is there any JavaScript that I need to execute to activate it?

Thanks

groovemen commented 6 years ago

Please replace your file with the one attached below, it looks like you don't have the full version of the plugin file.

jasny-bootstrap.min.js.zip

Best, Stefan

alvin8t commented 6 years ago

Thank you for somewhat fixing it in this update! 😃