Set focus on Checkbox inside radgrid in clientside

8 posts, 1 answers
  1. Abhi
    Abhi avatar
    15 posts
    Member since:
    Sep 2012

    Posted 25 Aug 2012 Link to this post

    Hi all,
    I want to set focus on a checkbox in header row of a radgrid after showing a warning. I want o achieve this in callback function. Please help me.
    Thanks
    abhi
  2. Eyup
    Admin
    Eyup avatar
    3015 posts

    Posted 29 Aug 2012 Link to this post

    Hi Abhilash,

    I have created a sample RadGrid web site to demonstrate how you could achieve the requested functionality. Please check out the attached application and let me know if it helps you.

    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Abhi
    Abhi avatar
    15 posts
    Member since:
    Sep 2012

    Posted 03 Sep 2012 Link to this post

    Thanks Eyup. But my radgrid is not in that format. Can you tell me how i can achieve the same in following code snippet.
     <div class="gridTableWrap-S">
                            <telerik:RadGrid ID="rgType" runat="server" CellSpacing="0" GridLines="None" AutoGenerateColumns="False"
                                Height="250px" OnItemDataBound="rgType_ItemDataBound" TabIndex="10">
                                <ClientSettings>
                                    <Scrolling AllowScroll="true" UseStaticHeaders="true" />
                                </ClientSettings>
                                <MasterTableView DataKeyNames="ID" ClientDataKeyNames="ID">
                                    <CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings>
                                    <RowIndicatorColumn Visible="True" FilterControlAltText="Filter RowIndicator column">
                                        <HeaderStyle Width="20px"></HeaderStyle>
                                    </RowIndicatorColumn>
                                    <ExpandCollapseColumn Visible="True" FilterControlAltText="Filter ExpandColumn column">
                                        <HeaderStyle Width="20px"></HeaderStyle>
                                    </ExpandCollapseColumn>
                                    <Columns>
                                    
                                        <telerik:GridTemplateColumn DataField="ACTIVE" FilterControlAltText="Filter TemplateColumn column"
                                            UniqueName="chekBoxCol">
                                            <HeaderTemplate>
                                                <asp:CheckBox ID="chkSelectAllType" runat="server" OnCheckedChanged="ToggleSelectedType"
                                                    AutoPostBack="True" />
                                                <asp:Label ID="requiredCode" runat="server" CssClass="stardrop">*</asp:Label>
                                            </HeaderTemplate>
                                            <HeaderStyle Width="55px" HorizontalAlign="Center" />
                                            <ItemStyle HorizontalAlign="Center" />
                                            <ItemTemplate>
                                                <asp:CheckBox ID="chkIsactiveType" runat="server" OnCheckedChanged="ToggleRowSelectionType"
                                                    AutoPostBack="True" Checked='<%# Convert.ToBoolean(Eval("ACTIVE")) %>' />
                                                &nbsp;
                                            </ItemTemplate>
                                        </telerik:GridTemplateColumn>
                                        <telerik:GridBoundColumn DataField="TYPE_NAME" FilterControlAltText="Filter Type column"
                                            HeaderText="<%$ Resources:Resource1, colType %>" UniqueName="NAME">
                                        </telerik:GridBoundColumn>
                                    </Columns>
                                    <EditFormSettings>
                                        <EditColumn FilterControlAltText="Filter EditCommandColumn column">
                                        </EditColumn>
                                    </EditFormSettings>
                                    <HeaderStyle VerticalAlign="Middle" />
                                </MasterTableView>
                                <FilterMenu EnableImageSprites="False">
                                </FilterMenu>
                            </telerik:RadGrid>
                        </div>

    I want to set focus on chkSelectAllType.
    Thanks
    Abhi
  5. Jayesh Goyani
    Jayesh Goyani avatar
    2732 posts
    Member since:
    May 2010

    Posted 03 Sep 2012 Link to this post

    Hello,

    In which event you want to setfocus on header checkbox ??

    Thanks.
    Jayesh Goyani
  6. Abhi
    Abhi avatar
    15 posts
    Member since:
    Sep 2012

    Posted 03 Sep 2012 Link to this post

    I want o achieve this in callback function of RadAlert.

    Thanks
    Abhi
  7. Abhi
    Abhi avatar
    15 posts
    Member since:
    Sep 2012

    Posted 03 Sep 2012 Link to this post

    Thank you Eyup. Your solution is not working in IE . I am getting following error.
    Webpage error details

    User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729)
    Timestamp: Mon, 3 Sep 2012 06:27:09 UTC


    Message: Object doesn't support this property or method
     


  8. Answer
    Jayesh Goyani
    Jayesh Goyani avatar
    2732 posts
    Member since:
    May 2010

    Posted 03 Sep 2012 Link to this post

    Hello,

    <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" OnItemDataBound="RadGrid1_ItemDataBound"
               OnNeedDataSource="RadGrid1_NeedDataSource" AllowPaging="true" PageSize="2">
               <MasterTableView Name="Parent" DataKeyNames="ID">
                   <Columns>
                       <telerik:GridBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID">
                       </telerik:GridBoundColumn>
                       <telerik:GridBoundColumn DataField="Name" UniqueName="Name" HeaderText="Name">
                       </telerik:GridBoundColumn>
                       <telerik:GridTemplateColumn DataField="ACTIVE" FilterControlAltText="Filter TemplateColumn column"
                           UniqueName="chekBoxCol">
                           <HeaderTemplate>
                               <asp:CheckBox ID="chkSelectAllType" runat="server" />
                           </HeaderTemplate>
                           <ItemTemplate>
                               <asp:CheckBox ID="chkIsactiveType" runat="server" onclick="radalert('Radalert is called from the client!', 330, 100,'Client RadAlert', alertCallBackFn,null);" />
                           </ItemTemplate>
                       </telerik:GridTemplateColumn>
                       <telerik:GridEditCommandColumn>
                       </telerik:GridEditCommandColumn>
                   </Columns>
               </MasterTableView>
           </telerik:RadGrid>
    function alertCallBackFn(arg) {
                    
                   if (arg == true) {
                       var checkBoxes = $("input[id*='chkSelectAllType']");
                       if (checkBoxes.length > 0) {
                           checkBoxes.get(0).checked = true;
                       }
                        
                   }
               }
    protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
       {
           dynamic data = new[] {
                   new { ID = 1, Name ="Name1",path="1.jpg"},
                   new { ID = 2, Name = "Name2",path="2.jpg"},
                   new { ID = 3, Name = "Name3",path="3.jpg"},
                    new { ID = 4, Name = "Name4",path="2.jpg"},
                   new { ID = 5, Name = "Name5",path="3.jpg"}
               };
           RadGrid1.DataSource = data;
       }



    Please do not forget to add jquery in your page.

    Thanks,
    Jayesh Goyani
  9. Abhi
    Abhi avatar
    15 posts
    Member since:
    Sep 2012

    Posted 03 Sep 2012 Link to this post

    Thank you Jayesh, Your solution cured my head ache.

    Thanks
    Abhi
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017