Answers

• rf1234 Posts: 3,000Questions: 87Answers: 421

  May 2020 edited May 2020

  https://datatables.net/manual/data/#Javascript

  https://datatables.net/examples/data_sources/js_array.html

  Should work with Editor as well.

  More on Javascript and the standalone Editor:
  https://editor.datatables.net/manual/standalone#Setting-values
• dbrody2004 Posts: 7Questions: 3Answers: 0

  May 2020 edited May 2020

  Tried with the following code but there is no data in the table and there are no buttons either.

      <table id="scheduleTable_550" class="scheduleTable table datatable-basic3 table-striped">
              <thead>
              <tr>
                  <th></th>
                  <th></th>
                  <th></th>
                  <th></th>
                  <th></th>
                  <th></th>
                  <th></th>
              </tr>
              </thead>
              <tbody></tbody>
      </table>
  
  <script type="text/javascript">
  var dataSet = [
  [ "2","a49139eb78c923cf","1","Calendar","09:00:00","10:00:00","MT"],[ "3","a49139eb78c923cf","1","Calendar","11:00:00","12:00:00","RF"],];
  </script>
  
  $(document).ready(function () {
  $('.scheduleTable').each(function () {
      var $table = $(this);
      var editor = new $.fn.dataTable.Editor( {
          table: '#'+ $table.attr("id"),
          data: dataSet,
          fields: [ {
                  label: "App:",
                  name: "app"
              }, {
                  label: "Block start time:",
                  name: "blockstarttime"
              }, {
                  label: "Block end time:",
                  name: "blockendtime"
              }
          ]
      } );
  
  $('#'+ $table.attr("id")).DataTable({
      dom: 'Bfrtip',
      responsive: false,
          autoWidth: true,
          paging: false,
      searching: false,
      bInfo:false,
      bSort:false,
      buttons: [
              { extend: 'create', editor: editor },
              { extend: 'edit',   editor: editor },
              { extend: 'remove', editor: editor }
          ],
      select: true,
      columns: [
              { visible:false },
              { visible:false },
              { visible:false },
              { visible:false, title: "App",
              data:"app",
          render: function (data, type, full, meta) {
              return data;
          },
           },
              { title: "Block start time",
                  data:"blockstarttime",
          render: function (data, type, full, meta) {
                          return data;
                  },
           },
              { title: "Block end time",
                  data:"blockendime",
                  render: function (data, type, full, meta) {
                          return data;
           },
           },
              { title: "Mon" }
      ]
      });
  });
  });
  </script>
  

  Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.
• rf1234 Posts: 3,000Questions: 87Answers: 421

  May 2020

  you need to use markdown because your code is illegible this way. Please post a test case as well as per the forum rules.
• allan Posts: 63,531Questions: 1Answers: 10,474 Site admin

  May 2020

  There is no data property for Editor - I think you meant to put that into DataTables which does have a data option.

  When you do that it sort of semi-works: http://live.datatables.net/xekakode/1/edit .

  The problem now is that you have your data source as arrays, but you are telling DataTables and Editor to expect an object by using columns.data and fields.name as strings. See the manual for more information about the difference between the two (generally I suggest using objects).

  Allan
• dbrody2004 Posts: 7Questions: 3Answers: 0

  May 2020

  Thanks. That helped and now it is working: http://live.datatables.net/dacedili/1/edit

  After editing values in the table is the only way to get the dataset is to use the API and iterate through the rows? The editor does not modify the original javascript data object. The idea here is that the form would have a Save button which went clicked would push a json data array back to the server consisting of the whole modified table.
• colin Posts: 15,240Questions: 1Answers: 2,599

  May 2020

  To get the data for all the table, you could just do rows().data().toArray() - possibly with a JSON.stringify(),

  Colin