What's New?

[CLOSED] Disabling specific Checkboxes ina Checkbox-Tree

  1. #1
    Jun 01, 2011, 7:48 AM

    [CLOSED] Disabling specific Checkboxes ina Checkbox-Tree

    Hello,

    I am searching for a solution similar to disabling Checkbox-Grids at:
    http://forums.ext.net/showthread.php...l&goto=newpost


    My purpose is to avoid checking nodes in a tree with more than 2000 childnodes.
    For this reason my nodes have an attribute "childcount", means that all nodes with node.attribute.childcount>=2000 should be disabled.

    In the above thread this is done via a CSS defined in GetRowClass of the View and the BeforeRowSelect event.
    But in case of using a three I do not have a view to set up some styles neither than an event called BeforeCheckChange or something like that.


    So... how can I do this?


    Regards,

    Martin
    Last edited by Daniil; Jun 01, 2011 at 1:37 PM. Reason: [CLOSED]
  2. #2
    Jun 01, 2011, 8:54 AM
    Hi,

    I was surprised but there is no standard way to prevent checking.

    I can suggest the following way.

    Example
    <%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.Net Example</title>

    <script type="text/javascript">
        var onBeforeAppend = function(tree, parentNode, node) {
            node.attributes.checked = node.attributes.checked || false;
        }
        
        var onAfterRender = function (tree) {
            tree.eventModel.onCheckboxClick = tree.eventModel.onCheckboxClick.createInterceptor(
                function (e, node) {
                    if (node.attributes.childcount > 2000) {
                        e.stopEvent(); // to prevent checking on html level
                        return false; // to prevent check changing logic
                    }
                }
            );
        }
    </script>
</head>
<body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:TreePanel ID="TreePanel1" runat="server" AutoHeight="true" RootVisible="false">
        <Root>
            <ext:TreeNode Text="Root" Expanded="true">
                <Nodes>
                    <ext:TreeNode Text="Less 2000">
                        <CustomAttributes>
                            <ext:ConfigItem Name="childcount" Value="1999" Mode="Raw" />
                        </CustomAttributes>
                        <Nodes>
                            <ext:TreeNode Text="More 2000">
                                <CustomAttributes>
                                    <ext:ConfigItem Name="childcount" Value="2001" Mode="Raw" />
                                </CustomAttributes>
                            </ext:TreeNode>
                        </Nodes>
                    </ext:TreeNode>
                    <ext:TreeNode Text="More 2000" NodeID="test">
                        <CustomAttributes>
                            <ext:ConfigItem Name="childcount" Value="2001" Mode="Raw" />
                        </CustomAttributes>
                        <Nodes>
                            <ext:TreeNode Text="Less 2000">
                                <CustomAttributes>
                                    <ext:ConfigItem Name="childcount" Value="1999" Mode="Raw" />
                                </CustomAttributes>
                            </ext:TreeNode>
                        </Nodes>
                    </ext:TreeNode>
                </Nodes>
            </ext:TreeNode>
        </Root>
        <Listeners>
            <BeforeAppend Fn="onBeforeAppend" /> <%--to get checkboxes easily--%> 
            <AfterRender Fn="onAfterRender"/>
        </Listeners>
    </ext:TreePanel>
    </form>
</body>
</html>
  3. #3
    Jun 01, 2011, 10:43 AM
    Hi!

    thanks for the code.

    Quote Originally Posted by Daniil View Post
    I was surprised but there is no standard way to prevent checking.
    I am not that surprised. Customers and colleagues here are experts in finding software requirements which cannot be solved the standard way ;-)

    Your solution only works "half". It works fine but not if I click too fast. I guess thats a double click.

    because I did not find the TreeEvent Model für Chechbox-Click in the ExtJS API I tried it blind with:

      var onAfterRender = function (tree) {
            tree.eventModel.onCheckboxClick = tree.eventModel.onCheckboxClick.createInterceptor(
                function (e, node) {
                    if (node.attributes.childcount > 2000) {
                        e.stopEvent(); // to prevent checking on html level
                        return false; // to prevent check changing logic
                    }
                }
            );
                tree.eventModel.onCheckboxDoubleClick = tree.eventModel.onCheckboxDoubleClick.createInterceptor(
                function (e, node) {
                    if (node.attributes.childcount > 2000) {
                        e.stopEvent(); // to prevent checking on html level
                        return false; // to prevent check changing logic
                    }
                }
            );
        }

    But this also does not work.
    Any idea?

    And where can I find more infrmations about the various vents of tree.eventModel in the ExtJS API?

    Another "MUST-Have" is that I can set the style for disabled comboboxes to the disabled-style.
    Otherwise users won´t understand that these checkboxes are not selectable.




    Regards,

    Martin
  4. #4
    Jun 01, 2011, 11:42 AM
    Ext.tree.TreeEventModel is not in API, it's private.

    I'd suggest you to investigate its sources to get a solution for double click.

    Another "MUST-Have" is that I can set the style for disabled comboboxes to the disabled-style.
    Otherwise users won´t understand that these checkboxes are not selectable.
    Yes, I'm trying to find a good 'moment' in the tree events structure to make it disabled. 'Render' event for a tree node would be great.

    I hope the TreePanel has more various API in ExtJS 4 (didn't investigate yet) and will have in Ext.Net 2.
  5. #5
    Jun 01, 2011, 12:02 PM
    Hi,

    thanks for your help.
    I solved my problem in another way now.

    My TreeNode provider now checks for children and sets ThreeStateBool.Undefined for node.Checked.

    Thats not really disabled but fits me needs too :)


    Regards,

    Martin
  6. #6
    Jun 01, 2011, 1:37 PM
    Great, I didn't think that you can just 'remove' checkbox:)

    I am not that surprised. Customers and colleagues here are experts in finding software requirements which cannot be solved the standard way ;-)
    Oh, yes:)

    Marking as closed.
  7. #7
    Nov 07, 2013, 9:37 PM
    Here is the related thread for Ext.NET 2.x: http://forums.ext.net/showthread.php?27146

Similar Threads

  1. [CLOSED] Disabling checkbox grid column cell based on data.
    By SymSure in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Aug 09, 2012, 4:25 AM
  2. [CLOSED] Disabling ViewState
    By SouthDeveloper in forum 1.x Legacy Premium Help
    Replies: 9
    Last Post: Apr 04, 2012, 2:33 PM
  3. [CLOSED] tree.setChecked is creating checkboxes
    By SouthDeveloper in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Jul 07, 2011, 10:25 AM
  4. Disabling Panels
    By Dominik in forum 1.x Help
    Replies: 5
    Last Post: May 13, 2011, 1:18 PM
  5. [CLOSED] disabling nodeload
    By ewgoforth in forum 1.x Legacy Premium Help
    Replies: 22
    Last Post: Feb 11, 2011, 2:46 PM

Tags for this Thread

Posting Permissions