Editor Form not Showing - debug shows many thing not installed

gforster

http://debug.datatables.net/enecuy

A few things going on here seem off. I think this is a case where I can't see the forest for the trees.

• When clicking Edit/New/Delete, the form doesn't show up.
• I notice that nothing except DataTables is recognized as installed when viewing the debug tool (but it is on the server)
• It is showing an old version of DataTables, but I'm calling the newest one from cdn
• I'm using a bootstrap theme - http://wrapbootstrap.com/preview/WB0N1X0T1

Here is the relevant script section. I've tried removing & reordering things to no avail (yet):

`

 <!-- Main styles for this application -->
 <link href="css/style.css" rel="stylesheet">
 <script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
 </script>
 <script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js">
 </script>
 <script type="text/javascript" language="javascript" src="https://cdn.datatables.net/buttons/1.2.3/js/dataTables.buttons.min.js">
 </script>
 <script type="text/javascript" language="javascript" src="https://cdn.datatables.net/select/1.2.1/js/dataTables.select.min.js">
 </script>
 <script type="text/javascript" language="javascript" src="editor/js/dataTables.editor.min.js">
 </script>
 <script type="text/javascript" src="DataTables/datatables.min.js"></script>
 <script>
     var requireJS = [
             "js/libs/jquery.dataTables.min.js",
             "js/libs/dataTables.bootstrap4.min.js"
         ];

         loadJS(requireJS, "js/views/main.js");
 </script>
 <script type="text/javascript" language="javascript" class="init">


  var editor; // use a global for the submit and return data rendering in the examples

  $(document).ready(function() {
     editor = new $.fn.dataTable.Editor( {
         ajax: "test_table.php",
         table: "#example",
         fields: [ {
                 label: "Hostname",
                 name: "hostname"
             }, {
                 label: "dev_level",
                 name: "dev_level"
             }, {
                 label: "description",
                 name: "description"
             }, {
                 label: "OS:",
                 name: "os"
             }
         ]
     } );
     $('#example').DataTable( {
         dom: "Bfrtip",
         ajax: "test_table.php",
         columns: [
             { data: "hostname" },
             { data: "dev_level" },
             { data: "description" },
             { data: "os"}
         ],  
         select: true,
         buttons: [
             { extend: "create", editor: editor },
             { extend: "edit",   editor: editor },
             { extend: "remove", editor: editor }
         ]
      } );
 } );
 </script>

`

tangerine

It is showing an old version of DataTables, but I'm calling the newest one from cdn

But you're overriding it with a locally stored version:

<script type="text/javascript" src="DataTables/datatables.min.js"></script>

gforster

The local one is also version 1.10.13, just downloaded today using the builder....however you did help me realize that the requireJS section was pointing to an old version, so that has been fixed.
New debug info - http://debug.datatables.net/ubiren

Not sure if I need that requireJS section or not.

The main issue of the Form not displaying (thus being unable to use editor) is still a problem.

kthorngren

I think you need to setup your buttons differently. Have a look at the Bootstrap4 example:
https://editor.datatables.net/examples/styling/bootstrap4.html

Kevin

gforster

I got this working. I only needed the one datatables.min.js and the var editor section. Everything else was conflicting/redundant.

Thanks all for the help

allan

Thanks for posting back. Good to hear you've got it working!

Allan