You must Sign In to post a response.
  • Category: JavaScript

    How to Show/Hide Button inside Gridview(Telerik Grid) in javascript or jquery??

    hi guyss...
    How to Show/Hide Button insider Gridview in javascript or jquery??
    actually i have filter in my Gridview but i want to show/hide filter property.actually it was working fine on checkbox but now new requirment is to use image button and to remove checkbox.now i have used two image buttons.now i want to make one button visible false when i click the other one.means on clicking btnShow the other button btnHide Should be visible true and btnShow should be visible false and the same case for other one below is my code thnx in advance


    <telerik:RadGrid ID="RadGrid1" CssClass="gridsetup" AllowFilteringByColumn="true" runat="server" GridLines="None" PageSize="6"
    OnDataBound="RadGrid1_DataBound" Height="195px" OnNeedDataSource="RadGrid1_NeedDataSource"
    AutoGenerateColumns="false" Skin="Office2007" EnableEmbeddedSkins="True" AllowSorting="true"
    Width="100%">
    <GroupingSettings CaseSensitive="false" />
    <HeaderContextMenu EnableEmbeddedSkins="True">
    </HeaderContextMenu>
    <MasterTableView TableLayout="Fixed" ClientDataKeyNames="ACG_ID" DataKeyNames="ACG_ID">
    <RowIndicatorColumn>
    <HeaderStyle Width="20px"></HeaderStyle>
    </RowIndicatorColumn>
    <ExpandCollapseColumn>
    <HeaderStyle Width="20px"></HeaderStyle>
    </ExpandCollapseColumn>
    <Columns>
    <telerik:GridTemplateColumn UniqueName="CheckBoxTemplateColumn">
    <HeaderStyle Width="100px" HorizontalAlign="Center" />
    <HeaderTemplate>
    <asp:ImageButton ImageUrl="~/Images/grid-accept.png" ID="btnHide" runat="server" OnClientClick="Hide(this);" ToolTip="Hide" />
    <asp:ImageButton ImageUrl="~/Images/grid-accept.png" ID="btnShow" runat="server" OnClientClick="Show(this);" ToolTip="Show" />
    <%--<asp:CheckBox ID="chk" runat="server" Checked="true" Text=" Filter" onclick="ShowHideFilter(this);" />--%>
    </HeaderTemplate>
    </telerik:GridTemplateColumn>
    <telerik:GridBoundColumn UniqueName="ACG_ID" SortExpression="ACG_ID" HeaderText="ID"
    DataField="ACG_ID" Display="false">
    <HeaderStyle></HeaderStyle>
    </telerik:GridBoundColumn>
    <telerik:GridBoundColumn UniqueName="ACG_CODE" SortExpression="ACG_CODE" HeaderText="Code"
    DataField="ACG_CODE">
    <HeaderStyle Width="15%"></HeaderStyle>
    <ItemStyle Width="15%" />
    </telerik:GridBoundColumn>


    <%--////////// Code Generation ///////--%>
    <telerik:GridBoundColumn UniqueName="ACTUALCODE" SortExpression="ACTUALCODE" HeaderText="ACTUALCODE"
    DataField="ACTUALCODE" Display="false">
    <HeaderStyle></HeaderStyle>
    </telerik:GridBoundColumn>
    <%--////////// End Code Generation ///////--%>
    </Columns>
    </MasterTableView>
    <ClientSettings>
    <Selecting AllowRowSelect="true" />
    <ClientEvents OnRowSelected="rowSelected" />
    <Scrolling AllowScroll="true" UseStaticHeaders="true"/>
    </ClientSettings>
    <FilterMenu EnableTheming="True">
    <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>
    </FilterMenu>
    </telerik:RadGrid>



    here is my javascript code


    function Show(spanChk) {

    document.getElementById('ctl00_ContentPlaceHolder1_btnShow').style.display = "none";
    document.getElementById('ctl00_ContentPlaceHolder1_btnHide').style.display = "";
    $find('<%=RadGrid1.ClientID %>').get_masterTableView().showFilterItem();



    }
    function Hide(spanChk) {

    document.getElementById('ctl00_ContentPlaceHolder1_btnHide').style.display = "none";
    document.getElementById('ctl00_ContentPlaceHolder1_btnShow').style.display = "";
    $find('<%=RadGrid1.ClientID %>').get_masterTableView().hideFilterItem();

    }
  • #760201
    Hi
    refer this link

    http://www.telerik.com/forums/hide-edit-and-delete-button-based-on-the-status-of-each-record

    http://www.ashishblog.com/nested-gridview-in-showhide-effect-using-c-net/

    http://www.c-sharpcorner.com/Blogs/9576/disable-the-link-button-link-within-rad-grid-based-on-some-c.aspx

    this is telerik official site can you search them.
    demo.telrik.com

    Name : Dotnet Developer-2015
    Email Id : kumaraspcode2009@gmail.com

    'Not by might nor by power, but by my Spirit,' says the LORD Almighty.


  • Sign In to post your comments