Get Print content in a full screen not in dataTable itself

Get Print content in a full screen not in dataTable itself

gauravshahgauravshah Posts: 2Questions: 1Answers: 0

I use below code:
var oTable=$('#datatable2').dataTable({

                         "bStateSave": true,
                         "bServerSide": true,
                         "sAjaxSource": "projectlist",             
                         "bAutoWidth": false,
                         "bProcessing": true,                        

                         "oLanguage": {
                            "sLengthMenu": "Show _MENU_ records per page    ",
                            "sEmptyTable": "No Records Available",
                             "oPaginate": {
                                 "sPrevious": "",
                                 "sNext": ""
                                 }
                        },          
                         "aoColumns": [                           
                                        { "mData": null,"bSortable": false, "bVisible": true, "sClass": "centertext" },
                                       { "mData": "ietitle"},
                                       { "mData": "iecode"},
                                       { "mData": null,"bSortable": true,
                                           "mRender" : function(obj){
                                               var status = obj.status;
                                               if(status != null && status !=''){
                                                   var progressdiv ="<div>"
                                                         +status+"</div>" ;
                                               }
                                               else{
                                                   var progressdiv ="<div>"
                                                         +"Not available</div>" ;
                                               }
                                            return progressdiv;
                                           }   
                                       },
                                       { "mData": null, "bSortable": false,
                                           "mRender" : function(obj){
                                               var progress = obj.progress;
                                               var percent = (progress/8)*100;
                                               var percentage =Math.round(percent);

                                                    var progressdiv ="<div data-toggle='tooltip'   title='" 
                                                     + percentage +"% Complete'" 
                                                     +"data-container='body' data-placement='top' style='margin-bottom:0px; background-color:#A59898' class='progress'>"
                                                     +"<div class='progress-bar progress-bar-info'" 
                                                     + "role='progressbar'"
                                                     + "aria-valuenow='"
                                                     + progress +"' aria-valuemin='0' "
                                                     + "aria-valuemax='100' style='width:"
                                                     + percent + "%'> <span>"+percentage+"% Complete</span></div></div>" ;

                                            return progressdiv;
                                           }   
                                       },
                                       { "mData": null, 
                                           "bSortable": false,

                                           "mRender" : function(
                                                    obj) {
                                               var iecode = obj.iecode;
                                               var _id = obj._id;
                                               var editRemoveDiv = "<div><a data-toggle='tooltip'  data-container='body' title='View Project' class='glyphicon glyphicon-file text-system' data-placement='top' data-original-title='View' href='<%=application.getContextPath() %>/manageProjects/viewProject?id=" 
                                                + iecode
                                                + "'></i></a>" 
                                                + "&nbsp;&nbsp;" 
                                                + "<a href='#' data-toggle='tooltip' name='"+ iecode+"' data-container='body' title='Edit Project' class='glyphicon glyphicons-pencil selectPopup' data-placement='top'"
                                                + "></a>"
                                                +"&nbsp;&nbsp;"
                                                +"<a href='#' name='"+ iecode +"' data-container='body' class='deletepopup' title='Delete Project' onclick='popup()' data-effect='mfp-flipInY' data-toggle='tooltip' data-placement='top' data-id='<%=application.getContextPath() %>/deletproject?id="
                                                + iecode 
                                                + "'><span class=' popup glyphicon glyphicon-trash text-danger'></span></a></div>";
                                                return editRemoveDiv;
                                           }
                                       }

                                        ],

                                        "aaSorting" : [ [ 1, 'asc' ] ],
                                        "aLengthMenu" : [
                                                [ 5, 10, 15, 20, -1 ],
                                                [ 5, 10, 15, 20, "All" ] ],
                                        "iDisplayLength" : 10,
                                        "sDom": '<"dt-panelmenu clearfix"lTfr>t<"dt-panelfooter clearfix"ip>',
                                        "oTableTools": {
                                            "sSwfPath": "<%=application.getContextPath() %>/vendor/plugins/datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
                                             "aButtons": [
                                                         {
                                                             "sExtends": "copy",
                                                             "mColumns": [1, 2, 3, 4]
                                                         },
                                                         {
                                                             "sExtends": "csv",
                                                             "mColumns": [1, 2, 3, 4]
                                                         },
                                                         {
                                                             "sExtends": "pdf",
                                                             "mColumns": [1, 2, 3, 4]
                                                         },    
                                                                                                {
                                                             "sExtends": "print",
                                                             "mColumns": [0,1, 2, 3, 4, 5],
                                                             "sMessage": 'Click print or cancel <button>Print</button>',
                                                             "fnClick": function (nButton, oConfig, oFlash) {
                                                                    oTable.fnSetColumnVis(5, false);
                                                                    $('div.dataTables_scrollHead').show();
                                                                    $(window).keyup(function(){
                                                                          oTable.fnSetColumnVis(5, true);
                                                                    });
                                                                }
                                                         },

                                                     ] 
                                          },
                                         "fnRowCallback": function(nRow, aData, iDisplayIndex) {
                                            var oSettings = oTable.fnSettings();
                                            $("td:first", nRow).html(oSettings._iDisplayStart + iDisplayIndex + 1);
                                            return nRow;
                                        },
                                    });

Answers

  • gauravshahgauravshah Posts: 2Questions: 1Answers: 0

    When I use {
    "sExtends": "print",
    "mColumns": [0,1, 2, 3, 4,5]
    },

    I get the content in a full screen. As I want to hide column 5 while printing , I have added below code :
    "sMessage": 'Click print or cancel <button>Print</button>',
    "fnClick": function (nButton, oConfig, oFlash) {
    oTable.fnSetColumnVis(5, false);
    $('div.dataTables_scrollHead').show();
    $(window).keyup(function(){
    oTable.fnSetColumnVis(5, true);
    });
    }

This discussion has been closed.