Exporting to PDF, XLS, XLSX, CSV and RTF

The Card View control allows you to export Card View data with ease. Data can be exported to a file or stream in the following formats:

  • PDF (WritePdf, WritePdfToResponse)
  • XLS (WriteXls, WriteXlsToResponse)
  • XLSX (WriteXlsx, WriteXlsxToResponse)
  • RTF (WriteRtf, WriteRtfToResponse)
  • CSV (WriteCsv, WriteCsvToResponse)
Export To:

Chai
Beverages
Exotic Liquids
10 boxes x 20 bags
$18.00
Chang
Beverages
Exotic Liquids
24 - 12 oz bottles
$19.00
ASPXC#Copy 
<div class="form-inline">
    <div class="form-group">
        <b>Export To:</b>
        <div class="btn-group mx-sm-3" role="group" aria-label="Export Formats">
            <dx:BootstrapButton runat="server" Text="PDF" ID="ButtonPDF1" OnClick="ButtonPDF1_Click">
                <CssClasses Icon="far fa-file-pdf" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="XLS" ID="ButtonXLS1" OnClick="ButtonXLS1_Click">
                <CssClasses Icon="far fa-file-excel" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="XLSX" ID="ButtonXLSX1" OnClick="ButtonXLSX1_Click">
                <CssClasses Icon="far fa-file-excel" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="CSV" ID="ButtonCSV1" OnClick="ButtonCSV1_Click">
                <CssClasses Icon="far fa-file-alt" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="RTF" ID="ButtonRTF1" OnClick="ButtonRTF1_Click">
                <CssClasses Icon="far fa-file-word" />
            </dx:BootstrapButton>
        </div>
    </div>
</div>
<br />
<dx:BootstrapCardView ID="CardViewExport" runat="server" DataSourceID="DataSource1">
    <Columns>
        <dx:BootstrapCardViewColumn FieldName="ProductName" />
        <dx:BootstrapCardViewColumn FieldName="Category" />
        <dx:BootstrapCardViewColumn FieldName="Supplier" />
        <dx:BootstrapCardViewColumn FieldName="QuantityPerUnit" />
        <dx:BootstrapCardViewTextColumn FieldName="UnitPrice">
            <PropertiesTextEdit DisplayFormatString="c" />
        </dx:BootstrapCardViewTextColumn>
    </Columns>
    <SettingsPager ItemsPerPage="2" NumericButtonCount="6"></SettingsPager>
    <SettingsLayout CardColSpanLg="6" CardColSpanSm="12" />
</dx:BootstrapCardView>
protected void ButtonPDF1_Click(object sender, EventArgs e) {
    CardViewExport.ExportPdfToResponse();
}
protected void ButtonXLS1_Click(object sender, EventArgs e) {
    CardViewExport.ExportXlsToResponse();
}
protected void ButtonXLSX1_Click(object sender, EventArgs e) {
    CardViewExport.ExportXlsxToResponse();
}
protected void ButtonCSV1_Click(object sender, EventArgs e) {
    CardViewExport.ExportCsvToResponse();
}
protected void ButtonRTF1_Click(object sender, EventArgs e) {
    CardViewExport.ExportRtfToResponse();
}

Export Selected Records

To export only the currently selected cards, set the SettingsExport.ExportSelectedCardOnly property to true.

Export To:

Chai
Beverages
Exotic Liquids
10 boxes x 20 bags
$18.00
Chang
Beverages
Exotic Liquids
24 - 12 oz bottles
$19.00
ASPXC#Copy 
<div class="form-inline">
    <div class="form-group">
        <b>Export To:</b>
        <div class="btn-group mx-sm-3" role="group" aria-label="...">
            <dx:BootstrapButton runat="server" Text="PDF" ID="ButtonPDF3" OnClick="ButtonPDF3_Click">
	                    <CssClasses Icon="far fa-file-pdf" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="XLS" ID="ButtonXLS3" OnClick="ButtonXLS3_Click">
	                    <CssClasses Icon="far fa-file-excel" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="XLSX" ID="ButtonXLSX3" OnClick="ButtonXLSX3_Click">
	                    <CssClasses Icon="far fa-file-excel" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="CSV" ID="ButtonCSV3" OnClick="ButtonCSV3_Click">
	                    <CssClasses Icon="far fa-file-alt" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="RTF" ID="ButtonRTF3" OnClick="ButtonRTF3_Click">
	                    <CssClasses Icon="far fa-file-word" />
            </dx:BootstrapButton>
        </div>
    </div>
</div>
<br />
<dx:BootstrapCardView ID="CardViewExportSelectedRecords" runat="server" DataSourceID="DataSource3" AutoGenerateColumns="False" KeyFieldName="ProductID">
    <SettingsExport ExportSelectedCardsOnly="true"></SettingsExport>
    <Columns>
        <dx:BootstrapCardViewColumn FieldName="ProductName" />
        <dx:BootstrapCardViewColumn FieldName="Category" />
        <dx:BootstrapCardViewColumn FieldName="Supplier" />
        <dx:BootstrapCardViewColumn FieldName="QuantityPerUnit" />
        <dx:BootstrapCardViewTextColumn FieldName="UnitPrice">
            <PropertiesTextEdit DisplayFormatString="c" />
        </dx:BootstrapCardViewTextColumn>
    </Columns>
    <CardLayoutProperties>
        <Items>
            <dx:BootstrapCardViewCommandLayoutItem ShowSelectCheckbox="true" HorizontalAlign="Right" />
            <dx:BootstrapCardViewColumnLayoutItem ColumnName="ProductName" />
            <dx:BootstrapCardViewColumnLayoutItem ColumnName="Category" />
            <dx:BootstrapCardViewColumnLayoutItem ColumnName="Supplier" />
            <dx:BootstrapCardViewColumnLayoutItem ColumnName="QuantityPerUnit" />
            <dx:BootstrapCardViewColumnLayoutItem ColumnName="UnitPrice" />
        </Items>
    </CardLayoutProperties>
    <SettingsPager ItemsPerPage="2" NumericButtonCount="6"></SettingsPager>
    <SettingsLayout CardColSpanLg="6" CardColSpanSm="12" />
</dx:BootstrapCardView>
protected void ButtonRTF3_Click(object sender, EventArgs e) {
    CardViewExportSelectedRecords.ExportRtfToResponse();
}
protected void ButtonCSV3_Click(object sender, EventArgs e) {
    CardViewExportSelectedRecords.ExportCsvToResponse();
}
protected void ButtonXLSX3_Click(object sender, EventArgs e) {
    CardViewExportSelectedRecords.ExportXlsxToResponse();
}
protected void ButtonXLS3_Click(object sender, EventArgs e) {
    CardViewExportSelectedRecords.ExportXlsToResponse();
}
protected void ButtonPDF3_Click(object sender, EventArgs e) {
    CardViewExportSelectedRecords.ExportPdfToResponse();
}

Export with Format Conditions

When data is exported to a PDF or RTF file, the Card View maintains the style settings applied to the cells (with the exception of images). Moreover, when you export data to Excel formats (XLS and XLSX), the format conditions are transformed to corresponding Excel conditional formatting rules. Therefore, you can manage the rules in Excel after export.

Export To:

Vins et alcools Chevalier
$14.00
0%
12
$168.00
Vins et alcools Chevalier
$10.00
0%
10
$100.00
ASPXC#Copy 
<div class="form-inline">
    <div class="form-group">
        <b>Export To:</b>
        <div class="btn-group mx-sm-3" role="group" aria-label="Export Formats">
            <dx:BootstrapButton runat="server" Text="PDF" ID="ButtonPDF4" OnClick="ButtonPDF4_Click">
                <CssClasses Icon="far fa-file-pdf" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="XLS" ID="ButtonXLS4" OnClick="ButtonXLS4_Click">
                <CssClasses Icon="far fa-file-excel" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="XLSX" ID="ButtonXLSX4" OnClick="ButtonXLSX4_Click">
                <CssClasses Icon="far fa-file-excel" />
            </dx:BootstrapButton>
            <dx:BootstrapButton runat="server" Text="RTF" ID="ButtonRTF4" OnClick="ButtonRTF4_Click">
                <CssClasses Icon="far fa-file-word" />
            </dx:BootstrapButton>
        </div>
    </div>
</div>
<br />
<dx:BootstrapCardView ID="CardViewExportWithFormatConditions" runat="server" DataSourceID="DataSource4" KeyFieldName="OrderID;ProductID">
    <Columns>
        <dx:BootstrapCardViewColumn FieldName="CompanyName" Width="260px" />
        <dx:BootstrapCardViewTextColumn FieldName="UnitPrice">
            <PropertiesTextEdit DisplayFormatString="c" />
        </dx:BootstrapCardViewTextColumn>
        <dx:BootstrapCardViewSpinEditColumn FieldName="Discount" Settings-FilterMode="Value">
            <PropertiesSpinEdit DisplayFormatString="p0" />
        </dx:BootstrapCardViewSpinEditColumn>
        <dx:BootstrapCardViewColumn FieldName="Quantity" />
        <dx:BootstrapCardViewTextColumn FieldName="Total" UnboundType="Decimal" UnboundExpression="UnitPrice * Quantity * (1 - Discount)">
            <PropertiesTextEdit DisplayFormatString="c" />
        </dx:BootstrapCardViewTextColumn>
    </Columns>
    <FormatConditions>
        <dx:CardViewFormatConditionTopBottom FieldName="UnitPrice" Rule="AboveAverage" Format="ItalicText" />
        <dx:CardViewFormatConditionTopBottom FieldName="UnitPrice" Rule="AboveAverage" Format="RedText" />
        <dx:CardViewFormatConditionTopBottom FieldName="Discount" Rule="TopItems" Threshold="15" Format="BoldText" />
        <dx:CardViewFormatConditionHighlight FieldName="Discount" Expression="[Discount] > 0" Format="GreenFillWithDarkGreenText" />
        <dx:CardViewFormatConditionColorScale FieldName="Quantity" Format="GreenWhite" />
        <dx:CardViewFormatConditionIconSet FieldName="Quantity" Format="Ratings4" />
        <dx:CardViewFormatConditionTopBottom FieldName="Total" Rule="TopPercent" Threshold="20" Format="Custom">
            <LayoutItemStyle Font-Bold="true" ForeColor="#9c0006" />
        </dx:CardViewFormatConditionTopBottom>
    </FormatConditions>
    <SettingsPager ItemsPerPage="2" NumericButtonCount="6"></SettingsPager>
    <SettingsLayout CardColSpanLg="6" CardColSpanSm="12" />
</dx:BootstrapCardView>
protected void ButtonPDF4_Click(object sender, EventArgs e) {
    CardViewExportWithFormatConditions.ExportPdfToResponse();
}
protected void ButtonXLS4_Click(object sender, EventArgs e) {
    CardViewExportWithFormatConditions.ExportXlsToResponse();
}
protected void ButtonXLSX4_Click(object sender, EventArgs e) {
    CardViewExportWithFormatConditions.ExportXlsxToResponse();
}
protected void ButtonRTF4_Click(object sender, EventArgs e) {
    CardViewExportWithFormatConditions.ExportRtfToResponse();
}
Screen Size
Color Themes
Demo QR Code