Return messages/result and deny remove/add operations from the server

Webix JS
1

Hi Guys

Whenever Webix makes an Ajax request, I’d like the opportunity to be able to pass a message back with it and have that displayed in a dialog or webix notification. For example, when I call datatable.add() this automatically fires off an Ajax POST request to the server, the servers saves the record and returns the ID of the new row. Such as

{ id: 12 }

But I’d like to be able to extend this an include additional information, such as a notifications and errors which automatically get displayed

{ id: 12, error: Object was saved but with errors }

Can anybody recommend a method for doing this? I’m looking to do much with the returned message, just have it flash up as either a dialog or as a normal webix notification. But I’m trying to avoid having to place lots of code for checking, so would ideally be looking for a way to just override Webix’s default functionality and insert this as additional part of the operation.

Also, is there anyway of deny a remove/add operation from the server, so for example if I call datatable.remove(10), if the server runs some logic, for example this row 10 has dependencies, I can simply return “false” and it will not be removed from the Datatable? I doubt its possible, as it can could be done using the onBeforeDelete() handler, but that of course creates a lot more code and additional ajax requests.

2

There are two options

a) updateFromResponse flag
http://docs.webix.com/api__dataprocessor_updatefromresponse_config.html
It allows to copy all properties from response to the saved data object ( so you can change some fields on server side as part of data saving )

b) data saving events
http://docs.webix.com/api__dataprocessor_onafter_event.html

webix.dp( $$("table") ).attachEvent("onAfterUpdate", function(id, response){
    if (response.error) do_something();
})
3 
for example this row 10 has dependencies, I can simply return "false"

Nope. The client side operations are “optimistic” so they add|update|delete data in the client side component before sending data to the server side, as result operation can’t be reverted when server side returns “false”

We are aware about issue, so next updates will include some way of undo for editable components, including the datatable. It may be included in Webix 2.2, but it is not fully decided yet.

4

Hi Maksim,

Thanks a lot, really appreciate you taking to the time to answer so many of my questions :slight_smile:

is there anyway of applying

webix.dp( $$(“table”) ).attachEvent(“onAfterUpdate”, function(id, response){
if (response.error) do_something();
})

Globally? or does it have to each individual component?

5

You can

a) Subclass the component ( datatable ) by creating your own ( savetable ) which will use the above event handler. In such case, you will be able to use in UI markup view:“savetable”, that will work the same as datatable and will contain your onUpdate handler
http://docs.webix.com/desktop__custom_component.html

b) you can use data saving proxy
http://docs.webix.com/desktop__server_proxy.html#creatingcustomproxyobjects

proxy is an object that handles the data saving. You can redefine save and put your own ajax call and response processing code there.

webix.proxy.smart = { save:function(){ ... run saving here ... } };
{ view:"datatable", save:"smart->some.php" }

Solution (b) is very similar to the “apply globally”

6

Thanks again Maksim, one last question, does a DataTree have an onAfterUpdate event? I’ve got the following code, but the alert is not firing (it works ok with the DataTable) -

	webix.dp($$("category_tree")).attachEvent("onAfterUpdate", function(response, id, object) { 
						webix.alert("here...");							
	});
7

Its ok, spotted my mistake, I was expecting it to fire on Insert, but that’ll be a different event?

8

Yep there are 3 different events onAfterUpdate, onAfterDelete, onAfterInsert

Or you can use onAfterSave - that is called for all types of operations.