The Buttons and/or Select extensions are not compatible with JQuery 2.x.x

ahanssens@cps247.com

In the Editor 1.5.0 .NET example program, open the file WebApiExamples/Web/examples/simple/simple.html. Change line 18 to:

<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-2.1.4.min.js"></script>

Then run the program and go to the page. When you attempt to edit or delete a row, the error "Unable to automatically determine field from source. Please specify the field name." will appear in the JavaScript console and the lightbox will not open. This happens with any version of JQuery 2.0.0 or higher.

I ran into this problem when trying to remove the TableTools extension from my project and use the Buttons and Select extensions instead. The TableTools extension does not seem to have any problems with JQuery 2.x.x.

allan

Hi,

Neither the jQuery version, nor the Buttons/Select versions should have any impact on the error you are seeing. That is an Editor error that is caused by Editor not having enough information to be able to inline or bubble edit a column in a table.

Both Select and Buttons are fully compatible with jQuery 2+

Can you show me your full Javascript and ideally a link to a test page showing the issue so I can debug the problem please.

Allan

ahanssens@cps247.com

Did you try changing the line in your example program, as I described above? That should make the problem show up immediately. The only other change I made to your example program was to change the database connection string in the settings.

I tracked the problem down to this section of code (which is on lines 5786-5803 of dataTables.editor.js). The problem appears to be due to a change in behavior in isPlainObject in JQuery 2.x.x.

    if ( $.isPlainObject( identifier ) && ( identifier.rows !== undefined || identifier.columns !== undefined || identifier.cells !== undefined ) ) {
        // Multi-item type selector
        if ( identifier.rows !== undefined ) {
            __dtRowSelector( out, dt, identifier.rows, fields, idFn );
        }

        if ( identifier.columns !== undefined ) {
            __dtColumnSelector( out, dt, identifier.columns, fields, idFn );
        }

        if ( identifier.cells !== undefined ) {
            __dtCellSelector( out, dt, identifier.cells, fields, idFn );
        }
    }
    else {
        // Just a rows selector
        __dtRowSelector( out, dt, identifier, fields, idFn );
    }

When JQuery 1.11.3 is being used, isPlainObject returns False. This causes execution to go to the "else" portion of the if statement, which appears to be correct. (I only selected a single row.)

However, when JQuery 2.1.4 is being used, isPlainObject returns True. This causes execution to go to the "if" portion of the if statement, which ends up calling __dtColumnSelector, which ends up calling __dtFieldsFromIdx, which throws the exception.

I'm not very good with JavaScript, so I don't really understand what is being checked inside isPlainObject, but basically it looks like the 2.1.4 version of the function is a lot less thorough and will tend to return True unless it can see some obvious reason to return False. The older version of the function has some code for checking "own properties" that isn't present in the newer version of the function, and this is the code that ends up returning False.

There may be something else going on, however, because even if I select multiple rows (which should result in an identifier that the "if" portion of the if statement would find acceptable), the exception is still thrown.

ZakInterDev

I've also experienced the same problem when moving to the latest version of DataTables/Select/Buttons & Editor. The same error appeared when using jQuery 2.1.4, when clicking on the "Edit" or "Delete" buttons. We've reverted back to jQuery 1.11.3 and everything works just fine.

allan

Hi,

Super - thanks for the reply and extra details. I can confirm that I see the issue now - I was initially confused by the post title, but I've got it now.

Your diagnosis is spot on - it appears that $.isPlainObject doesn't work correctly with DataTables API instances. I need to investigate a little bit more exactly what that is - I can reproduce the issue with a trivial class, but not yet a complex one like the API instance (other than the API instance itself of course!).

While I look into this further, I obviously want proper compatibility with the existing jQuery releases, so I've committed a workaround which is now available in the dist repo.

Thanks for your help tracking this one down.

Allan

allan

If anyone is interested, this jQuery ticket discusses exactly this issue with Moment.js and their reasoning. I'm happy that the fix above is the correct one to make. It will be included in DataTables 1.10.9!

Regards,
Allan