HTML arrows on Datatables not displayed

Nico90

Hi I upload on my server a Datatable, I did a folder with all files php, dataTables.bootstrap.min.js and so on. It works but I can't see the arrows for sorts the columns. Could you please provide me the link to display them? Thanks a lot.

https://ibb.co/d9TgJ6

kthorngren

Looks like you maybe using Bootstrap also?

If so then you probably have not loaded the correct CSS files. The best option is to use the Download Builder to obtain the correct files. Otherwise please post your CSS and JS include lines.

Kevin

Nico90

Hi,

Thank you very much for your answer. As I am not experienced with it could you please tell me step by step what I have to select on the download page for downloading all files of the data table? I would really appreciate it.

This my Table: http://www.webslesson.info/2016/10/datatables-jquery-plugin-with-php-mysql-and-bootstrap.html

Here the files I need:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>  
           <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
           <script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>  
           <script src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>            
           <link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css

Thanks,

Nico

kthorngren

I copied your file list into this test case:
http://live.datatables.net/careyeqi/1/edit

Might be a copy paste error but the last line in your list is missing " /> at the end of the line. I added " /> and the test case works - the sorting arrows show.

If its not working in your environment then there may be a conflict causing the problem. Are you able to post a link to a page showing the issue?

Kevin

Nico90

Hi,

thanks for your answer. Your code is working on my server too.

My question is different. I want to index these files belove on my server:
jquery.min.js
bootstrap.min.css
jquery.dataTables.min.js
dataTables.bootstrap.min.js
dataTables.bootstrap.min.css

For eample:

<script src="http://mywebsite.com/jquery.min.js"></script> 
          <link rel="stylesheet" href="http://mywebsite.com/bootstrap.min.css" /> 
          <script src="http://myebsite.com/jquery.dataTables.min.js"></script> 
          <script src="http://mywebsite.com/dataTables.bootstrap.min.js"></script>           
          <link rel="stylesheet" href="http://mywebsite/dataTables.bootstrap.min.css"/>

I tried to copy paste on my server´s files the source code I found connecting to the links files but I got a css error I posted here on my first question.The up and down arrows are not displayed. I mean these arrows: https://ibb.co/d9TgJ6

allan

Those icons are coming from a font file in Bootstrap. You'd need to download the web font that Bootstrap uses as well as the CSS. If you look at the console in your browser or your server's error logs it should be stating that a file can't be loaded - that will be a web font. I'd suggest just downloading Bootstrap rather than copying and pasting only the CSS / JS since you aren't pulling in any of the other resources.

Allan

Nico90

Hi Allan, do you mean inside the File https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css?

Could you please tell me how I can add them?

Thanks,

Nico

allan

Yes. If you are getting the file from the Bootstrap CDN then it should work okay.

I'd need a link to a page showing the issue to be able to offer any help to resolve this.

Thanks,
Allan