网页的 SQL Reporting Services 查看器 - 您可以移动“查看报告”按钮吗？答案

【问题标题】：SQL Reporting Services viewer for webpage - can you move the View Report button?网页的 SQL Reporting Services 查看器 - 您可以移动“查看报告”按钮吗？
【发布时间】：2010-09-06 10:50:02
【问题描述】：

使用查看器控件在网页上显示 SQL Reporting Services 报表 (Microsoft.ReportViewer.WebForms)，您可以移动查看报表按钮吗？它默认位于报告的最右侧，这意味着您必须一直滚动到该按钮可见。对于适合窗口宽度的报表来说不是问题，但对于非常宽的报表来说，这很快就会成为问题。

【问题讨论】：

标签： asp.net reporting-services reportviewer

【解决方案1】：

我遇到了同样的问题，最后使用了 Travis Collins 答案的扩展；除了更改表格列宽外，我还将“查看报告”按钮向左对齐，以便它看起来更接近其余控件。

    <script type="text/javascript">
  $(document).ready(function() {
     $("#_ctl0_MainContent_reportViewer_fixedTable tr:first td:first-child").attr("width", "1"); 
     $("#_ctl0_MainContent_reportViewer_fixedTable tr:first td:last-child").attr("align", "left");   
  });
</script>

您可能需要根据分配给现有控件的元素命名来调整 JQuery 选择器。

【讨论】：

第一次加载页面时有效。单击查看报告后，数据已加载 - 但样式再次重置为初始值（宽度“100%”并对齐“中心”）。知道我的情况可能有什么问题吗？感谢您的回复。谢谢！
@NeelimaEdiga 我无法验证这一点，但尝试添加 jquery 文档更改功能，使用相同的 2 行代码来更改表格布局，如下所示：$(document).on('change ', '输入', function() { $("#_ctl0_MainContent_reportViewer_fixedTable tr:first td:first-child").attr("width", "1"); $("#_ctl0_MainContent_reportViewer_fixedTable tr:first td:last-child ").attr("align", "left"); });

【解决方案2】：

因为我昨天才在寻找这个答案，所以我想我会发布我想出的解决问题的方法。我们的报告回来了，我们希望“查看报告”按钮存在于控件的左侧，因此无需滚动即可找到该按钮。我确实需要进入渲染文件的源代码来查找按钮和目标表的 ID 名称。

我编写了一个简单的剪切和粘贴 javascript 函数来将按钮从其原始位置拉出，并将其放到日期选择器下方包含表的下一行中。

function moveButton() {
  document.getElementById('ParameterTable_ctl00_MainContent_MyReports_ctl04').appendChild(document.getElementById('ctl00_MainContent_MyReports_ctl04_ctl00'));
        }

在报表查看器加载事件中调用此函数。

ScriptManager.RegisterStartupScript(Me, Me.GetType(), "moveButton", "moveButton();", True)

为了调整位置，我使用了 CSS ID。

#ctl00_MainContent_MyReports_ctl04_ctl00 {
    margin: 0px 0px 0px 50px;
}

【讨论】：

【解决方案3】：

按钮被推到右侧的原因是参数的 td 具有 width="100%"。我正在用下面的 jquery 解决这个问题。它只是将参数 td 的宽度更改为 1。浏览器会自行将宽度扩展为元素内容的宽度。希望这会有所帮助。

<script type="text/javascript">
    $(document).ready(function() {
        $("#<%= ReportViewer1.ClientID %> td:first").attr("width", "1");
    });
</script>

【讨论】：

【解决方案4】：

这是一种 hack，但您可以在 JavaScript 中移动它。只需查看 ReportViewer 生成的 HTML，然后编写适当的 JavaScript 代码来移动按钮。我使用 JavaScript 来隐藏按钮（因为我们想要自己的查看报告按钮）。任何操作生成的 ReportViewer 的 HTML 的 JavaScript 代码都必须位于 .aspx 页面中的 ReportViewer 控件之后。这是我隐藏按钮的代码，让你知道你会做什么：

function getRepViewBtn() {
  return document.getElementsByName("ReportViewer1$ctl00$ctl00")[0];
}

function hideViewReportButton() { // call this where needed
  var btn = getRepViewBtn();
  btn.style.display = 'none';
}

【讨论】：

【解决方案5】：

不，您不能在 ReportViewer 控件中重新定位查看报告按钮。

但是，您可以创建自己的自定义报告查看控件。该控件将由报告参数字段和生成报告的按钮组成。当用户单击按钮时，您可以在后台生成报告。您可以将报告显示为 PDF、HTML 等。

【讨论】：

@Cowthulhu 请注意我所说的“在 ReportViewer 控件中”。我仍然认为这是一个有效的答案，因为隐藏按钮的功能不是内置的。解决它的唯一方法是使用 JavaScript 操作页面上控件之外的按钮，如上面接受的答案中所述。
你是对的，对此感到抱歉。我删除了我的评论。