Unable to automatically determine field from source. Please specify the field name

bbrindza

DataTable Editor error .

Need some extra eyes on this .

When I click the Add Comments button at the end of the row, I get the error.

I do have the click event excluding the button class. ( .commentsButton).

Is it because I have a class defined in the button already in the render? return '<button class="btn btn-primary btn-xs"

$('#budgetRows_' + id).on('click', 'tbody td:not(:first-child):not(\'.commentsButton\')', function (e) {
             editor.inline( childTable3.cell( this ).index(), {
                 onBlur: 'submit',
                 submit: 'allIfChanged'
             });
          });
 
          childTable3 = $('#budgetRows_' + id).DataTable({
             dom: 't',
             ajax: {
                    type: 'POST',
                    url: 'ssp_getSalepersonByCustomerBillTo_BudgetData.php',
                    data: { salespersonNumber: salespersonNumber,
                            customerNumber: customerNumber,
                            productNumber: productNumber
                        },
                },
             serverSide: true,
             order: [ 1, 'asc' ],
             keys: {
                    columns: ':not(:first-child)',
                    keys: [ 9 ],
                    editor: editor,
                    editOnFocus: true
             },
             columns: [
                         {
                             data: null,
                             searchable: false,
                             orderable: false,
                             render: function ( data, type, row ) {
                                  return '<td><b>Next Year Budget</b></td>';
                               }
                          },  
                         { data: 'BD$01'},
                         { data: 'BD$02'},
                         { data: 'BD$03'},
                         { data: 'BD$04'},
                         { data: 'BD$05'},
                         { data: 'BD$06'},
                         { data: 'BD$07'},
                         { data: 'BD$08'},
                         { data: 'BD$09'},
                         { data: 'BD$10'},
                         { data: 'BD$11'},
                         { data: 'BD$12'},

                             // ** Comments Button
                            {
                             data: null,
                             searchable: false,
                             orderable: false,
                             className: 'commentsButton',
                             render: function ( data, type, full, meta ) {
                                return '<button class="btn btn-primary btn-xs" onclick="openCommentDialog(\''+ full.PKLOC +'\', \''+ full.PKRGNO +'\', \''+ full.PKSLNO +'\', \''+ full.PKCUST +'\', \''+ full.PKPROD +'\' )">Comments</button>';
                            }
                          },  
                        
             ],                                                                                                              
       
             columnDefs: [ 
                            { targets: "_all" , className: "text-center" },
                            {targets: "_all" , width: 100 },
                            //{ targets: 13, className: "text-center" },
                            { targets: "_all", orderable: false}
                        ],
             
             select: {
                 style:    'os',
                 selector: 'td:first-child'
             },

         } );

allan

Try this as your selector for the inline action:

$('#budgetRows_' + id).on('click', 'tbody td:not(:first-child, .commentsButton)', function (e) {

Allan

bbrindza

Got it.. Thank you

bbrindza

That still did not do it.

allan

Oh - you have KeyTable triggering inline editing as well as your own call to inline(), and that KeyTable selector is not taking account of the comments button:

             keys: {
                    columns: ':not(:first-child)',
                    keys: [ 9 ],
                    editor: editor,
                    editOnFocus: true
             },

Change the selector to :not(:first-child, .commentsButton) and that should do it.

However, I would strongly suggest removing your own call to inline() if you are going to use KeyTable to trigger inline editing. Otherwise it just duplicates the call and makes things more complicated.

Allan

bbrindza

That worked. I took your recommendation as well. Thanks again Allan