Multicolumn report - Horizontal display

19 posts, 0 answers
  1. Paul
    Paul avatar
    6 posts
    Member since:
    Aug 2008

    Posted 12 Nov 2008 Link to this post

    Hello,

    I'm creating a multicolumn report where i need to display pictures related to an item.
    Let's say the item have 5 different pictures and i need to display 3 pictures per row.

    Her's my example on how i wish to display pictures of the item:
    Column1             Column2             Column3
    Image1.gif            Image2.gif            Image3.gif         
    Image4.gif            Image5.gif            

    So i set up the number of column (ColumnCount) to 3 for the detail section. 
    But the only problem i found is the report won't display the pictures in the way i want. The report start displaying pictures column by column. And, if these 5 pictures doesn't fit in one column then the report will fill the 2nd column and so on...

    Here's the output of the report:
    Column1             Column2             Column3
    Image1.gif            Image5.gif
    Image2.gif            
    Image3.gif            
    Image4.gif            

    So my whole target is to have a way to diplay my picture in an horizontal way (as shown in the example above) and not in vertical way.

    Does anyone have an idea on how to fix my problem ?
    Thank you.

    Paul
  2. Steve
    Admin
    Steve avatar
    10941 posts

    Posted 12 Nov 2008 Link to this post

    Hi Paul,

    Currently we do not support cross to down direction for the items. Unfortunately we cannot engage with a specific time-frame for this functionality as our current goal is to cover some other major features that are still missing such as richtextbox item, crosstab, table item etc.

    Sorry for the inconvenience.

    Regards,
    Steve
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. Paul
    Paul avatar
    6 posts
    Member since:
    Aug 2008

    Posted 12 Nov 2008 Link to this post

    Hi Steve,

    Thank you for your quick answer ...
    I hope you can this feature in the upcoming versions ...

    Is there any other way to do what i'm looking for ? Like doing some loops and add dynamically images while rendering my report ?
    If yes, can you send me a sample code  ?

    Thank you,

    Paul
  4. John
    John avatar
    3 posts
    Member since:
    Dec 2010

    Posted 10 Dec 2010 Link to this post

    We recently started using Telerik Reporting and was interested to know if there is any update on when this feature might be added to the reporting package?

    We have multiple reports that would benefit from cross to down rendering of data.

    Any answer would be helpful,

    John Burkle
  5. Steve
    Admin
    Steve avatar
    10941 posts

    Posted 10 Dec 2010 Link to this post

    Hello John,

    The current logic of the multicolumn implementation does not allow for such change in feasible way. If we figure out a way to change this, we would do it, but for the time being we would support only down then across layout.

    Greetings,
    Steve
    the Telerik team
    Get started with Telerik Reporting with numerous videos and detailed documentation.
  6. Joel Reinford
    Joel Reinford avatar
    32 posts
    Member since:
    Sep 2004

    Posted 12 Jan 2011 Link to this post

    Am I to understand that Telerik's position on multi-column layout direction is "we can't do it?" That answer is hard to accept. Please clarify if this is on a future roadmap or if you have no plans to implement this feature.
  7. Louis Bouchard
    Louis Bouchard avatar
    94 posts
    Member since:
    Feb 2010

    Posted 17 Jan 2011 Link to this post

    I'm facing the same problem and it's ***crucial*** for me to print some information in the horizontal display.  Can you suggest some workaround please?
  8. John
    John avatar
    3 posts
    Member since:
    Dec 2010

    Posted 17 Jan 2011 Link to this post

    I devised a workaround to solve my issue requiring a horizontal display of data although it may not work for all problems.

    I use the NeedDataSource method and build a DataSet/DataTable to binf to the report's DataSource. Here is some example code (C#):

    using System.Data;
      
    private void MyReport_NeedDataSource(object sender, EventArgs e)
            {
                DataSet ds = new DataSet();
                DataTable dt = new DataTable();
                DataColumn dc;
                DataRow dr;
      
                #region Build Column Structure
      
                dc = new DataColumn();
                dc.DataType = Type.GetType("System.String");
                dc.ColumnName = "Display1";
                dt.Columns.Add(dc);
      
                dc = new DataColumn();
                dc.DataType = Type.GetType("System.String");
                dc.ColumnName = "Value1";
                dt.Columns.Add(dc);
      
                dc = new DataColumn();
                dc.DataType = Type.GetType("System.String");
                dc.ColumnName = "Display2";
                dt.Columns.Add(dc);
      
                dc = new DataColumn();
                dc.DataType = Type.GetType("System.String");
                dc.ColumnName = "Value2";
                dt.Columns.Add(dc);
      
                dc = new DataColumn();
                dc.DataType = Type.GetType("System.String");
                dc.ColumnName = "Display3";
                dt.Columns.Add(dc);
      
                dc = new DataColumn();
                dc.DataType = Type.GetType("System.String");
                dc.ColumnName = "Value3";
                dt.Columns.Add(dc);
      
                dc = new DataColumn();
                dc.DataType = Type.GetType("System.String");
                dc.ColumnName = "Display4";
                dt.Columns.Add(dc);
      
                dc = new DataColumn();
                dc.DataType = Type.GetType("System.String");
                dc.ColumnName = "Value4";
                dt.Columns.Add(dc);
      
                dc = new DataColumn();
                dc.DataType = Type.GetType("System.String");
                dc.ColumnName = "Display5";
                dt.Columns.Add(dc);
      
                dc = new DataColumn();
                dc.DataType = Type.GetType("System.String");
                dc.ColumnName = "Value5";
                dt.Columns.Add(dc);
      
                ds.Tables.Add(dt);
      
                #endregion Build Column Structure
      
                    var aMyData = MyDataFromTheDataBase.ToArray();
      
                    int rows = Convert.ToInt32(Math.Ceiling(Convert.ToDouble(aMyData.Count()) / 5));
      
                    for (int k = 0; k < rows; k++)
                    {
                        dr = dt.NewRow();
      
                        for (int r = 1; r <= 5; r++)
                        {
                            int optionIndex = (5 * k) + (r - 1);
      
                            if (optionIndex < aMyData.Count())
                            {
                                MyData data = (MyData)aMyData[optionIndex];
      
                                switch (r % 5)
                                {
                                    case 0:
                                        dr["Value5"] = data.Value;
                                        dr["Display5"] = data.Display;
                                        break;
                                    case 1:
                                        dr["Value1"] = data.Value;
                                        dr["Display1"] = data.Display;
                                        break;
                                    case 2:
                                        dr["Value2"] = data.Value;
                                        dr["Display2"] = data.Display;
                                        break;
                                    case 3:
                                        dr["Value3"] = data.Value;
                                        dr["Display3"] = data.Display;
                                        break;
                                    case 4:
                                        dr["Value4"] = data.Value;
                                        dr["Display4"] = data.Display;
                                        break;
                                }
                            }
                        }
      
                        dt.Rows.Add(dr);
                    }
                }
      
                this.DataSource = ds.Tables[0].DefaultView;
            }

    Then in the report Details section there is:
        [=Display1]        [=Display2]        [=Display3]        [=Display4]        [=Display5]    
        [=Value1]           [=Value2]          [=Value3]           [=Value4]           [=Value5]    

  9. Carsten Koster
    Carsten Koster avatar
    25 posts
    Member since:
    Sep 2006

    Posted 14 Jun 2011 Link to this post

    Hi Steve,
    this is also important for us.
    We also want to display Images in Multi-Columns.
    Please work on this feature...
    Thanxs

    Carsten
  10. Steve
    Admin
    Steve avatar
    10941 posts

    Posted 14 Jun 2011 Link to this post

    Hi guys,

    The detail section is printed once for every row in the data source similarly to a repeater and this happens vertically. The columns actually represent the separate pages of the report, which are treated as logical pages rendered on the same physical page. Columns are arranged from left to right, top to bottom, and are separated by white space between each, and data flow in the columns is top to bottom, left to right. If the report is divided into more than one column, each physical page is divided vertically into columns, each of which is considered a logical page. The easiest way to visualize this is imagining the columns in a newspaper.
    That said, the current implementation of multi-column layout is not due to technical limitation, but it represents our understanding on the functionality. Standards for mailing label for example cover their size, space between columns etc, but the flow is not standardized and can be handled as needed.

    The inclusion of Crosstab item to Telerik Reporting allows you to handle such scenario with some manual preparation of the data. We have prepared a sample project and video showing how to accomplish this task.

    Regards,
    Steve
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  11. great neal
    great neal avatar
    1 posts
    Member since:
    Mar 2010

    Posted 19 Jun 2013 Link to this post

    Good job, thx Steve.
  12. Pierrick
    Pierrick avatar
    5 posts
    Member since:
    Oct 2010

    Posted 30 Oct 2013 Link to this post

    Hello,

    I need to create a similar report. I manage to have each item of my report going from left to right. 

    Unfortunately my customer wants dynamic content. Which means dynamic number of columns and being able to select the data that will be displayed inside a cell. It's to generate a product catalog.

    I used a similar layout than the Product Tag demo:
    http://demos.telerik.com/reporting/product-tags/html5Demo.aspx

    So basically I built a report with all the possible data my customer wants to show. by using CanShrink property to Tru on textBox I manage to get everything condensed when I ask the report to hide some data.

    By using the ItemDataBinding event I manage to resize the Height of the panel containing all my textboxes.

    private void panelDetail_ItemDataBinding(object sender, EventArgs e)
    {
          ReportItem lastItem = (ReportItem)(this.panel2.Items.Where(item => item.Visible == true).Last());
          this.panel2.Height = Unit.Cm(lastItem.Location.X.Value + lastItem.Height.Value);
    }

    I would like to be able to resize the row of my table as well. I tried a similar approach. 

    foreach (TableBodyRow row in this.table1.Body.Rows)
    {
        row.Height = Unit.Cm(this.panel2.Location.X.Value + this.panel2.Height.Value + 0.3);
    }

    I tried as well to change the size of all parents Items of my panel2 (which is resized correctly). 

    But unfortunately all my rows keep the initial height define in the designer.

    Is there any way to bind the Height of the table directly to an expression which will get the position of my panel2?

    I attached some pictures to explain better the issue. basically I want to reduce the area with the red arrows at the minimum.


    EDIT:
    Actually I was setting a much lower value than expected to the row. I succesfully with this code manage to increase the size of my row but it's not possible de reduce the size. Any idea?
  13. Stef
    Admin
    Stef avatar
    3610 posts

    Posted 04 Nov 2013 Link to this post

    Hi Pierrick,

    Instead of using events, try to use conditional formatting rules to show/hide items in the report and bindings as described in the Collapse the container when hiding child report items KB article to reduce the section's Height.

    About hiding Table/Crosstab rows, please use Filter defined on the row/column group. This can be done from the Group Explorer. Whether the row/column will be filtered in/out (shown/hidden) can depend on a report parameter or other custom expression based on data field from the item's DataSource.

    If you need further help, please elaborate on the scenario and how the user controls what will be visible, and the report layout and how it is built.

    Regards,
    Stef
    Telerik

    Have you tried the new visualization options in Telerik Reporting Q2 2013? You can get them from your account.

  14. Pierrick
    Pierrick avatar
    5 posts
    Member since:
    Oct 2010

    Posted 08 Nov 2013 Link to this post

    Hello,

    Due to time constraint I didn't had the time the test your solution yet. I manage to have the expected result by manually creating the controles in code behind during the NeedDataSource event.

    Basically the user is using a web application with a form containing check boxes so they can select wich field will be available in the report for each item. Such as "Code Article" in the previous screenshot. They can choose to hide or display it.

    I will try your solution to bind the Height to 1px to see if I can remove all my code behind. and will let you know how it goes.

    Thanks for your answer.

    Pierrick
  15. Pierrick
    Pierrick avatar
    5 posts
    Member since:
    Oct 2010

    Posted 20 Nov 2013 Link to this post

    Hello,

    I finally got some time for testing your answer.

    It seems that I'm facing some problem linked to the fact I'm using a table. As said before I need to display items in a catalogue with flexible number of columns. To achieve this I used a table.

    In attachment you'll have a screenshot of the report explorer to see the hierarchie of report items.

    I added in my table a list. By doing so in the properties I don't see the Height property anymore but only a RowHeight property which is not available in the list of Bindings. Is it possible to bind "1px" to RowHeight property? 

    So I tried to bound the Height of my table to 1px but it didn't change anything.
  16. Peter
    Admin
    Peter avatar
    1648 posts

    Posted 25 Nov 2013 Link to this post

    Hello Pierrick,

    The solution with setting the height property is only relevant for report sections/items. In case of table/list/crosstab items our recommendation is to use group filters. This can be done from the Group Explorer. Whether the row/column will be filtered in/out (shown/hidden) can depend on a report parameter or other custom expression

    If you want to hide certain textbox from the list's panel, you can decrease the panel height and set the textbox visible property with binding.

    If you need additional assistance we will appreciate if you open a support thread to send us the problematic report definition to review on our end.

    Regards,
    Peter
    Telerik

    New HTML5/JS REPORT VIEWER with MOBILE AND TOUCH SUPPORT available in Telerik Reporting Q3 2013! Get the new Reporting version from your account or download a trial.

  17. IamSalik
    IamSalik avatar
    14 posts
    Member since:
    Dec 2012

    Posted 15 Jun 2015 Link to this post

    Hello Steve,

     I am looking for across then down data rendering solution for stand alone (.trdx) reports. Is it available now?

  18. Nasko
    Admin
    Nasko avatar
    1045 posts

    Posted 15 Jun 2015 Link to this post

    Hello IamSalik,

    The scenario is supported via the List report item. For more information, please refer to the How to: Create Multi-Column Report - Across the Page and Then Down KB article.

    Regards,
    Nasko
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  19. IamSalik
    IamSalik avatar
    14 posts
    Member since:
    Dec 2012

    Posted 15 Jun 2015 Link to this post

    Thanks a lot Telerik Team,

    I got it my solution and very pleased with your service :)

    Thanks again
    Regards
    Salik

     

Back to Top