Disabling dhtmlxDataView

Suite and Optimus Suite 5
#1

Hi,
I am looking at ways to disable the dhtmlxDataView to prevent users from clicking inside while an operation is ongoing on the server. I cannot find anything like the form lock or enable/disable calls.

Anyone knows what is the recommended way to lock/disable this control?

thanks
Sylvain

#2

If you use dataview in layout cell, you can use onXLS and onXLE event handlers to call
view.attachEvent(“onXLS”, function (){
dhxLayout.cells(“a”).progressOn();
});
view.attachEvent(“onXLE”, function (){
dhxLayout.cells(“a”).progressOff();
});
It will show cover mask to disable cell area i.e. dataview from clicking:
dhtmlx.com/docs/products/dht … gress.html

#3

thanks, but I don’t want to display a progress image in the data view cause it’s not the one doing the search, i just want to disable it while i am getting the current clicked item in the list into another another form to prevent users from changing selection while the information is loaded. workflow is as follow:

1- request server for a list of items - fill into the dataview
2- user click in the dataview to select 1 item
3- item clicked is loaded into a form using a different datastore
4- while the other store load the data, i want to prevent user from clicking in the list of dataview

the form on which I load the data already display a progress using those suggested function, it will be weird to have both the progress in the data view and the form.

thanks
Sylvain

#4

But you can use it without image
table.dhtmlxLayoutPolyContainer_dhx_skyblue div.dhtmlxLayoutPolyProgressBGIMG {
background-image: none !important;
}

Or you can use method unselectAll() to unselect all items clicked. But first variant is the most easiest one

#5

Oh, sorry, you need the next event handlers:
docs.dhtmlx.com/doku.php?id=dhtm … foreselect
In onBeforeSelect you just need to return false to prevent new selection
docs.dhtmlx.com/doku.php?id=dhtm … fterselect
In onAfterSelect you need to send a request

#6

Perfect! this work
Thanks

#7

You are welcome!

#8

I needed to use with and without image. And I wanted the effect of the grayed background.

I believe I had 2 options:

  • Clone the progressOn() code and remove the image there.
  • Or what I ended up doing: hide the progress image right after I call progressOn().

layout.progressOn();
document.getElementsByClassName(“dhxlayout_progress_img”)[0].style.visibility = “hidden”;

Not as pretty; but less custom code to maintain is a good thing… Appreciate any feedback.

Maybe a nice feature in the future some day. “layout.progressOn(false);” or something :wink:

#9

You need to add the next css:

.dhxlayout_base_dhx_skyblue div.dhx_cell_layout div.dhx_cell_progress_img { background-image: none !important; }

#10

In the same application, and in the same window, I want to sometimes show the image, and sometimes not show the image. CSS won’t allow me to do this right?

#11

Yes. In this situation you need to use the approach you found

#12

Starting in V4.2 do:

document.getElementsByClassName(“dhxcelltop_progress_img”)[0].style.visibility = “hidden”;