|
Rank: Member Groups: Member
Joined: 3/2/2010 Posts: 11
|
Hi support folks
I'm sure this is an easy one but for some reason it's just not happening. How do I disable the Grid from Javascript so that it does not respond to any clicks? I have tried a lot of different ways but they just don't seem to work.
Thanks!
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,194
|
Hi, There is no easy way to disable the entire Grid from JavaScript. You will need to recursively set every element's disabled to "disabled", but you also need to "remember" previous disabled state so that you can restore them later. I would suggest you to change the Grid to read-only instead of disabled: 1. Call this method to hide any command button column: http://doc.essentialobjects.com/library/1/jsdoc.public.gridcolumn.setvisible.aspx2. Handle each editable column's ClientSideBeginEdit event and returns false from your JavaScript handler. That way user will not be able to enter edit mode; With command columns removed and code in place to prevent user enters edit mode, the Grid becomes read-only even though it’s still enabled. Hope this helps. Thanks!
|
|
Rank: Member Groups: Member
Joined: 3/2/2010 Posts: 11
|
Hi and thanks for the answer. I need to prevent the user from selecting a different row. Could you help me out with how I might iterate through all the elements in the grid? Remembering that it's disabled is no problem as I track state client side.
Thanks
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,194
|
Hi, You will not be able to prevent the user from selecting a different row when the Grid is in read only mode. You can use our client side JavaScript API to iterate through all the items/cells. Before you begin, you will want to take a look of this topic if you are not already familiar with our JavaScript API: http://doc.essentialobjects.com/library/1/clientapi_howto.aspxYou can then start by getting the Grid object and call methods on the object to access the Grid item and cells: http://doc.essentialobjects.com/library/1/jsdoc.public.grid.aspxThanks
|
|
Rank: Member Groups: Member
Joined: 3/2/2010 Posts: 11
|
Hi and thanks again. Are you suggesting that by iterating through each griditem I can set each one disabled and that will prevent someone from changing the selecteditem? Would I use .style.disabled = true ?
Thanks
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,194
|
Hi,
Sorry I misunderstood what you meant by "could you help me out with how I might iterate through all the elements in the grid". We thought you changed your topic to something else.
Iterating all elements in the Grid has nothing to do with the Grid. You would put the Grid inside a DIV, then use getElementById get that DIV, then access childNodes on that elements to access all direct child of that DIV, for each child element you repeat this process until you reach the leaf node. It's all JavaScript and DOM access.
Thanks!
|
|
Rank: Member Groups: Member
Joined: 3/2/2010 Posts: 11
|
Hi again. I've managed to write the code to iterate through the child nodes and disable them. It works a treat except for the column headers. Every grid item becomes disabled but if you hover over the columnnheader it still lights up and if you click it, it still sorts the grid. I have a feeling you're doing something clever there ... any idea how I can stop the header sort from working on the client side? If I can stop the sort from happening I'm happy with that as the other code disables the grid nicely. For the sake of anyone else wondering how to do this here's my code. It works fine in IE8 but I haven't tested it in any other browser. I wrapped the grid in a DIV with an ID of GridHolder.
Code: JavaScript
function DisableGrid(disable) {
// If disable = true then disable the grid otherwise enable it
var gh = document.getElementById("GridHolder");
DisableChildNode(gh, disable);
}
function DisableChildNode(node, disable) {
//Disables child node and recurses through all child nodes of the child node
for (i = 0; i <= node.childNodes.length-1; i++) {
DisableChildNode(node.childNodes(i), disable);
}
node.disabled = disable;
}
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,194
|
Hi, Your code looks fine except that you will want to set disabled only on element node. You also want to explicitly delcare variable "i". The final code will look like this:
Code: JavaScript
function DisableChildNode(node, disable) {
if (node.nodeType != 1)
return;
//Disables child node and recurses through all child nodes of the child node
for (var i = 0; i <= node.childNodes.length-1; i++) {
DisableChildNode(node.childNodes(i), disable);
}
node.disabled = disable;
}
|
|
Rank: Member Groups: Member
Joined: 3/2/2010 Posts: 11
|
FANTASTIC!!!! That works exactly how I wanted and the grid is now totally disabled.
Thanks very much ... love your product and love your support.
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,194
|
Great. Glad that it works for you!
|
|