Answers

• allan Posts: 63,281Questions: 1Answers: 10,425 Site admin

  August 2015

  Hi,

  Thanks for the code. Is it a specific column that gives that that error or all of them?

  Allan
• jtoler5 Posts: 93Questions: 34Answers: 3

  August 2015

  Just that one. I have in line bubble editing enabled, which works. Also the New button works. Delete and Edit will not. I have it set to not pass the TD to online edit upon click. If I console log (this) in the inline edit function it never outputs "<TD> for the first column but does the rest. Which makes sense. But I still get that error.
• jtoler5 Posts: 93Questions: 34Answers: 3

  August 2015 edited August 2015

  Here is the inline edit code

   $(tableID).on('click', 'tbody td:not(:first-child, .details-control, .delete, .child-document, .row-action, .paid-checkbox, .exempt-checkbox)', function (e) {
          var tr = this.parentNode;
          editor.bubble(this);
  
          // Work around to submit whole row. Editor 1.5 by default only submits the changed value now.
          editor.one( 'preSubmit', function ( e, data ) {
              data.rowData = table.row( tr ).data();
          });
  
          // Submit on change of date
          if ($(this).find('.DTE_Field_Type_date').length) {
              $(this).on('change', function () {
                  editor.submit();
              });
          }
      });
  

  I actually ended up doing this to get it to work, but this doesn't make the delete work unless I do the same thing, which is adding more code. But I know I shouldn't have to, so any help would be appreciated. Thanks.

  new $.fn.dataTable.Buttons( table, [
          { extend: "create", editor: editor },
          { extend: "selectedSingle",
              text: "Edit",
              action: function (e, dt, node, config) {
                  editor.edit(table.row({selected: true}).index());
              }
          },
          { extend: "remove", editor: editor }
      ] );
  
      table.buttons().container()
          .appendTo( $('.col-sm-6:eq(0)', table.table().container() ) );
  
• allan Posts: 63,281Questions: 1Answers: 10,425 Site admin

  August 2015

  You'll need to forgive me, but which one? You say "just that one" but there are lots of fields defined in the code link you gave above. Which one is the one that is causing the issue?

  Regarding the delete - what error occurs and from what code? If you would be able to link to the page so I can debug it live, that would be useful.

  Allan
• jtoler5 Posts: 93Questions: 34Answers: 3

  August 2015

  The first column gives that error. It is a select checkbox created to select the row.

  columns: [
              {
                  orderable: false,
                  data: null,
                  className: "select-checkbox",
                  defaultContent: '',
              }
  

  The delete gives the same error of unable to automatically determine field.... The only way I was able to get Edit to work was by
  changing (per the examples) from:

  new $.fn.dataTable.Buttons( table, [
          { extend: "create", editor: editor },
          { extend: "edit", editor: editor},
          { extend: "remove", editor: editor }
      ] );
  

  to:

  new $.fn.dataTable.Buttons( table, [
          { extend: "create", editor: editor },
          { extend: "selectedSingle",
              text: "Edit",
              action: function (e, dt, node, config) {
                  editor.edit(table.row({selected: true}).index());
              }
          },
          { extend: "remove", editor: editor }
      ] );
  

  So to make delete work I would have to do the same thing. But per the examples, I
  should not have to do this to make edit/delete work.

  Here is the select code used (should also be in link at top), to define that the selector is the first td.

  select: {
                  style:    'multi',
                  selector: 'td:first-child',
                  info: false
          }
  
• allan Posts: 63,281Questions: 1Answers: 10,425 Site admin

  August 2015

  I see - thanks for the clarification. It sounds like the click event listener that is being used to trigger the inline editing is active even on the columns where it doesn't have any relevance.

  The click handler for the bubble trigger has a fairly complex selector in the above statement - perhaps an easier option for it, and the inline editing, would be to use the columns.className option to specify a class name for the columns you want to be editable with a particular form, then you can simply do something like:

  $('#myTable').on( 'click', 'td.editable-inline', function () {
    editor.inline( this );
  } );
  

  Allan
• jtoler5 Posts: 93Questions: 34Answers: 3

  August 2015

  Yes. I took that recommendation, but still get that error.
• jtoler5 Posts: 93Questions: 34Answers: 3

  August 2015 Answer ✓

  So I actually discovered the error. It had something to do with the way I was including all the JS files. I used to download builder tool and and minified them all into one and it made it work.
• allan Posts: 63,281Questions: 1Answers: 10,425 Site admin

  August 2015

  Great - good to hear you got it working :-)

  Allan
• jtoler5 Posts: 93Questions: 34Answers: 3

  August 2015

  So I'm actually having the error again! Even if I strip everything I can think of down and only include the JS and CSS I download from your builder, it still is not working!

  Can you please take a look?

  https://jwtoler.com/public-test/financeCharges.php?f=10135116&cat=Operating&ac=925000&dept=ADFR&table=charges
  *Ignore the errors loading external files as I transferred just enough to showcase this.
• allan Posts: 63,281Questions: 1Answers: 10,425 Site admin

  August 2015

  Which column do I need to click on to trigger the error?
• jtoler5 Posts: 93Questions: 34Answers: 3

  August 2015 Answer ✓

  You answered my question in another thread w/ using 1.10.9 dev.