client side Export to Excel and Scrolling

[Paul]

I am trying to use a hyperlink to initiate an export to excel and can't locate the code to do this.  I would prefer not posting the page. 

I am also trying to use a hyperlink to convert the grid to allow scrolling with a frozen header row.  Again, I would like to do this client side and not post the page back to the server.  Is this possible?  If not, what is the process for implementing this with a postback? 

I am using the latest build of the AJAX Controls (2012.1.411.35) and trying to do this for all browsers.  My language preference is C#.

<div class="ProfileGridHeader" >
    <asp:HyperLink ID="ExcelExportLink" runat="server" CssClass="excel" NavigateUrl="javascript:void(0);" >Export to Excel</asp:HyperLink>
    <asp:HyperLink ID="FreezeHeaderLink" runat="server" CssClass="lock" NavigateUrl="javascript:void(0);" >Unlock Table Headers</asp:HyperLink>
</div><br /><br />
<div>
    <telerik:RadGrid ID="ActivityGrid" runat="server" ShowFooter="True"  >
        <MasterTableView CssClass="last grid" TableLayout="Fixed" Width="100%">
            <Columns>
                <telerik:GridBoundColumn HeaderText="Account"
                                         FooterText="Total"
                                         DataField="AccountIDField"
                                         HeaderStyle-CssClass="first"
                                         ItemStyle-CssClass="first"
                                         FooterStyle-CssClass="gridfooter"/>

                <telerik:GridBoundColumn HeaderText="Date"
                                         DataField="dateField"
                                         DataFormatString="{0:MM/dd/yyyy}"
                                         ItemStyle-CssClass="date"
                                         FooterStyle-CssClass="gridfooter"/>

                <telerik:GridBoundColumn HeaderText="Category"
                                         DataField="categoryField"
                                         FooterStyle-CssClass="gridfooter"/>

                <telerik:GridBoundColumn HeaderText="Activity Type"
                                         DataField="typeField"
                                         FooterStyle-CssClass="gridfooter"/>

                <telerik:GridBoundColumn HeaderText="Description"
                                         DataField="descriptionField"
                                         FooterStyle-CssClass="gridfooter"/>

                <telerik:GridBoundColumn HeaderText="Quantity"
                                         DataField="quantityField"
                                         DataFormatString="{0:#,##0.0000;(#,##0.0000)}"
                                         ItemStyle-CssClass="numeric"
                                         FooterStyle-CssClass="gridfooter"/>

                <telerik:GridBoundColumn HeaderText="Price"
                                         DataField="priceField"
                                         DataFormatString="{0:$#,##0.000;$(#,##0.000)}"
                                         ItemStyle-CssClass="numeric"
                                         FooterStyle-CssClass="gridfooter"/>

                <telerik:GridBoundColumn Aggregate="Sum"
                                         HeaderText="Amount"
                                         DataField="amountField"
                                         DataFormatString="{0:$#,##0.00;$(#,##0.00)}"
                                         ItemStyle-CssClass="numeric"
                                         FooterStyle-CssClass="numeric"/>

                <telerik:GridBoundColumn HeaderText="Additional Detail"
                                         DataField="additionalDetailField"
                                         HeaderStyle-CssClass="last"
                                         ItemStyle-CssClass="last"
                                         FooterStyle-CssClass="gridfooter"/>

            </Columns>
        </MasterTableView>
    </telerik:RadGrid>
</div>

[Eyup]

Hi Paul,

I am afraid the desired scenario is not achievable without posting the page back to the server. Performing export operation requires the grid to prepare additional information, which is available only on postbacks.

Generally, RadGrid UseStaticHeaders property also needs a postback or asynchronous request in order to apply. You can ajaxify the headers linkbutton by adding it as an ajax initiator in RadAjaxManager settings and then adding "ActivityGrid" as an updated control.

One possible approach to achieve your desired behavior is to use standard asp:LinkButtons as shown below:
mark-up:

<asp:LinkButton ID="LinkButton1" runat="server" OnClientClick="exportClicked()">Export to Excel</asp:LinkButton>
    <asp:LinkButton ID="LinkButton2" runat="server" OnClick="LinkButton1_Click">Lock/Unlock Table Headers</asp:LinkButton>

javascript:

function exportClicked(sender, args) {
  var masterTable = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
  masterTable.fireCommand("ExportToExcel", "");
}

C#:

protected void LinkButton1_Click(object sender, EventArgs e)
  {
      RadGrid1.ClientSettings.Scrolling.UseStaticHeaders = !RadGrid1.ClientSettings.Scrolling.UseStaticHeaders;
  }

If you insist on using Hyperlinks, you could try:

<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="javascript:exportClicked()">Export to Excel</asp:HyperLink>

Since the Hyperlink does not have an OnClick event, you will need to use another approach to pass the command from client-side to the server. For example this could be achieved using a HiddenField.

Please keep in mind that if you are ajaxifying your grid, you will need to conditionally disable Ajax to enable exporting. The reasons for this requirement, as well as a regarding example, are provided in this article:
Export from Ajaxified Grid
 Exporting  Demo

All the best,
Eyup
the Telerik team