Invalid JSON Response

mattgolden100

I tried to create a test case but I am using bootstrap and it is not formatting correctly for me (to even load a datatable)
Debugger code (debug.datatables.net): https://debug.datatables.net/ugoyob
Error messages shown:
Uncaught TypeError: Cannot set property 'data' of null
at ta (jquery.dataTables.min.js:37)
at Wb (jquery.dataTables.min.js:110)
at r.<anonymous> (jquery.dataTables.min.js:110)
at r.iterator (jquery.dataTables.min.js:101)
at r.<anonymous> (jquery.dataTables.min.js:110)
at Object.reload (jquery.dataTables.min.js:104)
at Object.success (inventory.js:31)
at c (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at l (jquery.min.js:2)

Description of problem:
I get invalid JSON response, I have tried to debug with the manual on this website but I just cannot figure it out after hours of trying different things. This link is my stack overflow post, which shows some other code as well, including what is returned. https://stackoverflow.com/questions/66114292/invalid-json-response-c-sharp-mvc

colin

Is this using Editor? Are you able to link to your page so we can take a look?

Colin

mattgolden100

No, I do not use Editor. I am confused what you mean by "link your page". That stackoverflow I linked includes lots of important info pertaining to this issue.

kthorngren

Your SO thread doesn't show your Datatables init code. In order to use ajax.reload you need to use the ajax option to load the data. Or are you expecting $('#myTBODY').DataTable().ajax.reload(); to initialize your Datatable?

It looks like you are using the loadData() function to load the table into HTML then wanting to initialize Datatables. You can try removing .ajax.reload().

Or you can use the ajax option to load the data. Looks like you will also need to use the ajax.dataSrc option to point Datatables to use the items object. And you the columns.data option to define the columns. See this example.

Kevin

mattgolden100

The old way I handled it was, in my load funciton, to call $('#myTBODY').DataTable();
Then, after an action (Add, Update, Delete) I would call load again, which it adds/updates/deletes the proper row visually. However, if I proceed to sort one of the columns, the change disappears, and the only way to fix it is to refresh the page. Same thing with the # of entries at the bottom, after Add, it does not increment by 1, only after I refresh it does. I want to refresh the table after an action without having to refresh the page. I assumed that by calling load after an action (and thus calling DataTable() ), it would refresh for me, but it isn't doing that and I am stumped.

kthorngren

Datatables won't know about the updates if you are directly manipulating the DOM. See this FAQ about options.

Without seeing your full page, as Colin asked, its difficult to provide specific answers. When adding a row its best to just use row.add(). Making a change use row().data() or cell().data(). Or row().remove() to delete a row.

Kevin

mattgolden100

How can I provide you my full page? I am writing a C# web application with bootstrap, and using the test case page thing is just far too complicated for me to portray what I am trying to do. I will literally pay someone to help me fix this, it is so hard to find 1 on 1 help where I can convey things effectively.

kthorngren

Here is a very simplistic example:
http://live.datatables.net/zawolulo/1/edit

Note that the ajax option is commented out but I think its what you will need to use. It uses columns.data and columns.render to build your links. It has simple examples of adding, editing and removing rows. The row selection and data is hardcoded. I assume you have the code to handle these funcitons.

You can use the Select Extension to select rows. If you don't want to write the CRUD code you can try out then purchase the Editor. The small cost of the Editor license is worth the development cost of writing your own CRUD app. This Editor Example shows inline controls like you have.

HTH,

Kevin

mattgolden100

Thanks Kevin, I will give that a try