This is a migrated thread and some comments may be shown as answers.

Print Grid and hide columns not working

6 Answers 340 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Sauge
Top achievements
Rank 1
Sauge asked on 13 Mar 2013, 02:24 PM
Hi there

I have a grid where I want to hide/show certain columns before printing via a radbutton outside of the grid. 

I have used code from the forums to hide these columns and it works well

Protected Sub RadButton1_Click(sender As Object, e As EventArgs) Handles RadButton1.Click
    For Each item As GridItem In RadGrid1.MasterTableView.GetItems(New GridItemType() {GridItemType.Pager, GridItemType.FilteringItem})
        item.Display = False
    Next
    RadGrid1.MasterTableView.GetColumn("Column1").Visible = True
    RadGrid1.MasterTableView.GetColumn("Column2").Visible = False
    RadGrid1.MasterTableView.GetColumn("Column3").Visible = False
End Sub

I also have client side code from the forums to print the grid, which also works well

   <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
 
    <script type="text/javascript">
 
        function getOuterHTML(obj) {
            if (typeof (obj.outerHTML) == "undefined") {
                var divWrapper = document.createElement("div");
                var copyOb = obj.cloneNode(true);
                divWrapper.appendChild(copyOb);
                return divWrapper.innerHTML
            }
            else
                return obj.outerHTML;
        }
 
        function PrintRadGrid() {
            var previewWnd = window.open('about:blank', '', '', false);
            var sh = '<%= ClientScript.GetWebResourceUrl(RadGrid1.GetType(),String.Format("Telerik.Web.UI.Skins.{0}.Grid.{0}.css",RadGrid1.Skin)) %>';
        var shBase = '<%= ClientScript.GetWebResourceUrl(RadGrid1.GetType(),"Telerik.Web.UI.Skins.Grid.css") %>';
        var styleStr = "<html><head><link href = '" + sh + "' rel='stylesheet' type='text/css'></link>";
        styleStr += "<link href = '" + shBase + "' rel='stylesheet' type='text/css'></link></head>";
        var htmlcontent = styleStr + "<body>" + getOuterHTML($find('<%= RadGrid1.ClientID %>').get_element()) + "</body></html>";
        previewWnd.document.open();
        previewWnd.document.write(htmlcontent);
        previewWnd.document.close();
        previewWnd.print();
 
        if (!$telerik.isChrome) {
            previewWnd.close();
        }
    }
 
 
    </script>
</telerik:RadCodeBlock>

However, if I try to trigger them from my button like so:

<telerik:RadButton ID="RadButton1" runat="server" Text="Print"  AutoPostBack="True" OnClick="RadButton1_Click" OnClientClicking="PrintRadGrid">
    </telerik:RadButton>

the client side event always gets fired first and so the columns are still displayed in the preview window, and when I go back to my actual page, the columns remain hidden in the grid (I would like them to go back to the way they were on the actual page)

Please could someone tell me how to get all these things to work?
I know I have probably made a stupid mistake somewhere along the line but I am a bit of a newbie girl so please be gentle

Any help greatly appreciated :-)

6 Answers, 1 is accepted

Sort by
0
Jayesh Goyani
Top achievements
Rank 2
answered on 14 Mar 2013, 05:40 AM
Hello,

For that you have to use any one of below. Please check below link for reference.

http://forums.asp.net/post/4846619.aspx

http://stackoverflow.com/questions/12032466/calling-javascript-method-from-code-behind-using-scriptmanager-registerstartupsc

Thanks,
Jayesh Goyani
0
Sauge
Top achievements
Rank 1
answered on 14 Mar 2013, 06:32 AM
Hi Jayesh
Thank you for replying

I did this
Protected Sub RadButton1_Click(sender As Object, e As EventArgs) Handles RadButton1.Click
    For Each item As GridItem In RadGrid1.MasterTableView.GetItems(New GridItemType() {GridItemType.Pager, GridItemType.FilteringItem})
        item.Display = False
    Next
    RadGrid1.MasterTableView.GetColumn("Column1").Visible = True
    RadGrid1.MasterTableView.GetColumn("Column2").Visible = False
    RadGrid1.MasterTableView.GetColumn("Column3").Visible = False
ScriptManager.RegisterStartupScript(Page, [GetType](), "PrintRadGrid", "<script>PrintRadGrid()</script>", False)
End Sub

And removed OnClientClicking="PrintRadGrid"  from my button but now, when I click, it just opens a new blank tab

Could you tell me what I am doing wrong please

Thank you :-)
0
Accepted
Jayesh Goyani
Top achievements
Rank 2
answered on 14 Mar 2013, 12:49 PM
Hello,

i am not able to reproduce this issue. Please check my working code in below.

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" OnNeedDataSource="RadGrid1_NeedDataSource"
            AllowPaging="false" AllowFilteringByColumn="false" ShowFooter="true" AllowMultiRowSelection="true"
            AllowMultiRowEdit="true" PageSize="10"
             
>
            <MasterTableView EditMode="InPlace" Name="Parent" DataKeyNames="ID" InsertItemPageIndexAction="ShowItemOnCurrentPage"
                ClientDataKeyNames="ID">
                <Columns>
                    <telerik:GridBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Name" UniqueName="Name" HeaderText="Name">
                    </telerik:GridBoundColumn>
                    <telerik:GridEditCommandColumn>
                    </telerik:GridEditCommandColumn>
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
        <br />
        
        <asp:Button ID="Button1" runat="server" Text="check serverside" OnClick="Button1_Click"
            ValidationGroup="test" />
function SetColumnValue() {
    var previewWnd = window.open('about:blank', '', '', false);
    var sh = '<%= ClientScript.GetWebResourceUrl(RadGrid1.GetType(),String.Format("Telerik.Web.UI.Skins.{0}.Grid.{0}.css",RadGrid1.Skin)) %>';
    var shBase = '<%= ClientScript.GetWebResourceUrl(RadGrid1.GetType(),"Telerik.Web.UI.Skins.Grid.css") %>';
    var styleStr = "<html><head><link href = '" + sh + "' rel='stylesheet' type='text/css'></link>";
    styleStr += "<link href = '" + shBase + "' rel='stylesheet' type='text/css'></link></head>";
    var htmlcontent = styleStr + "<body>" + getOuterHTML($find('<%= RadGrid1.ClientID %>').get_element()) + "</body></html>";
    previewWnd.document.open();
    previewWnd.document.write(htmlcontent);
    previewWnd.document.close();
    previewWnd.print();
 
    if (!$telerik.isChrome) {
        previewWnd.close();
    }
 
}
 
 
 
function getOuterHTML(obj) {
    if (typeof (obj.outerHTML) == "undefined") {
        var divWrapper = document.createElement("div");
        var copyOb = obj.cloneNode(true);
        divWrapper.appendChild(copyOb);
        return divWrapper.innerHTML
    }
    else
        return obj.outerHTML;
}
 
function PrintRadGrid() {
    
    setTimeout(function () { SetColumnValue(); }, 3000);
}
protected void Button1_Click(object sender, EventArgs e)
   {
       RadGrid1.MasterTableView.Columns.FindByUniqueName("ID").Display = false;
       ScriptManager.RegisterStartupScript(this, this.GetType(), "PrintRadGrid", "<script>PrintRadGrid()</script>", false);
   }
 
 
 protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
   {
       dynamic data = new[] {
           new { ID = 1, Name ="Name1"},
           new { ID = 2, Name = "Name2"},
           new { ID = 3, Name = "Name3"},
            new { ID = 4, Name = "Name4"},
           new { ID = 5, Name = "Name5"}
       };
 
       RadGrid1.DataSource = data;
 
   }





Thanks,
Jayesh Goyani
0
Sauge
Top achievements
Rank 1
answered on 14 Mar 2013, 02:41 PM
Thank you, thank you, thank you, thank you, thank you Jayesh!!!!!!

That worked!!!!
0
Anand
Top achievements
Rank 1
answered on 08 Aug 2013, 01:52 PM
Hi Jayesh,

 I tried your code to print. Everything works fine until the print preview window. But when I print the page the Name column is not visible in printed page.

 In my scenario there are multiple columns in the grid, and when I print the grid some of the columns are invisible even after I set the print page alignment to landscape.

May I know how to get all the columns printed?

Thanks & Regards,
Anand
0
Jayesh Goyani
Top achievements
Rank 2
answered on 09 Aug 2013, 10:50 AM
Hello,

If possible then can you please provide your code?

In your code i will try to resolved this issue because in my demo code i am not able to reproduce this issue.

Thanks,
Jayesh Goyani
Tags
Grid
Asked by
Sauge
Top achievements
Rank 1
Answers by
Jayesh Goyani
Top achievements
Rank 2
Sauge
Top achievements
Rank 1
Anand
Top achievements
Rank 1
Share this question
or