Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
275
HTML5 Report Viewer (2014.2) styles do not work with Bootstrap 3.3.4
posted

After some frustration and investigation with your HTML5 Report Viewer (v2014.2) in an MVC 4 web app I seem to have a found a problem with using Bootstrap (v3.3.4) in tandem with the viewer such that the report styles seem to not apply to the report viewer.

For example (in the image below), to name a few style problems, the buttons have a z-index below toolbar shadow (making them un-clickable) and the buttons themselves do not have the infragistics theme applied.

However, when I remove the reference to the bootstrap js file and reload the view the styles have been applied (see below).

A few things to note:

1. The screens are from a monitor with touch capability so the touch styles are most likely the ones being applied.

2. Both the button and touch functionality work; this appears to be a style issue only.

3. I believe the specific version for the reporting libraries is 14.2.20142.1016.

4. This is using an HTML5 report Viewer within an MVC 4 web app.

3. Source list for non-infragistics files:

    - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css

    - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css

    - https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.js

    - https://code.jquery.com/jquery-2.0.0.js

    - https://code.jquery.com/ui/1.11.1/jquery-ui.min.js

    - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js

4. Used the following infragistics files, sourced in the solution, as per your documentation:

    - /Infragistics/2014.2/css/structure/jquery.ui.all.css

    - /Infragistics/2014.2/Reporting/css/themes/infragistics/infragistics.theme.css

    - /Infragistics/2014.2/Reporting/css/structure/infragistics.reporting.css

    - /Infragistics/2014.2/Reporting/scripts/infragistics.reporting.js

I am pretty sure I can make a workaround to apply my own styles, but it's slightly frustrating that I have too.

Thank you,

Kris

  • 25665
    Verified Answer
    Offline posted

    Hello Kris,

    Thank you for contacting Infragistics!

    I have done some looking into this matter and have the following information. The reporting controls are not supported with Bootstrap. If you want to change the styles you can do so yourself.

    Please let me know if you have any further questions concerning this matter.