Controlling the columns widths

[David Price]

Hello,

I'm using the GRID with dynamic data so the columns are auto generated so my code looks like

and the page looks like this

How can I control the column widths e.g. make column 2 "200px" and column 3 "250px" ?

Also when its in edit mode. I would like to make the height and width a lot larger . Is it possible to control the edit box size independently to the display size ?

Many Thanks

[Vignesh Natarajan]

Hi David, 

Thanks for using Syncfusion products. 

From your query, we understand that you need to define width for autogenerated column in ejGrid. We suggest you to achieve your requirement using DataBound event and columns() method of ejGrid. 

Refer the below code example 

<ej:Grid ID="EmployeesGrid" runat="server" AllowResing="True" AllowScrolling="true" AllowPaging="True"> 

               <ClientSideEvents DataBound="dataBound" /> 

          <ScrollSettings FrozenColumns="2" /> 

        </ej:Grid>    

          <script type="text/javascript"> 

              function dataBound(args){                 

                  this.model.columns[3].width = 250;  

                  this.model.columns[2].width = 200; // based on the index we have define the width of columns 

                  this.columns(this.model.columns); 

              } 

          </script> 

Refer the below screenshot for the output 

 

For your convenience we have prepared a sample which can be downloaded from below link 

Sample: https://www.syncfusion.com/downloads/support/forum/140534/7z/SyncfusionASPNETApplication18381006665  

Refer our help documentation for your reference 

https://help.syncfusion.com/api/js/ejgrid#methods:columns  

https://help.syncfusion.com/api/js/ejgrid#events:databound  

Please get back to us if you have further queries. 

Regards, 

Vignesh Natarajan