如何創建交互式網頁報表（詳細信息頁面）
在之前的文章中，我們考慮了如何創建一個包含詳細報表的交互式報表。本質上，我們其實是創建了兩個報表，其中一個指向另一個。
但是，這一切還可以變得更簡單，你可以不必為詳細信息創建單獨的報表。你可以在主報表的一個單獨頁面上做詳細的報表。我們來看看如何做到這一點。
創建一個報表。至于數據源，我使用的是FastReport.Net的xml數據庫，類別和產品。
創建表格之間的關聯：
在數據窗口中，你可以看到一個新的關聯：
現在將這些字段放在數據帶上：
如你所見，我們放置了兩個字段：CategoryName和Picture。在數據帶區中將Columns-> Count屬性設置為2。
添加一個新的報表頁面。其中，我們將在其中創建一個詳細信息報表 - 產品清單。報表模板非常簡單：
現在你需要處理產品清單的過濾。我們將按類別名稱進行過濾，把類別名稱從第一頁轉移到第二頁。為此，請在第二頁中創建一個報表參數：
現在，雙擊打開數據帶區編輯器。打開過濾選項卡：
在過濾器表達式中，我們使用了關聯的類別表中的CategoryName字段。
轉到報表的第一頁。我們點擊數據帶區的Categories.CategoryName字段。在屬性查看器中，我們找到超鏈接。然后打開超鏈接編輯器：
選擇“詳細報表頁面”標簽。這里我們選擇：報表第二頁，參數“類別”。對于參數的值，請設置表達式：[Categories.CategoryName]
在窗體底部啟用“修改對象的外觀，使其看起來像一個可點擊的鏈接”選項。
報表已經就緒。我們保存它，然后進入第二階段。
在第二階段，我確定創建一個Web應用程序演示。現在創建一個MVC項目，添加鏈接到庫FastReport.dll和FastReport.Web.dll。
報表將被放置在網站主頁上。因此，的邏輯放置在控制器HomeController中。
添加庫：
using FastReport.Web; using System.Web.UI.WebControls;
和以下代碼：
public ActionResult Index()
{
WebReport webReport = new WebReport(); //create the inctance of WebReport object.
string report_path = "J:\\Program Files (x86)\\FastReports\\FastReport.Net\\Demos\\Reports\\"; //Reports location
System.Data.DataSet dataSet = new System.Data.DataSet(); //Create DataSet
dataSet.ReadXml(report_path + "nwind.xml"); //Load xml db into dataset
webReport.Report.RegisterData(dataSet, "NorthWind"); //register the dataset in report
webReport.Report.Load(report_path + "Simple Interactive.frx"); //load a report into WebReport
ViewBag.WebReport = webReport; //pass the report to View
return View();
}
現在我們需要在Index.cshtml視圖（文件夾Views - > Home）中顯示我們的報表。
網頁的代碼如下所示：
@{
ViewBag.Title = "Home Page";
}
@ViewBag.WebReport.GetHtml()
在最后一行中，控制器將報表傳遞給視圖進行顯示。
在文件_Layout.cshtml中，你需要連接腳本：
<head> @WebReportGlobals.Scripts() @WebReportGlobals.Styles() </head>
在位于Views文件夾中的web.config文件中添加命名空間。
<namespaces> <add namespace="FastReport" /> <add namespace="FastReport.Web" /> </namespaces>
將處理句柄添加到位于項目根目錄下的Web.config文件中：
<system.webServer> <handlers> <add name="FastReportHandler" path="FastReport.Export.axd" verb="*" type="FastReport.Web.Handlers.WebExport"/> </handlers> </system.webServer>
加載程序并查看報表：
試試點擊類別“Confections”。
就這樣我們創建了一個交互式報表，并且不必為了詳細信息而創建一個單獨的文件。
推薦閱讀
- FastReport VCL報表控件開發者手冊
- FastReport Online Designer中文手冊
- Fastreport.Net教程2016
- Fastreport.Net用戶手冊
- FastReport.Net教程2017（持續更新中···）
- FastReport Online Designer教程2017（持續更新中···）
- 報表教程2017（持續更新中···）
- FastReport.Net v2018.1版本更新已經發布！
QQ交談
在線咨詢
渝公網安備
50010702500608號
客服熱線