0

私の質問は、SSRS レポートからのハイパーリンクがクリックされたときに Web ページ全体を更新せずに URL を変更する方法はありますか?

ここに示されているSSRSレポートRDLCでハイパーリンクの2つの異なる実装を試しました： SSRS：SQLサービスレポートでハイパーリンクを表示する方法

第 1 の方法のテキストボックス のプロパティ > アクション ウィンドウ > URL ラジオ ボタンに移動 > 選択した URL: http:// localhost:(ポート)/#/Path/ViewDetails

第 2 の方法 プレースホルダーを作成する > 右クリック > プレースホルダー プロパティ > 一般ペイン > マークアップ タイプ: HTML - スタイルで HTML タグを解釈する > 値: ="< a href="http:// localhost:(port)/#/Path/ViewDetails ">詳細を表示</a>"

AngularJS を使用し、SSRS Report Viewer のローカル処理モードを実装した MVC プロジェクトがあります。Report Viewer は ASPX ページ (MVC.ViewPage) に実装されました。

ReportViewer.aspx

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<SampleProject.Models.ReportInfo>" %>
<%@ Register Assembly="Microsoft.ReportViewer.WebForms, Version=11.0.0.0, Culture=neutral, PublicKeyToken=89845dcd8080cc91" Namespace="Microsoft.Reporting.WebForms" TagPrefix="rsweb" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head id="Head1" runat="server">
    <title></title>
  </head>
  <body>
    <form id="form1" runat="server">
      <asp:ScriptManager ID="scriptManager" runat="server" ScriptMode="Release"></asp:ScriptManager>
      <rsweb:ReportViewer ID="ReportViewer" runat="server"
            SizeToReportContent="true" AsyncRendering="false" Visible="true"
            ProcessingMode="Local" EnableViewState="true"
            InternalBorderStyle="None" BorderStyle="None" InternalBorderWidth="0"
            KeepSessionAlive="false" >
      </rsweb:ReportViewer>
    </form>
    <script runat="server">
       override protected void OnInit(EventArgs e){
          // some report viewer initialization here
          // some datasource data population code here
       }
    </script>

この ASPX ページを MVC 部分ビューの IFrame にロードします。

ViewDetail.cshtml

<div>
  <iframe src="{{report.viewDetailPath}}"></iframe>
</div>

viewDetail.js (AngularJS コントローラー)

angular.module('project').controller("ViewDetailCtrl", function($scope){
  $scope.report = {
                     id: // some guid,
                     viewDetailPath: '/Reports/ReportViewer';
                  }
}

「View Detail」というハイパーリンクを含む RDLC レポートがあります。

アプリをシングル ページ アプリケーションのように動作させたい。レポートから [View Detail] リンクをクリックすると、ページ全体が更新されるのではなく、URL のみが変更され、AngularJS コントローラーから JavaScript メソッドが実行されます。

シングルページアプリケーションのように見せるために、AngularJS の $routeProvider も実装しました。

app.js

project.config(function($routeProvider){
  $routeProvider.
     when('/', {template: 'NYI'}).
     when('/Path/ViewDetails', {controller: 'ViewDetailCtrl', templateUrl: '/Reports/ViewDetail'}).
     otherwise({redirectTo: '/'});
});

ReportsController.cs(MVC コントローラー)

public PartialViewResult ViewDetail(){
  return PartialView("~/Views/Reports/ViewDetail.cshtml");
}

public ActionResult ReportViewer(){
  return View("~/Views/Reports/ReportViewer.aspx", new ReportInfo());
}

アプリケーションを単一ページ アプリのようにする $routeProvider は、SSRS レポートのハイパーリンクが URL を変更したときに機能しません。

4

2 に答える 2

0

問題のリンクに「onclick」イベント ハンドラをアタッチする必要があります。この onclick ハンドラーは、クリックを防ぐことができますが、代わりに、angular の $location.update 関数を使用して (または新しいバージョンでは $window.location.href を設定して)、URL を変更します。

URL の操作方法に関する angular のドキュメントは次のとおりです: http://docs.angularjs.org/guide/dev_guide.services .$location

このようなイベント ハンドラーの非常に簡単な例と、それをリンクにアタッチする方法を次に示します。代わりに (ループを使用して) getElementsByClassname のようなものを使用するか、複雑なセレクターを使用する必要がある場合があります。

function linkclick(e) {
    alert(e.target);
    e.preventDefault();
}
document.getElementById('testid').onclick = linkclick;

ここで動作することを確認してください。クリックされた URL を警告するだけで、ブラウザがその URL を開くのを防ぎます: http://jsfiddle.net/eJBfn/

于 2013-09-26T03:21:09.300 に答える