原創|使用教程|編輯:我只采一朵|2017-12-20 10:55:20.000|閱讀 222 次
概述:在本文中,我們將介紹如何創建交互式Web報表。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
在本文中,我們將介紹如何創建交互式Web報表。這種報表允許你使用超鏈接導航到詳細報表或其他頁面,極大地增加了報表工作的便利性。畢竟,根據主報表的上下文查看詳細信息要比手動查找這些信息要方便得多。
首先,我們需要創建一個報表。我們將顯示產品類別的列表。當你點擊某個類別時,將會生成一個包含所選類別產品列表的詳細報表。
也就是說,基礎報表其實是一個類別的列表。創建一個報表模板。我使用提供的xml數據庫。類別表單:
創建以下模板:
我將Columns>Count屬性設置為2。現在數據將分成兩列顯示,分別是類別名稱和圖片。
我們的目標是顯示該類別的產品的詳細清單。所以現在我們創建一個詳細報表來顯示產品列表。
創建一個新的報表。在同一個數據庫中,選擇產品和類別表單。我們將這兩個表單鏈接到CategoryID字段:
并創建一個報表模板:
要顯示所需類別的產品,你需要對其進行過濾。要做到這一點,我們將使用CategoryID字段。你必須將參數(類別ID)從第一個報表傳遞給第二個報表。為此,請創建一個報表參數 - 類別。數據類型為字符串。
現在為數據帶創建一個過濾器。雙擊帶區并選擇“過濾器”選項卡:
在過濾器表達式中,只需檢查CategoryID字段與Category參數值的相等性即可。保存報表。
現在回到帶有類別的第一個報表。
要轉到詳細報表,你需要為CategoryName字段創建一個超鏈接。
我們選擇“數據”帶區上的Categories.CategoryName字段。在屬性查看器中找到“超鏈接”屬性并打開“超鏈接”編輯器。選擇標簽“詳細報表”:
這里我們選擇之前創建的詳細報表。接下來,選擇我們將要從主報表中傳遞值的類別報表參數。最后,我們指定從哪個表達式中獲取類別參數的值。該表達式是類別表單中的CategoryID字段。在窗體的底部,啟用“更改對象的外觀,使其看起來像一個鏈接”復選框。
就這樣,保存報表。現在我們有一個帶有類別的主報表,一個帶有產品的詳細報表。
創建一個ASP.Net MVC項目。
我們將庫(FastReport.dll和FastReport.Web.dll)連接到項目。
將報表放在主頁上。我們將使用HomeController類中的WebReport組件(來自Controllers文件夾)。
添加庫:
using FastReport.Web; using System.Web.UI.WebControls;
在Index()
方法中,添加以下代碼:
public ActionResult Index() { WebReport webReport = new WebReport(); //create instance of WebReport object. string report_path = "J:\\Program Files (x86)\\FastReports\\FastReport.Net\\Demos\\Reports\\"; //reports directory System.Data.DataSet dataSet = new System.Data.DataSet(); //create data set dataSet.ReadXml(report_path + "nwind.xml"); //load xml data base webReport.Report.RegisterData(dataSet, "NorthWind"); //registry data source in the web report webReport.Report.Load(report_path + "Simple Interactive.frx"); //load the report to WebReport ViewBag.WebReport = webReport; //send the report to View return View(); }
我們來看看Index.cshtml視圖:
我刪除了所有默認的代碼,并添加了我自己的代碼。它將只顯示頁面標題和網頁報表:
@{ ViewBag.Title = "Home Page"; } @ViewBag.WebReport.GetHtml()
HomeController的Index方法會將報表發送到Index視圖。
在文件_Layout.cshtml中,你需要連接腳本:
<head> @WebReportGlobals.Scripts() @WebReportGlobals.Styles() </head>
現在你需要對兩個Web配置進行更改。這些文件的命名是相同的,但它們位于不同的文件夾中。第一個位于Views文件夾中。我們加入:
<namespaces> … <add namespace="FastReport" /> <add namespace="FastReport.Web" /> </namespaces>
第二個文件位于項目的根目錄下。在其中我們添加一個處理句柄:
<system.webServer> <handlers> … <add name="FastReportHandler" path="FastReport.Export.axd" verb="*" type="FastReport.Web.Handlers.WebExport"/> </handlers> </system.webServer>
就這樣!運行應用程序。
我們帶有類別的主報表。選擇其中任何一個。
它會顯示詳細報表。請注意,工具欄上出現了一個新的選項卡。你可以使用Simple Interactive選項卡切換到主報表。
就像這樣,我們可以使用Web上流行的在線報告,以及桌面應用程序。
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn