Change the cell alignment by using new values

  • Last update:  2022-01-06
  • I. Overview

    1. Problem description

    In the process of making the report, we can set the alignment of the entire row or column of cells uniformly through theAlignment in the cell style. As shown below:

    1.png

    But if you want cells in a row (or column) to have different alignments under different conditions, how to achieve it?

    For example, the North China region is horizontally aligned to the left, and the East China region is horizontally aligned to the right, as shown in the following figure:

    2.png


    2. Solutions

    By adding Conditional Formatting>Add>New to the cell, the new value is expressed by HTML formula, and then the cell content is displayed in HTML.

    Horizontal AlignmentFormula
    Left horizontally

    CONCATENATE("<div align='left'>"+$$$+"</div>")

    Center horizontallyCONCATENATE("<div align='center'>"+$$$+"</div>")
    Right horizontallyCONCATENATE("<div align='right'>"+$$$+"</div>")

    Note: It can also be achieved through the Cell alignment condition attribute plug-in.

    II. Example

    1. Prepare data

    Create a new general report, create a new database query ds1, the SQL query statement is: SELECT * FROM SALES_VOLUME.

    3.png


    2. Template settings

    Drag the field in the data set to the cell and set the content to Center, and change the Data Setting of cell A2 to List. The design table style is shown in the figure below:

    4.png


    3. Set conditional formatting

    1) Select cell A2, add two conditional formattings, and rename them to North China Left Alignmentand China East Right Alignment.

    2) North China left alignment: when the cell value is equal to China North, the new value is the formula: CONCATENATE("<div align='left'>"+$$$+"</div>")

    The function of CONCATENATE() is to combine multiple strings into one string.

    5.png

    3) The same applies to East China right alignment. The new value is the formula: CONCATENATE("<div align='right'>"+$$$+"</div>")

    6.png


    4. Set cell display content

    Set the Cell Attributes> Other> Display Content of cell A2 to Display by HTML. As shown below:

    7.png


    5. Effect preview

    1) PC terminal

    Save the report, click Pagination Preview, the effect is consistent with the rendering in section I.1.Problem description.

    2) Mobile

    Both App and HTML5 are supported, and the effect is shown in the figure below:

    3.png

    III. Template download

    The completed template can be found in: 

    %FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc-EN\ReportApplication\FeaturesApplication\Change the cell alignment by using new values.cpt

    Click to download the template: Change the cell alignment by using new values.cpt

    Attachment List


    Theme: Report Features
    • Helpful
    • Not helpful
    • Only read

    滑鼠選中內容,快速回饋問題

    滑鼠選中存在疑惑的內容,即可快速回饋問題,我們將會跟進處理。

    不再提示

    10s後關閉

    Get
    Help
    Online Support
    Professional technical support is provided to quickly help you solve problems.
    Online support is available from 9:00-12:00 and 13:30-17:30 on weekdays.
    Page Feedback
    You can provide suggestions and feedback for the current web page.
    Pre-Sales Consultation
    Business Consultation
    Business: international@fanruan.com
    Support: support@fanruan.com
    Page Feedback
    *Problem Type
    Cannot be empty
    Problem Description
    0/1000
    Cannot be empty

    Submitted successfully

    Network busy