0

我正在尝试隐藏 SSRS 报告的工具栏。

我需要使用 JS 有一个特定的原因（报表将包含在 CRM 2011 仪表板中，我想从报表中删除工具栏。由于报表参数不起作用，我导入了报表控件解决方案，我是编辑使用 JS 的查看器）。查看器是将报表嵌入为 IFrame 的 Html 页面。生成的 Html 代码为：

<table id="reportViewer_fixedTable" cellspacing="0" cellpadding="0" style="table-layout:fixed;width:100%;height:100%;">
    <tbody>
        <tr style="background-color:#C4DDFF;"> … </tr>
        <tr id="ParametersRowreportViewer" style="display:none;"> … </tr>
        <tr style="height:6px;font-size:2pt;display:none;"> … </tr>
        <tr>

工具栏在第 4 个 tr 中，直接选择它并试图隐藏它不起作用。

navCorrectorDiv = report.contentWindow.document.getElementById('reportViewer_Toolbar');
if (navCorrectorDiv != null) {
    navCorrectorDiv.style.display = "none";
}

我应该选择我可以做的表reportViewer_fixedTable，然后选择tbody 元素，然后选择第四个tr。有没有办法做到这一点？可能没有 jQuery。

4

3 回答 3

3

案例：无 iframe

选择元素

作为 jQuery 选择器：

var selected;
selected = jQuery('#reportViewer_fixedTable');
… 
selected = jQuery('#reportViewer_fixedTable tbody');
…
selected = jQuery('#reportViewer_fixedTable tr:nth-child(4)');

隐藏选择：

selected.css('display', 'none');

或者使用没有 jQuery 的现代浏览器：

var selected;
selected = document.querySelector('#reportViewer_fixedTable');
…
selected = document.querySelector('#reportViewer_fixedTable tbody');
…
selected = document.querySelector('#reportViewer_fixedTable tr:nth-child(4)');

并隐藏：

selected.style.display = 'none';

案例：Iframe 中的内容

iframe 可能会出现问题，因为它可能是沙盒化的，或者内容可能来自不同的域。这可能会导致 XSS 违规，在您的情况下，这可能是无法修复的。

无论如何，我们开始：

//Select the first iframe (which might not be the right one in your case);
var elem = document.querySelector('iframe'); 

//And put it's body in a variable. We use the querySelector from the body 
//of the iframe.
var ibody = elem.contentWindow.document.body;

var table = ibody.querySelector('#reportViewer_fixedTable');
var tbody = ibody.querySelector('#reportViewer_fixedTable tbody');
var fourthtr = ibody.querySelector('#reportViewer_fixedTable tr:nth-child(4)');

table.style.display = 'none';
tbody.style.display = 'none';
fourthtr.style.display = 'none';
于 2013-08-20T15:24:31.203 回答
0

我想你可以通过尝试找到第n 个 Chid来做到这一点

考虑这种方法：

HTML：

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <table id="reportViewer_fixedTable" cellspacing="0" cellpadding="0" style="table-layout:fixed;width:100%;height:100%;">
    <tbody>
        <tr style="background-color:#C4DDFF;"> <td>1</td> </tr>
        <tr id="ParametersRowreportViewer" style="display:none;"><td>2</td> </tr>
        <tr style="height:6px;font-size:2pt;display:none;"> <td>3</td> </tr>
        <tr><td>FourthTR</td></tr>
    </tbody>
</table>
</body>
</html>

JS：

$(function(){
console.log( $('#reportViewer_fixedTable tbody tr:nth-child(4) td:nth-child(1)').text());


  $('#reportViewer_fixedTable tbody tr:nth-child(4) td:nth-child(1)').addClass('FourthTR');
  $('.FourthTR').hide();
});

所以，我们要做的是，我们正在抓取桌子的第 4 个 tr，然后我们正在抓取第 4 个 tr 的第一个孩子。完成后，我们将在运行中添加一个类FourthTR，然后使用jQuery.hide(). 瞧，你完成了。

请参阅此处的工作示例：http: //jsbin.com/ACam/1/edit。与往常一样，请记住run with js。

于 2013-08-20T15:50:07.743 回答
0

我认为您不需要为此使用 JavaScript

如果您可以访问 ReportViewer.aspx.cs 的 ReportControl 解决方案和服务器端代码，则可以设置属性

reportViewer.ShowToolBar = false

在那个代码中。

或者，如果您有权访问并可以修改查看器页面标记 (ReportViewer.aspx)，则可以以声明方式设置它：通过添加ShowToolBar="false"到 ReportViewer 控件声明：

<rsweb:ReportViewer ID="reportViewer" runat="server" ... ShowToolBar="false">
</rsweb:ReportViewer>

rc:Toolbar=false如果这不是一个选项，您可以通过添加参数来修改您传递给 IFrame 托管 ReportViewer 的 URL

http://localhost/ReportServer/Pages/ReportViewer.aspx?%2fMyReport%2fBEA&rs:Command=Render&rc:Toolbar=false
于 2013-08-20T16:50:50.233 回答