Disabling dhtmlxDataView


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?



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


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.



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


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


Perfect! this work


You are welcome!


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().

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:


You need to add the next css:

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


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?


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


Starting in V4.2 do:

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