ReportViewer in Firefox version 1.5.0.1

I have problem rendering the ReportViewer in Firefox version 1.5.0.1. The width of the ReportViewer is much smaller than expected and the data is just messed up. But the ReportViewer works fine in the early version such as 1.0.7. Any clue on that? Thanks.
[263 byte] By [JudyX] at [2007-12-25]
# 1
I am not aware of any rendering issues unique to the version of Firefox. Will you send a simplified RDL that shows the problem? We will investigate it.
BrianHartman-MSFT at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 2

Hi Brain,

Below is the simplied RDL. Thanks for your help.
<?xml version="1.0" encoding="utf-8"?>

<Report xmlns="http://schemas.microsoft.com/sqlserver/reporting/2005/01/reportdefinition" xmlns:rd="http://schemas.microsoft.com/SQLServer/reporting/reportdesigner">

<DataSources>

<DataSource Name="DefaultDataSource">

<ConnectionProperties>

<ConnectString />

<DataProvider>SQL</DataProvider>

</ConnectionProperties>

<rd:DataSourceID>598f9e62-e2c0-49eb-9858-f672339a5f4a</rd:DataSourceID>

</DataSource>

</DataSources>

<Body>

<ReportItems>

<Table Name="table1">

<TableGroups>

<TableGroup>

<Grouping Name="table1_Group1">

<PageBreakAtEnd>true</PageBreakAtEnd>

<GroupExpressions>

<!-- This arcane expression causes the report to paginate after 25 rows -->

<GroupExpression>=(RowNumber(Nothing) - 1) \ 25</GroupExpression>

</GroupExpressions>

</Grouping>

</TableGroup>

</TableGroups>

<Header>

<RepeatOnNewPage>true</RepeatOnNewPage>

<TableRows>

<TableRow>

<TableCells>

<TableCell>

<ReportItems>

<Textbox Name="header_ColName1">

<Style>

<PaddingLeft>4pt</PaddingLeft>

<PaddingBottom>2pt</PaddingBottom>

<PaddingRight>2pt</PaddingRight>

<PaddingTop>2pt</PaddingTop>

<BackgroundColor>#EAE7DF</BackgroundColor>

<Color>#837F78</Color>

<TextAlign>Left</TextAlign>

<FontWeight>Bold</FontWeight>

<TextDecoration>None</TextDecoration>

<FontFamily>Trebuchet MS</FontFamily>

<FontSize>8pt</FontSize>

<BorderColor>

<Bottom>#CAC8C0</Bottom>

</BorderColor>

<BorderWidth>

<Bottom>1pt</Bottom>

</BorderWidth>

<BorderStyle>

<Bottom>Solid</Bottom>

</BorderStyle>

</Style>

<CanGrow>true</CanGrow>

<CanShrink>true</CanShrink>

<UserSort>

<SortExpression>=Fields!ColName1.Value</SortExpression>

</UserSort>

<Value>Col Name1</Value>

</Textbox>

</ReportItems>

</TableCell>

<TableCell>

<ReportItems>

<Textbox Name="header_ColName2">

<Style>

<PaddingLeft>4pt</PaddingLeft>

<PaddingBottom>2pt</PaddingBottom>

<PaddingRight>2pt</PaddingRight>

<PaddingTop>2pt</PaddingTop>

<BackgroundColor>#EAE7DF</BackgroundColor>

<Color>#837F78</Color>

<TextAlign>Left</TextAlign>

<FontWeight>Bold</FontWeight>

<TextDecoration>None</TextDecoration>

<FontFamily>Trebuchet MS</FontFamily>

<FontSize>8pt</FontSize>

<BorderColor>

<Bottom>#CAC8C0</Bottom>

</BorderColor>

<BorderWidth>

<Bottom>1pt</Bottom>

</BorderWidth>

<BorderStyle>

<Bottom>Solid</Bottom>

</BorderStyle>

</Style>

<CanGrow>true</CanGrow>

<CanShrink>true</CanShrink>

<UserSort>

<SortExpression>=Fields!ColName2.Value</SortExpression>

</UserSort>

<Value>Col Name2</Value>

</Textbox>

</ReportItems>

</TableCell>

<TableCell>

<ReportItems>

<Textbox Name="header_ColName3">

<Style>

<PaddingLeft>4pt</PaddingLeft>

<PaddingBottom>2pt</PaddingBottom>

<PaddingRight>2pt</PaddingRight>

<PaddingTop>2pt</PaddingTop>

<BackgroundColor>#EAE7DF</BackgroundColor>

<Color>#837F78</Color>

<TextAlign>Right</TextAlign>

<FontWeight>Bold</FontWeight>

<TextDecoration>None</TextDecoration>

<FontFamily>Trebuchet MS</FontFamily>

<FontSize>8pt</FontSize>

<BorderColor>

<Bottom>#CAC8C0</Bottom>

</BorderColor>

<BorderWidth>

<Bottom>1pt</Bottom>

</BorderWidth>

<BorderStyle>

<Bottom>Solid</Bottom>

</BorderStyle>

</Style>

<CanGrow>true</CanGrow>

<CanShrink>true</CanShrink>

<UserSort>

<SortExpression>=Fields!ColName3.Value</SortExpression>

</UserSort>

<Value>Col Name3</Value>

</Textbox>

</ReportItems>

</TableCell>

<TableCell>

<ReportItems>

<Textbox Name="header_ColName4">

<Style>

<PaddingLeft>4pt</PaddingLeft>

<PaddingBottom>2pt</PaddingBottom>

<PaddingRight>2pt</PaddingRight>

<PaddingTop>2pt</PaddingTop>

<BackgroundColor>#EAE7DF</BackgroundColor>

<Color>#837F78</Color>

<TextAlign>Right</TextAlign>

<FontWeight>Bold</FontWeight>

<TextDecoration>None</TextDecoration>

<FontFamily>Trebuchet MS</FontFamily>

<FontSize>8pt</FontSize>

<BorderColor>

<Bottom>#CAC8C0</Bottom>

</BorderColor>

<BorderWidth>

<Bottom>1pt</Bottom>

</BorderWidth>

<BorderStyle>

<Bottom>Solid</Bottom>

</BorderStyle>

</Style>

<CanGrow>true</CanGrow>

<CanShrink>true</CanShrink>

<UserSort>

<SortExpression>=Fields!ColName4.Value</SortExpression>

</UserSort>

<Value>Col Name4</Value>

</Textbox>

</ReportItems>

</TableCell>

</TableCells>

<Height>1mm</Height>

</TableRow>

</TableRows>

</Header>

<Details>

<TableRows>

<TableRow>

<TableCells>

<TableCell>

<ReportItems>

<Textbox Name="ColName1">

<Style>

<BackgroundColor>#F4F1E8</BackgroundColor>

<PaddingLeft>4pt</PaddingLeft>

<PaddingBottom>2pt</PaddingBottom>

<PaddingRight>2pt</PaddingRight>

<PaddingTop>2pt</PaddingTop>

<TextAlign>Left</TextAlign>

<FontFamily>Trebuchet MS</FontFamily>

<FontSize>8pt</FontSize>

<BorderColor>

<Bottom>#CAC8C0</Bottom>

</BorderColor>

<BorderWidth>

<Bottom>1pt</Bottom>

</BorderWidth>

<BorderStyle>

<Bottom>Solid</Bottom>

</BorderStyle>

</Style>

<CanGrow>true</CanGrow>

<CanShrink>true</CanShrink>

<Value>=Fields!ColName1.Value</Value>

</Textbox>

</ReportItems>

</TableCell>

<TableCell>

<ReportItems>

<Textbox Name="ColName2">

<Style>

<BackgroundColor>#F4F1E8</BackgroundColor>

<PaddingLeft>4pt</PaddingLeft>

<PaddingBottom>2pt</PaddingBottom>

<PaddingRight>2pt</PaddingRight>

<PaddingTop>2pt</PaddingTop>

<TextAlign>Left</TextAlign>

<FontFamily>Trebuchet MS</FontFamily>

<FontSize>8pt</FontSize>

<BorderColor>

<Bottom>#CAC8C0</Bottom>

</BorderColor>

<BorderWidth>

<Bottom>1pt</Bottom>

</BorderWidth>

<BorderStyle>

<Bottom>Solid</Bottom>

</BorderStyle>

</Style>

<CanGrow>true</CanGrow>

<CanShrink>true</CanShrink>

<Value>=Fields!ColName2.Value</Value>

</Textbox>

</ReportItems>

</TableCell>

<TableCell>

<ReportItems>

<Textbox Name="ColName3">

<Style>

<BackgroundColor>#F4F1E8</BackgroundColor>

<PaddingLeft>4pt</PaddingLeft>

<PaddingBottom>2pt</PaddingBottom>

<PaddingRight>2pt</PaddingRight>

<PaddingTop>2pt</PaddingTop>

<TextAlign>Right</TextAlign>

<FontFamily>Trebuchet MS</FontFamily>

<FontSize>8pt</FontSize>

<BorderColor>

<Bottom>#CAC8C0</Bottom>

</BorderColor>

<BorderWidth>

<Bottom>1pt</Bottom>

</BorderWidth>

<BorderStyle>

<Bottom>Solid</Bottom>

</BorderStyle>

</Style>

<CanGrow>true</CanGrow>

<CanShrink>true</CanShrink>

<Value>=Fields!ColName3.Value</Value>

</Textbox>

</ReportItems>

</TableCell>

<TableCell>

<ReportItems>

<Textbox Name="ColName4">

<Style>

<BackgroundColor>#F4F1E8</BackgroundColor>

<PaddingLeft>4pt</PaddingLeft>

<PaddingBottom>2pt</PaddingBottom>

<PaddingRight>2pt</PaddingRight>

<PaddingTop>2pt</PaddingTop>

<TextAlign>Right</TextAlign>

<FontFamily>Trebuchet MS</FontFamily>

<FontSize>8pt</FontSize>

<BorderColor>

<Bottom>#CAC8C0</Bottom>

</BorderColor>

<BorderWidth>

<Bottom>1pt</Bottom>

</BorderWidth>

<BorderStyle>

<Bottom>Solid</Bottom>

</BorderStyle>

</Style>

<CanGrow>true</CanGrow>

<CanShrink>true</CanShrink>

<Value>=Fields!ColName4.Value</Value>

</Textbox>

</ReportItems>

</TableCell>

</TableCells>

<Height>1mm</Height>

</TableRow>

</TableRows>

</Details>

<TableColumns>

<TableColumn>

<Width>47.625mm</Width>

</TableColumn>

<TableColumn>

<Width>50.00625mm</Width>

</TableColumn>

<TableColumn>

<Width>28.575mm</Width>

</TableColumn>

<TableColumn>

<Width>21.43125mm</Width>

</TableColumn>

</TableColumns>

</Table>

</ReportItems>

<Height>1mm</Height>

</Body>

<rd:ReportID>930ced99-44c5-4de6-a8df-88f62a69b81c</rd:ReportID>

<DataSets>

<DataSet Name="DefaultDataSet">

<Query>

<rd:UseGenericDesigner>true</rd:UseGenericDesigner>

<CommandText>EMPTY</CommandText>

<DataSourceName>DefaultDataSource</DataSourceName>

</Query>

<Fields>

<Field Name="ColName1">

<DataField>Col Name1</DataField>

<rd:TypeName>System.String</rd:TypeName>

</Field>

<Field Name="ColName2">

<DataField>Col Name2</DataField>

<rd:TypeName>System.DateTime</rd:TypeName>

</Field>

<Field Name="ColName3">

<DataField>Col Name3</DataField>

<rd:TypeName>System.Int32</rd:TypeName>

</Field>

<Field Name="ColName4">

<DataField>Col Name4</DataField>

<rd:TypeName>System.Int32</rd:TypeName>

</Field>

</Fields>

</DataSet>

</DataSets>

<Width>147.6375mm</Width>

<Language>en-US</Language>

</Report>

JudyX at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 3
Hi Brian,
I forget to mention how we bind the data to the ReportViewer. Below is the code. You can find the DataType for each column in the DataSets section in RDL. Thanks.

DataTable table;

...

ReportDataSource source = newReportDataSource("DefaultDataSet", table);

this.rptViewer.LocalReport.DataSources.Clear();

this.rptViewer.LocalReport.DataSources.Add(source);

this.rptViewer.DataBind();

JudyX at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 4
Hi Brain,
One of our team members has spent time reading the page source and found the report rendering problem in Firefox. I hope it's useful for your investigation. Please see below.

The ReportViewer control creates a huge number of nested tables and div tags. Firefox 1.5 (though not FF 1.0.7) chokes on an empty table cell with a width of 100% that’s in one of these tables. This cell’s measurement attributes seem to take precedence over other sized elements and cause the columns in the report to crunch down to tiny unreadable widths. Removing this table cell from the DOM fixes the rendering error completely.

The specific table cell is located in the first nested table inside the div classed “ReportvieweroReport”. That div contains a table with a table-body element, containing a single row, containing two table cells. The first of these table cells has the id “mp01_bodyRegion__ctl1__ctl0_ReportVieweroReportCell”. The *second* of these two cells is empty, but is set to width=”100%” and height=”0”. This cell breaks the layout in Firefox 1.5.

(var ClientReportmp01_bodyRegion__ctl1__ctl0_ReportViewer__ctl2 = new RSReport(ClientControllermp01_bodyRegion__ctl1__ctl0_ReportViewer, "mp01_bodyRegion__ctl1__ctl0_ReportViewer", "mp01_bodyRegion__ctl1__ctl0_ReportVieweroReportDiv", "mp01_bodyRegion__ctl1__ctl0_ReportVieweroReportCell", "100", "", 1, 7, false, false, "", 0);)
JudyX at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 5
Thank you. We are aware of that issue, but I did not know it was unique to more recent versions of FireFox.
BrianHartman-MSFT at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 6
Hi Brian,
We found another rendering problem in Firefox. Please see below.
The first column in reports cannot be styled correctly. The report viewer control requires a “height” be specified for all table rows. Unfortunately, it applies this not to the table-row element, but to the first table-cell within that row. When it applies that as a style attribute, it conflicts with the style that we set elsewhere.
Thanks.
JudyX at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 7

Has there been any progress on this bug? My app is crippled right now, since Firefox doesn't handle the reporting properly.

If there is not a fix, perhaps some advice would be nice - I am using the TableRdlGenerator/RdlGenerator code from www.gotreportviewer.com. I've modified the code somewhat, but I don't see a very good way to get it to render the textbox fix I've seen elsewhere. Any thoughts on that?

Thank you!

Nolan

NolanGarrett at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 8
I have not tried this myself, but you might be able to solve the problem by placing the textbox inside a rectangle. Textboxes get special handling in some cases. Adding the rectangle won't affect the display of the report but may change the html that is generated to workaround the problem.
BrianHartman-MSFT at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 9
Hi!

I am running into the same problem and there are no empty cells in the table. Saving the source from FireFox for the table it can be displayed correctly in IE, but not the other way around. I am using the VS 2005 to create the report rdl. Here is the simple report that can not be displayed properly in FF.

<?xml version="1.0" encoding="utf-8"?>
<Report xmlns="http://schemas.microsoft.com/sqlserver/reporting/2005/01/reportdefinition" xmlns:rd="http://schemas.microsoft.com/SQLServer/reporting/reportdesigner">
<DataSources>
<DataSource Name="DataSource">
<DataSourceReference>DataSource</DataSourceReference>
<rd:DataSourceID>87206147-a9f0-4f42-9d6e-79af4f8a7231</rd:DataSourceID>
</DataSource>
</DataSources>
<BottomMargin>1in</BottomMargin>
<RightMargin>1in</RightMargin>
<rd:DrawGrid>true</rd:DrawGrid>
<InteractiveWidth>8.5in</InteractiveWidth>
<rd:SnapToGrid>true</rd:SnapToGrid>
<Body>
<ReportItems>
<Table Name="table1">
<Left>0.25in</Left>
<KeepTogether>true</KeepTogether>
<Top>0.125in</Top>
<Width>348.99985pt</Width>
<Details>
<TableRows>
<TableRow>
<TableCells>
<TableCell>
<ReportItems>
<Textbox Name="textbox4">
<rd:DefaultName>textbox4</rd:DefaultName>
<ZIndex>1</ZIndex>
<Style>
<PaddingLeft>2pt</PaddingLeft>
<PaddingBottom>2pt</PaddingBottom>
<PaddingRight>2pt</PaddingRight>
<PaddingTop>2pt</PaddingTop>
</Style>
<CanGrow>true</CanGrow>
<Value>=Fields!name.Value</Value>
</Textbox>
</ReportItems>
</TableCell>
<TableCell>
<ReportItems>
<Textbox Name="textbox5">
<rd:DefaultName>textbox5</rd:DefaultName>
<Style>
<PaddingLeft>2pt</PaddingLeft>
<PaddingBottom>2pt</PaddingBottom>
<PaddingRight>2pt</PaddingRight>
<PaddingTop>2pt</PaddingTop>
</Style>
<CanGrow>true</CanGrow>
<Value>=Fields!created.Value</Value>
</Textbox>
</ReportItems>
</TableCell>
</TableCells>
<Height>0.25in</Height>
</TableRow>
</TableRows>
</Details>
<TableColumns>
<TableColumn>
<Width>2.22222in</Width>
</TableColumn>
<TableColumn>
<Width>2.625in</Width>
</TableColumn>
</TableColumns>
<Height>18pt</Height>
</Table>
</ReportItems>
<Height>700pt</Height>
</Body>
<rd:ReportID>bd8ca714-0aa5-4b6e-9760-58d82cd24f8a</rd:ReportID>
<LeftMargin>1in</LeftMargin>
<DataSets>
<DataSet Name="DataSet1">
<Query>
<rd:UseGenericDesigner>true</rd:UseGenericDesigner>
<CommandText>select top 2 name, created from vault</CommandText>
<DataSourceName>DataSource</DataSourceName>
</Query>
<Fields>
<Field Name="name">
<rd:TypeName>System.String</rd:TypeName>
<DataField>name</DataField>
</Field>
<Field Name="created">
<rd:TypeName>System.DateTime</rd:TypeName>
<DataField>created</DataField>
</Field>
</Fields>
</DataSet>
</DataSets>
<Width>522pt</Width>
<InteractiveHeight>11in</InteractiveHeight>
<Language>en-US</Language>
<TopMargin>1in</TopMargin>
</Report>

LixinD at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 10
Hi my name is barbara and I am having the same problem with firefox would like to know if there is a solution. I have realized if I save the report.axd to a html and where the oReportCell is add the width=100% then it works however how do I do that on the fly? I tried adding a .css class where #oReportCell{ width=100%} however that does not seem to work? can anyone help?
BasiaMucha at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 11
Barbara, I tried the same fix and had no success. I believe it's getting lost in the sea of nested tables and iframes. The only way I've found to work around this so far is to add a textbox set to the width of the post.
jongalloway at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 12

Hi Jon,

What do you mean "add a textbox set to the width of the post."? I have been stuggling with this issue for a couple of days. Is this something you do in the rdlc or progromatically? Can you provide a simple example or explaination?

This control is perfect for simple reports that can be exported. All except the fact that it doesn't render correctly in Firefox!

Thanks,
Craig

asbuilts at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 13

Jon,

Git it figured out. I just added a blank text box in the header and set it to the width of the report. Pretty much exactly what you said :)

Thanks,
Craig

asbuilts at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...
# 14

Brian,

Is there a hotfix available to resolve the "narrow width" issue when the ReportViewer renders columns in Firefox? We're seeing the same error with Firefox 2.x, and our client is considering a switch to Crystal Reports if we cannot resolve the issue promptly for them.

Please contact me at jeff.townes@parivedasolutions.com with any information you may have.

Thanks,

Jeff

jeff.townes at 2007-10-8 > top of Msdn Tech,Visual Studio,Visual Studio Report Controls...

Visual Studio

Site Classified