Set a max width on column

Hello,

Is it possible to set a max width on one ore more columns ? 

I want to set a default columns size with 500px, so for this I use 

 this.spreadsheetObj.setColWidth(500, 0, 0);

on each columns of all sheet, it works very well. 

But on some columns, the text could be very short so I want to set a max width only. 

please see this example : https://stackblitz.com/edit/angular-dm856g-drjsuv 
As you can see , the size of the firs column is to large for the text. But I want to define a max width, because in some cas, text in cell can be very long. 


Is to possible to do this ? 
Thank you very much
Kindest regards, 



3 Replies 1 reply marked as answer

SP Sangeetha Priya Murugan Syncfusion Team November 5, 2020 12:39 PM UTC

Hi Sébastien Burel, 
 
Thank you for contacting Syncfusion support. 
 
We have checked your reported requirement to set the maximum width of the columns and it can be achievable in our Spreadsheet by using the autoFit and setColWidth method. Please find the code example, in this we have set the maximum width (500) for the column which is greater than maximum width. 
 
created() { 
    var actSheet = this.spreadsheetObj.getActiveSheet(); 
    this.spreadsheetObj.autoFit( 
      "A:" + getColumnHeaderText(actSheet.columns.length) 
    ); // set width for columnn based on the maximun text width. 
 
    // Set a max-width here : 
    for (var i = 0; i < actSheet.columns.length; i++) { 
      if (actSheet.columns[i].width > 500) 
        this.spreadsheetObj.setColWidth(500, i, 0); // set maximum width that has greater than maximum width of 500 
    } 
  } 
 
For your conveinece, we have prepared the sample based on our suggestion. Please find the link below. 
 
 
Could you please check the above sample and get back to us more details, if we misunderstood your requirement or need further assistance on this. 
 
Regards, 
Sangeetha M 




SB Sébastien Burel November 8, 2020 03:08 PM UTC

hello Sangeetha 

Thank you very much for your answer.

However, I use spreadsheet in a different way , I use it like this exemple on doc : https://ej2.syncfusion.com/angular/documentation/api/spreadsheet/ 
I mean with a div and not with ejs-spreadsheet tag. please see my fork :

https://stackblitz.com/edit/angular-dm856g-m2iuld?file=app.component.ts

As you can see, I cant see columns on each sheet, and thereforre I cannot make a condition on column width. 

Please can you tell how I can get col width with my code ? 
Thank you

Kindest regards, 


SP Sangeetha Priya Murugan Syncfusion Team November 9, 2020 10:26 AM UTC

 
Thank you for your update. 
 
We have checked your reported requirement and we are able to achieve in spreadsheet by using the created event as we have suggested previously. You can get the columns width in sheet model as like in the below code example by using the getActiveSheet method. 
 
created: () => { 
          this.spreadsheetObj.cellFormat( 
            { 
              fontWeight: "bold", 
              textAlign: "center", 
              verticalAlign: "middle" 
            }, 
            "A1:F1" 
          ); 
          var actSheet = this.spreadsheetObj.getActiveSheet(); 
          this.spreadsheetObj.autoFit( 
            "A:" + getColumnHeaderText(actSheet.columns.length) 
          ); // set width for columnn based on the maximun text width. 
 
          // Set a max-width here : 
          for (var i = 0; i < actSheet.columns.length; i++) { 
// actSheet.columns returns the columns width 
            if (actSheet.columns[i].width > 500) 
              this.spreadsheetObj.setColWidth(500, i, 0); // set maximum width that has greater than maximum width of 500 
          } 
        } 
 
For your convenience, we have modified our previously updated sample based on your requirements. Please find the link below. 
 
 
Could you please check the above details and get back to us, if you need any further assistance on this. 
 
Regards, 
Sangeetha M 


Marked as answer
Loader.
Up arrow icon