We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Column headers in the grid are not coming out properly.

hi. 

When I put the checkbox in the grid column, the column column fails as shown in the picture below.



The data sources are as follows:

//view

<ejs-grid id="InformGrid" gridLines="Both" allowSorting="false" allowResizing="true" allowTextWrap="true" rowSelecting="RowsSelecting" queryCellInfo="customiseCell" height="100%" rowHeight="30" created="ViewLoad">
                <e-grid-textwrapsettings wrapMode="Header"></e-grid-textwrapsettings>
                <e-grid-selectionsettings checkboxOnly="true" mode="Row"></e-grid-selectionsettings>
                <e-grid-columns>
                    <e-grid-column field="VIEW_NO" headerText="NO." headerTextAlign="Center" textAlign="Center" width="40"></e-grid-column>
                    <e-grid-column field="DOC_NO" headerText="Doc No." headerTextAlign="Center" textAlign="Center" width="100"></e-grid-column>
                    <e-grid-column field="DOC_TITLE" headerText="Doc Title" headerTextAlign="Center" textAlign="Left" width="170"></e-grid-column>
                    <e-grid-column field="ITEM_NO" headerText="Item No." headerTextAlign="Center" textAlign="Left" width="120"></e-grid-column>
                    <e-grid-column field="STAGE_NM" headerText="Stage" textAlign="Center" width="40"></e-grid-column>
                    <e-grid-column field="INFORM" headerText="Inform Day" format="yyyy-MM-dd" textAlign="Center" width="70"></e-grid-column>
                    <e-grid-column field="STATUS" headerText="STATUS" textAlign="Center" width="60"></e-grid-column>
                    <e-grid-column headerText="Inform Received" textAlign="Center"
                                   columns="@(new List<Syncfusion.EJ2.Grids.GridColumn>() {
                                                new Syncfusion.EJ2.Grids.GridColumn { Field = "DATA_CHECK", HeaderTextAlign = Syncfusion.EJ2.Grids.TextAlign.Center,TextAlign = Syncfusion.EJ2.Grids.TextAlign.Center,Width="110", MinWidth="10", Type="checkbox"}})">
                    </e-grid-column>
                </e-grid-columns>
            </ejs-grid>

1 Reply

RS Rajapandiyan Settu Syncfusion Team March 13, 2023 01:26 PM UTC

Hi Taewook,


Thanks for contacting Syncfusion support.


Before proceeding with your query, kindly share the below details to validate further.


  1. Are you facing the border style issue with the last column header?
  2. Share the Grid script and style sheet version you have used.
  3. Which theme (bootstrap/material/fabric/etc.) did you refer to the Syncfusion component?
  4. Do you use any custom CSS for the EJ2 Grid component? If yes, share the code details.
  5. Why do you want to show the checkbox type column in the stacked column?


Regards,

Rajapandiyan S


Loader.
Live Chat Icon For mobile
Up arrow icon