ParamQuery grid support forum

General Category => Help for ParamQuery Pro => Topic started by: STEVE on July 11, 2022, 07:49:22 pm

Title: Indent string of a volumn as much as value of the another column
Post by: STEVE on July 11, 2022, 07:49:22 pm
Dear paramvir,

First column is level, secon column is task.  I want to know how to indent the string of the task column according to the value of the level column.    I guess there is some similiar codes.  Would you give me the best example for the indent the text string with the related value?

Code: [Select]
columnTemplate: {
render: function(ui){
if( !ui.rowData.pq_gtitle && ui.colIndx < this.option('groupModel.dataIndx').length ){
return "<p style='text-indent:20px;'>"+ui.cellData+"</p>";
}
}
},

Best Regards,
Steve
Title: Re: Indent string of a volumn as much as value of the another column
Post by: paramvir on July 12, 2022, 11:28:10 am
Indent is added to a cell by using 'text-indent' css.

Please share a jsfiddle or a screenshot of your requirements to get more specific help.
Title: Re: Indent string of a volumn as much as value of the another column
Post by: STEVE on July 12, 2022, 07:03:05 pm
It is important for reviewers to read the data from the grid with ease and comfort.
Please see below my example of what I wanted to do.

Code: [Select]
Suppose there are only 2 columns, level, and task.
----------------------------------------------------------------------------
       level             task
----------------------------------------------------------------------------
         1         You are a genius.
         2                you are a genius.
         3                       you are a genius.
         4                              you are a genius.   
----------------------------------------------------------------------------
 if level 1 then indent 1 tab
 if level 2 then indent 2 tab
 if level 3 then indent 3 tab
 if level 4 then indent 4 tab


I hope everything is clear to understand about this each other.     
Title: Re: Indent string of a volumn as much as value of the another column
Post by: paramvir on July 13, 2022, 01:43:27 pm
you can add this render to task column

Code: [Select]
render: function(ui){
return {
style: {'text-indent':  (ui.rowData.level * 3) + "px"}
}
}