Proxy calling GetItem on Filemanager instance

In the construction of the Filemanager I’ve attached a proxy using the following:

//object constructor
var fm = webix.ui({
    view: "filemanager",
    id: "files",
	handlers:{
    	branch:  myProxy,
	}        
});

When the proxy is invoked, I attempt to resolve the name/value of the branch using getItem. The backend server (a 3rd party CDN) needs the branch name, not the webix id.

As seen here, this instance of the proxy calls $$("files).getItem() with params.source to get the associated name.

 var myProxy = {
      $proxy: true,
      load: function(view, callback, params){
           window.source = params.source;
           var name = $$("files").getItem (params.source);
           //... Ajax call to the backend follows
      }
 };

Unfortunately, the result stored in ‘name’ is always undefined.

Can you explain how I may extract the name/value of the branch I’m trying to load?

Ok,

from examining the call stack, I learned that the value stored in params.source is actually ‘window.location.hash’, not the id of the branch/directory that the UI needs to load.

This seems particularly useless for a call to the back end server.

I would make sense to overload ‘onBeforeShowTree’ so that I’m filling data for the tree as needed but, that method doesn’t provide the id of the branch of the tree in context to load.

Why doesn’t WebIx give me some indication of the directory that we need to load from the server?

And, by the way, does anyone answer questions anymore? Listopad, Maria, Maksim?

Hello,

Actually, the params.source in the proxy call is the ID of the needed folder. To get to the folder’s name you should get the item’s value unless you store the file name under another propery.

Check the following snippet, please: http://webix.com/snippet/27bf3a54

Thank you for the example, Helga.

I see that your example uses $$(“files”).load(…) and mine uses $$(“files”).parse (…).

Apparently, unlike calls to $$(“files”.load(…), when the proxy is called by way of parse(…), calls to $$(“files”).getItem(…) return an undefined value; i.e. NULL.

Here’s an example of what I mean: http://webix.com/snippet/dd4c21dc

To use $$(“files”).load(…), we need a way to set a custom header, as seen here in parse:

fm.parse( webix.ajax().headers(
    { 'X-Custom-Header':'version=1&action=dir&format=xml'}
).get(URL).then(function (data) {/*Custom XML parsing */});

Any ideas on how to work around this problem?

On further study, I found that webix allows the user to override the default handler of ‘onBeforeAjax’.

example:

webix.attachEvent("onBeforeAjax", 
    function(mode, url, data, request, headers, files, promise){
    headers["X-Custom-Header"]= "version=1&action=dir&format=xml";
    });  

My suspicion is that this will provide me with a means to add headers based on the URL or other application state. If so, then I may be able to add the required customer header via delegation to my custom handler.

Unfortunately, I now realize that there is no obvious means to parse the XML response body returned by the CDN so that it conforms to the JSON format expected by the filemanager widget.

This was handled in $$(“files”).parse (…), but without an equivalent means to modify the response retrieved by $$(files).load(…) before the data is processed by the widget, the UI will likely fail.

Still, I cannot see the problem with the NULL value after the initial parsing: http://webix.com/snippet/bd5eb652

Odd, the snippet that you shared fails for me in both Chrome and Firefox.

The message box always displays “undefined”; and crashes the app when I select the non-latin characters (Chinese??).

Here’s a screen capture of the issue:

ok, looks like this is what you wanted to demo:
http://webix.com/snippet/422b4cc7

Yep, I’ve posted the wrong snippet, now it is correct.

Confirmed!

Looks like the trick is in returning the appropriate data structure from $$("files).parse(…).

With your example as a guide, I managed to coerce everything into the right format and now it works as expected.

Thank you, Helga.