ReportViewer in Firefox version 1.5.0.1

ReportViewer in Firefox version 1.5.0.1

• Jemmy Wang

  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);)

  
  

• pcdoc4christ

  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

  
  
  

• mnsh

  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

  
  
  

• Clement Edwin

  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 = new ReportDataSource("DefaultDataSet", table);

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

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

  this.rptViewer.DataBind();

  
  

• Richard Sloggett

  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.

  
  

• MSD

  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.
  

• innes

  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.
  

• Jaimir Guerrero

  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
  
  

• Adrian Raine

  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>

  
  

• Genesis_B

  Thank you. We are aware of that issue, but I did not know it was unique to more recent versions of FireFox.
  

• billrob458

  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.
  

• pjhacker

  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

  
  

• saurin

  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

  
  

• Mandys

  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>
  
  
  
• ReportViewer in Firefox version 1.5.0.1