Answers

• allan Posts: 63,351Questions: 1Answers: 10,443 Site admin

  November 2016

  The DataTables CSS doesn't refer to the path for the icons at all:

      .sorting,
      .sorting_asc,
      .sorting_desc,
      .sorting_asc_disabled,
      .sorting_desc_disabled {
          cursor: pointer;
          position: relative;
  
          &:after {
              position: absolute;
              bottom: 8px;
              right: 8px;
              display: block;
              font-family: 'Glyphicons Halflings';
              opacity: 0.5;
          }
      }
  
      .sorting:after {
          opacity: 0.2;
          content: "\e150"; /* sort */
      }
  
      .sorting_asc:after {
          content: "\e155"; /* sort-by-attributes */
      }
  
      .sorting_desc:after {
          content: "\e156"; /* sort-by-attributes-alt */
      }
  

  If you can use the glyphicons else where on the page, they should automatically work in the DataTable.

  Can you give me a link to the page so I can take a look?

  Allan
• ztevie Posts: 101Questions: 23Answers: 5

  November 2016

  Yes, that was what I thought. I've also seen this part of the code.
  Sorry, the project being under development on localhost here without possibility to get access from the outside.

  One thing I thought of is this: Altough the bootstrap main library is included unaltered, there is a css file that shortens the icon names, so instead of setting class in HTML like this: class="glyphicon glyphicon-sort" it's written: class="gi gi-sort"

  So maybe there's a url in there and the fonts aren't in the right folder for the normal bootstrap library to find them. I will check that and post back...
• allan Posts: 63,351Questions: 1Answers: 10,443 Site admin

  November 2016

  Right right clicking on one of the header cells in the table and select "Inspect". Change the class name to match the shortened version and see if the icon appears.

  Allan
• ztevie Posts: 101Questions: 23Answers: 5

  November 2016

  Yep it did! class "hi hi-sort" made the double arrows appear...
• ztevie Posts: 101Questions: 23Answers: 5

  November 2016 edited November 2016

  On the other hand, if I use something like "glyphicon glyphicon-user" nothing shows. The same if I do it outside of datatables, just in some random HTML element, so clearly the call for glyphicons are changed totally.
  It's a big project so I won't try to go in and change anything. If you have some tip I'll try it, otherwise I'll just skip the bootstrap version and use the normal styled datatables.
  Are there other things I won't be able to do without bootstrap, thinking mostly like the example with tabs you've got on your site?

  Edit: The base of this project is built on a template dashboard, ProUI. They have examples of datatables in the template but they don't use the bootstrap styling. Here's a live demo if it helps. I'm a server side programmer so I'm not an expert on the client side stuff.
  http://preview.themeforest.net/item/proui-responsive-bootstrap-admin-template/full_screen_preview/6769035?_ga=1.120765515.217128931.1476989006

  I've been thinking of buying the editor version of datatables, but it might not be of much help since I've already coded the basic server side stuff, including classes for pdo sql and other major things.
  Would the editor be of big help for the client side work, especially editing rows by opening row data in bootstrap modals? Also dynamic tables where table headers and columns are dynamically created depending on what the database returns?
• allan Posts: 63,351Questions: 1Answers: 10,443 Site admin

  November 2016 Answer ✓

  So something is changing the names of the default Bootstrap classes? In that case, you'd need to modify the DataTables / Bootstrap integration to match the modified class names.

  It seems like a very odd thing for the template author to have done since it will break icons in anything that supports the Bootstrap standard class names.

  Would the editor be of big help for the client side work, especially editing rows by opening row data in bootstrap modals?

  Possibly! It might be worth downloading the demo and seeing what you think.

  Also dynamic tables where table headers and columns are dynamically created depending on what the database returns?

  That is not something that Editor does, but there is no reason it can't be done with Editor and DataTables using their APIs and options.

  Allan
• ztevie Posts: 101Questions: 23Answers: 5

  November 2016

  Yes, agree it's not optimal to change such a fundamental thing of bootstrap.
  I have contacted the author, let's see if they have some advice...
  Il try the editor demo when i get to that point in development.
  Thanks anyway, we'll consider this question answered...
• ztevie Posts: 101Questions: 23Answers: 5

  November 2016

  The author of the template had the solution. The fault not because the classes are changed. The problem was that the glyphicon premium version is included in the template, not the free one that is in bootstrap. So I had to change the datatables.css font-family to Glyphicons Regular, and the content icons to E404, E409 and E410.
  So all is good now!
• allan Posts: 63,351Questions: 1Answers: 10,443 Site admin

  November 2016

  Fantastic - thanks for letting me know about that. I'll take a look into if I can incorporate that into my stylesheet.

  Allan