How to disable AllowRowSelect in DetailTable?

6 posts, 0 answers
  1. Lenny_shp
    Lenny_shp avatar
    343 posts
    Member since:
    Jul 2006

    Posted 22 Apr 2010 Link to this post

    2009.3.1210.35



    DetailTables does not have ClientSettings.
    In Master table I have these two defined to true but I want them false in the Detail Table.

    Selecting-AllowRowSelect="false" EnableRowHoverStyle="false"

    Please advise, thanks.
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 23 Apr 2010 Link to this post

    Hello Lenny,

    You can disallow row selection for the detailtable by adding following code in RowSelecting event. Hope the following example will help you.

    ASPX:

     
            <telerik:RadGrid ID="RadGrid1" TabIndex="1" ShowGroupPanel="True" AllowMultiRowSelection="true"  
                ShowStatusBar="true" runat="server" DataSourceID="SqlDataSource1" AutoGenerateColumns="False">  
                <MasterTableView TableLayout="Fixed" AllowMultiColumnSorting="True" CommandItemDisplay="Top"  
                    DataKeyNames="CustomerID" DataSourceID="SqlDataSource1" Width="100%" Name="Master" >  
                    <DetailTables>  
                        <telerik:GridTableView Caption="Detail Table" DataKeyNames="OrderID" NoDetailRecordsText=""  
                            Name="Detail" DataSourceID="SqlDataSource2" CommandItemDisplay="Top" Width="100%"  
                            runat="server">  
                            <ParentTableRelation>  
                                <telerik:GridRelationFields DetailKeyField="CustomerID" MasterKeyField="CustomerID" />  
                            </ParentTableRelation>                      
                            <Columns>  
                              . . .  
                            </Columns>                      
                        </telerik:GridTableView>  
                    </DetailTables>              
                    <Columns>  
                      . . .  
                    </Columns>                
                </MasterTableView>  
                <ClientSettings>  
                    <Selecting AllowRowSelect="true" />  
                    <ClientEvents RowSelecting="RowSelecting" />  
                </ClientSettings>  
         </telerik:RadGrid> 

    JavaScript:

    <script type="text/javascript"
        function RowSelecting(sender, args) { 
            if (args.get_tableView().get_name() != "Master") { 
                args.set_cancel(true); 
                alert("Cannot Select"); 
            } 
        } 
    </script> 

    Regards,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Lenny_shp
    Lenny_shp avatar
    343 posts
    Member since:
    Jul 2006

    Posted 23 Apr 2010 Link to this post

    2009.3.1210.35
    RowSelecting
    works for you without the On prefix?

    <ClientEvents RowSelecting="RowSelecting" /> 

    Similiar issue here, what's the way to disable RowHover in detail table?
    EnableRowHoverStyle="true"
  5. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 26 Apr 2010 Link to this post

    Hi Lenny,

     RowSelecting ClietEvent in ClientSettings won't work without On Prefix. That was a mistake happened while I copied the code.
     <ClientEvents OnRowSelecting="RowSelecting" /> 

     Checkout the following example for disabling RowHover for detail table. You could attach the client events in the  'ClientSettings->ClientEvents' section of the grid markup as shown below:
     
    ASPX:
              
                 <
    ClientSettings EnableRowHoverStyle="true"
                        <ClientEvents OnRowMouseOver="RowMouseOver" /> 
                </ClientSettings> 

    Here is the client code for setting the style in  'OnRowMouseOver'.

    Javascript:
     
    function
     RowMouseOver(sender, eventArgs) { 
            // 'Order' is the DetailTable name 
            if (eventArgs.get_tableView().get_name() == "Order") { 
                var className = $get(eventArgs.get_id()).className
                 
                //Checking for row type 
                if (className.match("Alt")) // Alternative Row 
                    $get(eventArgs.get_id()).className = "MyAltClass"
                else 
                    $get(eventArgs.get_id()).className = "MyClass"
            } 
        } 

    CSS:
     
    <style type=
    "text/css"
          
            .MyClass 
            { 
                padding-left7px !important; 
                padding-right7px !important; 
                border-stylesolid !important; 
                border-width: 0 !important; 
                border-bottom-width1px !important; 
                padding-top4px !important; 
                padding-bottom3px !important; 
                border#f7f7f7 !important; 
                background#f7f7f7 !importan 
            } 
            .MyAltClass 
            { 
                padding-left7px !important; 
                padding-right7px !important; 
                border-stylesolid !important; 
                border-width: 0 !important; 
                border-bottom-width1px !important; 
                padding-top4px !important; 
                padding-bottom3px !important; 
                border#f2f2f2 !important; 
                background#f2f2f2 !important; 
            } 
    </style> 

    Regards
    Shinu.
  6. SWAT
    SWAT avatar
    12 posts
    Member since:
    Dec 2008

    Posted 09 Oct 2012 Link to this post

    Hello, first i want to say that i was not interested in the hover issue, only in the click. 
    so, i've used the suggested solution and although it works it is not perfect.
    the problem is that even if the row in the detailed grid does not get selected- it de-select any selected row in the master grid!

    is there anyway to prevent it? 

    Thanks,
    ilan.
  7. Eyup
    Admin
    Eyup avatar
    3005 posts

    Posted 12 Oct 2012 Link to this post

    Hi Ilan,

    Could you please try the following approach/?
    <ClientEvents OnRowSelecting="rowSelecting" OnRowDeselecting="rowDeselecting" OnRowClick="rowClicked" />
      JavaScript:
    var isDetail = false;
    function rowClicked(sender, args) {
        if (args.get_tableView().get_name() != "Master") {
            isDetail = true;
        }
    }
    function rowDeselecting(sender, args) {
        if (isDetail) {
            args.set_cancel(true);
            isDetail = false;
        }
    }
    function rowSelecting(sender, args) {
        if (isDetail) {
            args.set_cancel(true);
        }
    }

    I hope this will prove helpful. Please give it a try and let me know about the result.

    Regards,
    Eyup
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017