1

I am searching a (bulk) editable datagrid control for asp.net core project, with following constraints:

  • user should be able to paste multiple values at once (like in Excel), say, I can copy this three numbers and paste it at once in a grid's column:
    1
    2
    3
  • no ribbons, tabs, or other visual controls (but context menu)
  • the gird without A, B, C Excel-like column names,
  • readonly custom column headers
  • editable and also
  • readonly columns (calculated values from other cells)
  • column values should be loaded and updated in db

something similar to this https://demos.devexpress.com/ASPNetCore/Demo/Spreadsheet/Overview/

(this one does not allow - or I don't know how to - direct data binding to a DB datasource)

enter image description here

Improve this question

2 Answers 2

Reset to default
1

Response part 1:

Based on your requirement you can use the Syncfusion’s EJ2 Grid control to achieve it. More details on this including online demos can be checked in the below links,

FT link: https://www.syncfusion.com/aspnet-core-ui-controls/grid

Documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/getting-started-core/

Online demo sample: https://ej2.syncfusion.com/aspnetcore/Grid/GridOverview#/material

The details related to achieving the mentioned constraints in this control are provided below,

Constraint: “No ribbons, tabs, or other visual controls (but context menu)”

As seen in the above shared demo sample link, the EJ2 Grid does not have any additional visual control like ribbon, tab, etc. and the context menu can be rendered for it. More details on using this functionality can be checked in the below links,

Context menu documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/context-menu/

Context menu online sample: https://ej2.syncfusion.com/aspnetcore/Grid/ContextMenu#/material

Constraint: “The grid without A, B, C Excel-like column names and read only custom column headers”

You can render your own read only column names/column headers by using the headerText property of the Grid column definition. More details on achieving this functionality can be checked in the below links,

Header text documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/columns/#header-text

Online demo sample: https://ej2.syncfusion.com/aspnetcore/Grid/DefaultFunctionalities#/material

Regards,

Sujith R

Improve this answer
0
1

Response part 2:

Please find the response for achieving the remaining constraints in the EJ2 Grid control below,

Constraint: “Editable and also read only columns (calculated values from other cells)”

You can enable CRUD actions in the Grid by using its editSettings property. More details on achieving this functionality can be checked in the below links,

Grid edit documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/edit/

Grid edit online sample: https://ej2.syncfusion.com/aspnetcore/Grid/InlineEditing#/material

You can also disable editing for particular columns by disabling the allowEditing property in the required column definition. More details on this can be checked in the below documentation link,

Disable editing documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/edit/#disable-editing-for-particular-column

And for calculating values from other cells, you can use the columns valueAccessor property. More details on achieving this functionality can be checked in the below link,

Value accessor documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/columns/#valueaccessor

Constraint: “User could paste multiple values in an editable column”

You can paste copied values into the Grid columns by copying the required value, selecting the required cell and pressing the ctrl + v key. More details on achieving this functionality can be checked in the below link,

Paste documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/clipboard/#paste

Constraint: “Column values should be loaded and updated in db”

Based on the query we would like to let you know that the EJ2 Grid supports the following in-built adaptors to communicate with the data source in the back-end – URL, OData, ODataV4, Remote Save, Web API and WebMethod adaptor. Each adaptor uses a different way to send and receive requests and response from remote services. They are explained in the below documentation link which you can check for more details,

Documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/data-binding/#remote-data

URL adaptor: https://ej2.syncfusion.com/aspnetcore/documentation/grid/edit/#url-adaptor

If you need to access the data from your db through server controller methods then our suggestion is to use the URL adaptor for it.

Please find the below ASP.NET Core sample prepared based on the above queries for your reference,

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/GridApplication-1263864030

Note: A local MDF file is used in the above sample to assign and process the data. So before running the sample, please make sure the connection for this file is established in the server explorer and the correct connection string is provided OrderDbContext.cs file in the application.

Regards,

Sujith R

Improve this answer
8
  • Since the response contained more than 8 reference links, it could not be updated as i did not have enough reputation score. That is why i had split the response into two parts.
    – user7337901
    Feb 23, 2021 at 15:37
  • I read from the docs that "Since the string values are not parsed to number and date type, so when the copied string type cells are pasted to number type cells then it will display as NaN"... now because the pasted values are mainly numbers that means syncfuction Grid does not meet the criteria of paste functionnality
    – serge
    Feb 23, 2021 at 15:58
  • Due to the maximum character restrictions that can be updated in the comment, i am splitting the response below into three parts.
    – user7337901
    Feb 24, 2021 at 9:30
  • Response part 1: The Syncfusion EJ2 Grid’s paste functionality limitation is that, when you try to paste a string value to a number/date type column then it will be shown as NaN or empty cell respectively (the column type is assigned based on the first column value of your dataSource ). This is because before pasting a value in the number type column it will be parsed.
    – user7337901
    Feb 24, 2021 at 9:30
  • Response part 2: So when a string value is parsed it will return NaN which will therefore be pasted in the cell(you need to paste value is only original type of the column). Similarly when pasting to a date type column it will try to convert the string to Date object which will return an invalid date message so the cell will become empty. This is the case that is mentioned in the limitation section.
    – user7337901
    Feb 24, 2021 at 9:30

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.