[Simple Reports] IE11 Compatibility

[Simple Reports] IE11 Compatibility

  
Forge Component
(18)
Published on 31 Aug by Rafael Fantato
18 votes
Published on 31 Aug by Rafael Fantato

Hi, I've noticed that in IE11 there are some problems, at least in pagination, can you take a look?

It seams that there is a problem in the javascript.

Thanks.

Hi, Tiago, according to this property: http://www.w3schools.com/cssref/pr_gen_counter-increment.asp

It has support on IE8+

This is what I used for pagination. I will try change it for a JS solution for better compatibility on next versions, ok?

Thank you

I've changed your java and it is fixed, the only thing I've changed was the definition of the default value of the variable currPageBreakBottom, now it is defined in the beginning instead of in the function isInPageArea.


I've also created a new application and separated the widgets from the example, now i have the SimpleReports where the widgets are with the public proprieties a true and the function isInPageArea_Sample where is the example of usage.


Can it be fixed in the current Forge Component? I would like to try it; but the current demo doesn't work in IE11.

Solution

You can get it and fix it yourself, all you have to do is replace the javascript in the PrintPages for the following:

SyntaxEditor Code Snippet

var totalGroupPages;
var currGroupPage = 1;
var currPageBreakBottom = 0;
        
$(function() {
    
        totalGroupPages = $(".Page").length;
        
        // Check Multiples Group of Pages
        $(".Page").each(function(){
            $(this).addClass("GroupPage-"+currGroupPage);
            // Parse First Page of this group
            parseCurrentPage(currGroupPage);
            
            if( $(".Page.GroupPage-"+currGroupPage+" .non-printed").length>0 ) generateNextPage(currGroupPage);
            else if(currGroupPage ==  totalGroupPages) showPages();
            
            currGroupPage++;
        });

});

function generateNextPage(GroupPageIndex){
        // Remove Last printed Elements
        $( ".Page.GroupPage-"+GroupPageIndex+":last" ).clone().insertAfter( ".Page.GroupPage-"+GroupPageIndex+":last" ).find(".printed").remove();
        
        // Remove Non Printed Elements From Last Page
        $(".Page.GroupPage-"+GroupPageIndex+":last").prev(".Page.GroupPage-"+GroupPageIndex).find(".non-printed").remove();
        
            
        parseCurrentPage(GroupPageIndex);
        
        if( $(".Page.GroupPage-"+GroupPageIndex+" .non-printed").length>0 ) generateNextPage(GroupPageIndex);
        else if(currGroupPage ==  totalGroupPages) showPages();
}

function showPages(){
        // Add Total Page Number
        $(".PageFooter").attr("pages",$(".Page").length);
        $(".PageNumber").attr("pages",$(".Page").length);
        $(".PageTotal").text("/ "+$(".Page").length);
        
        if($(".Toolbar").length>0) getBookmark();
}

function isInPageArea($element,currPageIndex,currPageBreakBottom){
    
        // Set Current Page Area for Check Elements inside
        var currPageContentTop = $(".Page:eq("+currPageIndex+") .MainPageContent").offset().top;
        var currPageContentBottom = (currPageBreakBottom==0) ? currPageContentTop+$(".Page:eq("+currPageIndex+") .MainPageContent").height() : currPageBreakBottom;
        
        
        var elementHeight = $element.height();
        var elementTop = $element.offset().top;
        
        // Check if Element is between Top and Bottom Page
        if ( (elementTop >= currPageContentTop) && ( (elementTop + elementHeight) <= currPageContentBottom ) ) {
          // Its inside
          return true;
        } else {
          // Its outsite
          return false;
        }
}

function parseCurrentPage(GroupPageIndex){

    var currPageIndex = $(".Page.GroupPage-"+GroupPageIndex+":last").index();
    var currPageBreakBottom = 0;
    
    // PageBreak
    // Check if thera is PageBreak inside page
    $(".Page.GroupPage-"+GroupPageIndex+":last .PageBreak").each(function(){
        if(isInPageArea($(this),currPageIndex,currPageBreakBottom)){ 
            var elementTop = $(this).offset().top;
            //$(this).removeClass("non-printed").addClass("printed");
            currPageBreakBottom = elementTop;
            $(this).remove();
        }else{ 
            $(this).addClass("non-printed"); 
        }
    });
    
    // PrintContainer
    // Check if this container are inside page
    $(".Page.GroupPage-"+GroupPageIndex+":last .PrintContainer").each(function(){
        if(isInPageArea($(this),currPageIndex,currPageBreakBottom)){ $(this).removeClass("non-printed").addClass("printed");}
        else{ $(this).removeClass("printed").addClass("non-printed"); }
    });


    // Table Records
    // Check if table rows are inside page
    $(".Page.GroupPage-"+GroupPageIndex+":last .TableRecords").each(function(){
        // For each row
        $(this).find("tbody tr").each(function(){
            if(isInPageArea($(this),currPageIndex,currPageBreakBottom)){ $(this).removeClass("non-printed").addClass("printed");}
            else{ $(this).removeClass("printed").addClass("non-printed"); }
        });
        
        // Current Page TableRecords
        if( $(this).find("tbody tr:last").hasClass("printed") ) {$(this).addClass("printed");}
        if( $(this).find("tbody tr:first").hasClass("non-printed") ) {$(this).removeClass("printed").addClass("non-printed");}
        else{$(this).removeClass("non-printed");}
    });
    
    
    // List Records
    $(".Page.GroupPage-"+GroupPageIndex+":last .ListRecords").each(function(){
        // For each child
        $(this).find("> div").each(function(){
            if(isInPageArea($(this),currPageIndex,currPageBreakBottom)){ $(this).removeClass("non-printed").addClass("printed");}
            else{ $(this).removeClass("printed").addClass("non-printed"); }
        });
        
        // For each new line (if you selected New Line attribute
        $(this).find("> br").each(function(){
            if(isInPageArea($(this),currPageIndex,currPageBreakBottom)){ $(this).removeClass("non-printed").addClass("printed");}
            else{ $(this).removeClass("printed").addClass("non-printed"); }
        });
        
        if( $(this).find("> div:last").hasClass("printed") ) {$(this).addClass("printed");}
        if( $(this).find("> div:first").hasClass("non-printed") ) {$(this).removeClass("printed").addClass("non-printed");}
        else{$(this).removeClass("non-printed");}
    });
    
}
Solution

Thank you; all pages are printed now; but is there a way to hide to URL at the page footer? In Chrome it is printed as in the preview; but in IE the URL is printed at the footer.

You have to mess with the printing configurations in IE.