Resizing a column affects getting the datatable. It shows no records/shows old results

ureshkuruhuri

Hello All,

I have come across a weird issue, rather couple of issues and these are tied up to resizing the column manually.

I have json array data coming from an ajax call. I have set the datatable to destroy before each call in order to show the data for each dataset that is coming back from the ajax call for new criteria that is sent.

The table is rendered looks good.

The issue is happening when the user resizes the column. The moment the column is resized, it shows no records but the message set for the language.emptyTable property. However, it shows the page numbers and when I click a page, it shows records from the previous result set.

However, at this point, I tried using .clear() along with .destroy() and this clears up showing the old results.

But the issue remains that when I resize the column, it shows no records + message set for language.emptyTable + page numbers for the current result set.

Can somebody throw some light on this on what possibly could be causing this issue.

Other info:
datatables v1.10.18
jquery v1.11.3
jqueryui v1.12.1
Buttons v1.6.1

Thanks.
Uresh

kthorngren

Column resizing is not part of Datatables. There are some third party libraries fo rthis but they aren't provided by Datatables. Without seeing what is going on it would be hard to provide suggestions. Please provide a link to your page or a test case replicating the issue.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Do you get errors in your browser's console?

What does your code do when the columns are resized that would cause the table to be emptied and presumably an ajax request fetching a new data set. Are you expecting it to fetch a new set of data?

Kevin

ureshkuruhuri

@kthorngren thanks for responding back.

1. No errors in the browser console.
2. The code does not have call back function for, when the columns are resized. The column resize is meant for user's convenience only.

The datatable is being rendered as a part of a portal page (WebSphere Portal). We have used datatables on other portal pages in the same portal they are working and compared with those as well.

Anyway, I created the following test case(s). Please take a look and let me know what you think of it.

http://live.datatables.net/recawiqa/1/edit
https://jsfiddle.net/b9ekw4ux/4/

Also, on a separate note, I also have jqueryui in the same jsp for datepicker controls but I have used jqueryui earlier too with datatables (v1.9) but have not seen any conflict. Do you think that could cause any issue?

I observed one more thing: When I resize the column, it is also changing the sorting icon (asc/desc) involuntarily. But when I click on the column, it sorts the data and shows it.

Btw, any idea what would be the event or an entry point in the code that I can debug? I tried drag, drag and drop events but it is of no use.

Also, if the problem is not solved anytime soon, what would be the way to restrict/disable the column resizing. I tried autoWidth: false already, but it is not helping.

Thanks,
Uresh

kthorngren

I looked at both test cases but don't see where you have it setup for column resizing. I could be missing it. Please provide more details of how to recreate the problem.

When I resize the column, it is also changing the sorting icon (asc/desc) involuntarily. But when I click on the column, it sorts the data and shows it.

I can see that happening. You will need to contact the developer of the library you are using for column resizing.

This does bring up an interesting idea. If you are using server side processing (serverSide: true) then it will send a request to the server each time the sort occurs which could be the issue. I don't see this option in your test case since you are using the data option.

any idea what would be the event or an entry point in the code that I can debug? I tried drag, drag and drop events but it is of no use.

If you are referring to the column resize plugin you will need to contact the developer for support.

if the problem is not solved anytime soon, what would be the way to restrict/disable the column resizing.

Don't enable the plugin for column resizing. Like I said before this is not part of Datatables functionality.

Kevin

ureshkuruhuri

@kthorngren thank you. your pointers helped me to realize the issue. I just checked the theme that we are using in the WebSphere Portal. The datatables.js and the ColReorderWithResize.js are included in it. So, the extension (col reorder resize) is inadvertently affecting the datatable. I will check further on what is causing it and in worst case am going to disable it for the time being until the issue is resolved.

thanks again.