No refresh after Create AJAX return is correct

rpmccormick

I just upgraded to the latest version of everything.
Pretty smooth except for one issue...

I have Buttons working, and extend: "create".
It works with Editor and all is well, but...
After creating you need to reload the page to see it.

I also have bubble-editing that works fine and updates the table properly.
I have compared the returned AJAX from the PHP libs, and they are the same...
An edit to row_3 returns the entire row.
An create of row_4 returns the entire row (exact same) but it is not added to the table.

What am I missing here?

rpmccormick

Buttons snippet

{extend: 'create', text: 'Add New Hotel', className: 'btn btn-success', init: DT_removeClass, editor: HotelEditor},

Is this the culprit? No, it is getting saved fine.

  HotelEditor = new $.fn.dataTable.Editor(

  formOptions: {main: {drawType: 'page', title: 'Edit Hotel', buttons: 'Save', submit: 'changed'},
                inline: {drawType: 'page', onBlur: 'submit'},
                bubble: {drawType: 'page'/*, submit: 'allIfChanged'*/},

Why doesn't the table refresh?

Row3 edit (works):

{"data":[{"DT_RowId":"row_3","LTE_Hotels":{"Hotel_ID":"3","Hotel_Created":"11\/26\/19 4:17 am","Hotel_Modified":"11\/26\/19 4:22 am","Hotel_Code":"1235456","Hotel_Name":"132215","Hotel_Phone":"ghfgh","Hotel_Website":"ghfhg","Hotel_Photo":"ghfgfhgj","Hotel_BGPhoto":"hgfjhjhf"}}]}

Row4 new (doesn't):

{"data":[{"DT_RowId":"row_4","LTE_Hotels":{"Hotel_ID":"4","Hotel_Created":"11\/26\/19 4:22 am","Hotel_Modified":"11\/26\/19 4:22 am","Hotel_Code":"56456456465","Hotel_Name":"56456465464","Hotel_Phone":"3546546546546","Hotel_Website":"564654564564","Hotel_Photo":"654564654654","Hotel_BGPhoto":"654564564564"}}]}

colin

Hi @rpmccormick ,

The problem is likely to be that the server isn't responding with what the client expects. Can you post the JSON returned from the server after the creation, please.

I'm surprised this broke with the upgrade, since the communication protocol hasn't changed in a while.

Cheers,

Colin

rpmccormick

It is not necessarily because of the upgrade, it is a new project as well, I just didn't encounter it on older projects with older versions (though most of the old code has been portable).

I did post the JSON returned from the server above... it is Row 4 in my original post. Editing works fine, bubble-editing works fine, create Button doesn't (I am new to Buttons instead of TableTools). It does work other than not updating the table, even though it returns Row 4 (see OP). A page reload shows the new row just fine.

Thanks for the help.

allan

Its because of this: drawType: 'page'.

A page draw will not updating filtering or sorting, so the new data wouldn't be shown. It would work with editing since the data is already present.

What you could do is:

editor.on('submitComplete', function () {
  table.draw(false);
});

not ideal - we might need a way to split the draw type down by operation, but that should workaround it.

Allan

rpmccormick

Thanks Allan. That is funny, I only added the "main:" form option because otherwise I am getting a blank header and no OK button.

Now I have found that use the "main:" form option applies it to both Edit and Remove so that doesn't really work. Again, without it, the Remove popup is completely blank (header / bodytext / no buttons).

Everything is a fresh install all-in-one package newest version, but I still have the same issue.

How do I get the default language back? (or how do I set a different header/buttons for Remove in addition to Edit?) I'm sure it is all in your awesome docs, it is just on my todo list and funny it was the cause of this issue.

allan

That is funny, I only added the "main:" form option because otherwise I am getting a blank header and no OK button.

That would happen if you are using create() / edit() without then specifying the form-options for the header / buttons or using the title() / buttons() methods. So for example you might do:

editor.create({
  title: 'Create',
  buttons: ['Submit']
});

But in your first post you say you are using extend: 'create' so I'm not actually sure what would cause this. Can you link to a page showing the issue please?

Allan