This is a migrated thread and some comments may be shown as answers.

client side Export to Excel and Scrolling

1 Answer 158 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Paul
Top achievements
Rank 1
Paul asked on 08 May 2012, 02:52 PM
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>

1 Answer, 1 is accepted

Sort by
0
Eyup
Telerik team
answered on 11 May 2012, 09:41 AM
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
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.
Tags
Grid
Asked by
Paul
Top achievements
Rank 1
Answers by
Eyup
Telerik team
Share this question
or