How to prevent re-sorting after editing?

pisisler

I have been searching for this for hours, without any luck.

I have a calculated column, which is orderable. Since order is based on the calculation, after any data change, the sorting will be updated and the user will have lost the item he edited. (Beucase that row is sent to some other page, because of the new value)

So how can I prevent on the fly sorting after editing?

bindrid

I don't try to do that. Instead, I keep track of the row being edited. When resorted, I change paging to make sure the row being edited is still visible.

I used this plugin to help me https://www.datatables.net/plug-ins/api/row().show()

pisisler

Thanks bindrid, but I don't think that is useful for me. Because I calculate the profit margins of some products. Then users sort by the margin, which is a calculated value, not a stored value.

So for example when they need to work on the prices, they need to see them all at once. Like "the most loosing products". That means, jumping to another page will make them loose the others from sight. What I need is, the row should stay in its exact position until the next sort.

allan

The draw option of the form-options configuration object can be set to none to stop Editor telling DataTables to redraw (which prevents a sort, but still will show the new data).

Allan

pisisler

Yes Allan, that was the option I couldn't find. Thank you.

Yet it was drawType , rather then draw itself? I see that there's no page for drawType option but I needed to set drawType (not draw) in formOptions { inline }

allan

Oops - sorry. drawType is correct!

Allan

TomBajzek

I've tried to use this technique, but it doesn't work for me. I need to keep the edited row on the screen after the edit has been completed so the user can continue to work with it. The problem is that the user often edits one of the sort fields. The screen (and sort) are then updated, moving the row just edited out of view.

I either don't understand drawType, or I have an error in this code segment:

$('#tickets').on('click','tbody tr', function() { ticketEditor.edit(this, { drawType: 'none' } ); } );

Please clarify.

Thanks,
Tom

kthorngren

I tried your code here and it seems to work.

Just changed '#tickets' and ticketEditor to match the example config.

Kevin

TomBajzek

Kevin,

In the example you gave, if the table is sorted by Position, and you then click 'Change Tiger', his row moves, because the change happens in the sorted row, and the sort is re-applied. This behavior is very frustrating to the users of this code.

Perhaps what I'm looking for is not possible, although it does appear that drawType=none ought to prevent this. Maybe I should look for a workaround to keep this just-edited ticket available for further work.

Tom

kthorngren

and you then click 'Change Tiger', his row moves,

Sorry, I should have removed that button from the example. It was an example for something else. The event handler for the button uses draw().

What you posted looks like you bring up the editor when clicking a row. That is the test you should try.

Kevin

TomBajzek

Kevin,

OK. Your example works when I just edit a row. I added an Update button to the live example to mimic my own code, and it worked in that form.

I then made my code match your example, but the problem remains - the sort is still done after I click Update. I then removed the Update button from my code, but that made no difference. I also added the drawType: 'none' to the main definition of ticketEditor, and that also made no difference.

My conclusion is that something else in either my editor or data table definition is interfering somehow. I guess I'll have to try to identify what that is.

Thanks,
Tom

kthorngren

Maybe you have an editor event that is triggering an ajax.reload() or something else when the edit is complete.

Kevin

TomBajzek

Kevin,

Yes. There was an ajax.reload() in the code. Originally, as I recall, I seemed to need that to display the refreshed contents of the edited row, but maybe I'm wrong about that. I think that was about a year ago, so I might not remember correctly. Right now, I seem to have the behavior I need, except for one case:

In that one case I invoke the editor from the code with show = false. In that case, it appears that the reload() happens, even though I've removed the ajax.reload() calls from my code. It appears that this method may be doing the reload() by default.

Fortunately, that is a special case where the reload may not be harmful to the user experience as it is in the other cases.

You have very helpful,
Tom