Remove Spin button Child Grid

Hello,

How do I remove spin button in this chile grid?

Thanks

Image_3594_1697569208068


 @{

                    var ChildGrid = new Syncfusion.EJ2.Grids.Grid()
                        {
                            Locale = "pt",
                            QueryString = "TabelaConsumoId",
                            EditSettings = new Syncfusion.EJ2.Grids.GridEditSettings() { ShowDeleteConfirmDialog = true, AllowAdding = true, AllowEditing = true, AllowDeleting = true },
                            Toolbar = new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" },
                            Columns = new List<Syncfusion.EJ2.Grids.GridColumn> {
                new Syncfusion.EJ2.Grids.GridColumn(){ Format="N2", Field="Inferior", HeaderText="Inferior", EditType="numericedit" },
                new Syncfusion.EJ2.Grids.GridColumn(){ Format="N2", Field="Superior", HeaderText="Superior", EditType="numericedit" },
                new Syncfusion.EJ2.Grids.GridColumn(){ Format="N2", Type="number", Field="Taxa", HeaderText="Taxa", EditType="numericedit", Edit="@(new { @params = new Syncfusion.EJ2.Inputs.NumericTextBox() { ValidateDecimalOnType = true, Decimals = 2, ShowSpinButton = false }})" },
                new Syncfusion.EJ2.Grids.GridColumn(){ Field="Fixa", HeaderText="Fixa", DisplayAsCheckBox=true, EditType="booleanedit" }
                            }
                        };
                }



6 Replies 1 reply marked as answer

FE Fernando November 1, 2023 12:58 PM UTC

Hello,

Could you help me in this case?

Thanks



SI Santhosh Iruthayaraj Syncfusion Team November 8, 2023 02:15 PM UTC

Hi Fernando,


We apologize for the delay in our response.


We have reviewed the screenshot you provided, but we cannot identify any spin button in the image. To further investigate your query, please provide us with the following information:


  1. Are you referring to the "loadingIndicator" as the spin button?
  2. If yes, in what specific situation (action) does the Grid display the loadingIndicator?
  3. If you are not referring to the loadingIndicator, please clearly explain what you mean by "spin button" and when it appears in the Grid.
  4. Typically, the loadingIndicator is displayed in the Grid component whenever an action is in progress. It is hidden once the action completes successfully. In some cases, if the action fails, the loadingIndicator will remain visible indefinitely. Please ensure that you have handled all actions correctly for the Grid to function properly.
  5. Please provide us with the complete Grid rendering code.
  6. Please share the Syncfusion package version you are using.
  7. Additionally, please provide a clear explanation of the issue along with a video demonstration of the problem. This will help us better understand your query and provide a more relevant solution.


Thank you for your cooperation.


Regards,

Santhosh I



FE Fernando November 8, 2023 02:32 PM UTC

Hi Santhosh

I'm sorry, I was referring to these two arrows, one pointing up and the other down. I would like to remove them. Thank you very much.

Image_1093_1699453787544

 @{
                    var ChildGridAgua = new Syncfusion.EJ2.Grids.Grid()
                        {
                            Locale = "pt",
                            QueryString = "TabelaConsumoId",
                            EditSettings = new Syncfusion.EJ2.Grids.GridEditSettings() { ShowDeleteConfirmDialog = true, AllowAdding = true, AllowEditing = true, AllowDeleting = true },
                            Toolbar = new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" },
                            Columns = new List<Syncfusion.EJ2.Grids.GridColumn> {
                new Syncfusion.EJ2.Grids.GridColumn(){ Format="N2", Field="Inferior", HeaderText="Inferior", EditType="numericedit" },
                new Syncfusion.EJ2.Grids.GridColumn(){ Format="N2", Field="Superior", HeaderText="Superior", EditType="numericedit" },
                new Syncfusion.EJ2.Grids.GridColumn(){ Format="N2", Type="number", Field="Taxa", HeaderText="Taxa", EditType="numericedit", Edit="@(new { params = new Syncfusion.EJ2.Inputs.NumericTextBox() { ValidateDecimalOnType = true, Decimals = 2, ShowSpinButton = false }})" },
                new Syncfusion.EJ2.Grids.GridColumn(){ Field="Fixa", HeaderText="Fixa", DisplayAsCheckBox=true, EditType="booleanedit" }
                            }
                        };
                }


                <ejs-grid id="GridTabelaAgua" locale="pt" gridLines="Both" childGrid="ChildGridAgua" detailDataBound="detailDataBound" toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })">
                    <e-data-manager url="@Url.Action("TabelaAgua_Read","Tabelas")"
                                    insertUrl="@Url.Action("TabelaAgua_Create","Tabelas")"
                                    removeUrl="@Url.Action("TabelaAgua_Delete","Tabelas")"
                                    updateUrl="@Url.Action("TabelaAgua_Update","Tabelas")"
                                    adaptor="UrlAdaptor"></e-data-manager>
                    <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" mode="Normal"></e-grid-editSettings>
                    <e-grid-columns>
                        <e-grid-column field="NomeTabela" headerText="Tabelas" type="string" ></e-grid-column>
                    </e-grid-columns>
                </ejs-grid>


SI Santhosh Iruthayaraj Syncfusion Team November 9, 2023 09:33 AM UTC

Hi Fernando,


To change the Editor Component, utilize the "Column.EditType" property. The up and down arrow are rendered because you have set the "EditType" as "numericedit". For the "numericedit" type, the Grid will use our Numeric Text Box component. If you prefer not to render the Numeric Text Box component, set the "EditType" as "stringedit". This ensures the normal Text Box component is rendered for that particular column editor.


Please find the modified code snippet below for your reference:


[CSHTML]

 

    var ChildGridAgua = new Syncfusion.EJ2.Grids.Grid({

          .  .  .  .  .

Columns = new List<Syncfusion.EJ2.Grids.GridColumn> {

                new Syncfusion.EJ2.Grids.GridColumn(){ Format="N2", Field="Inferior", HeaderText="Inferior", EditType="stringedit" },

                new Syncfusion.EJ2.Grids.GridColumn(){ Format="N2", Field="Superior", HeaderText="Superior", EditType="stringedit" },

                new Syncfusion.EJ2.Grids.GridColumn(){ Format="N2", Type="number", Field="Taxa", HeaderText="Taxa", EditType="stringedit", Edit="@(new { params = new Syncfusion.EJ2.Inputs.NumericTextBox() { ValidateDecimalOnType = true, Decimals = 2, ShowSpinButton = false }})" },

                new Syncfusion.EJ2.Grids.GridColumn(){ Field="Fixa", HeaderText="Fixa", DisplayAsCheckBox=true, EditType="booleanedit" }

                            }

                        };

                }

 


For more information about Edit Types and the list of available Edit Types, refer to the documentation link below:


Documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/editing/edit-types


Regards,

Santhosh I


Marked as answer

FE Fernando November 9, 2023 12:34 PM UTC

Hi,

Ok it works.

Thank you very much.




SI Santhosh Iruthayaraj Syncfusion Team November 9, 2023 01:36 PM UTC

Hi Fernando,


We are glad to hear that the provided solution helped resolve the issue. Please feel free to reach out to us if you require any further assistance.


Regards,
Santhosh I


Loader.
Up arrow icon