Hi
I want some clarification on the new IgrGrid (www.infragistics.com/.../data-grid).
1) Earlier in IgrDataGrid we have IgrDateTimeColumn in which we can display DateTime in our format but now in IgrGrid we have IgrColumn in which I'm unable to display DateTime in this format -> (dd/mm/yyyy, hours:min:sec AM). I used the same approach that I have used earlier but the format which is appearing on the UI is (month date, year,hours:min:sec AM) eg: (July 20, 2023, 10:14:06 AM). So how can I display the same in (dd/mm/yyyy, hours:min:sec AM) format (eg: 07/10/2023, 10:14:06 AM).
2) Earlier in IgrDataGrid we set a property "sortable:true" in a column in order to give the functionality of sorting and same we can do in IgrGrid, but in IgrDataGrid the sorting indicator can only be seen when we click on the header but in IgrGrid the sorting indicator can be seen from the very starting. So, how to display the sorting indicator only when we click on the header?
3) In IgrDataGrid we have grid.loadLayout() (at time of grid ref) option but now in IgrGrid I'm unable to find this option. So how to use loadLayout and saveLayout thing in IgrGrid?
4) In IgrGrid when we display the grid on UI without data then in the middle it is written that "Grid has no data" (refer the ss attached). How to remove this text and keep it blank?
Please refer all the above mentioned points and suggest the approach to achieve the same point wise.
Best RegardsBharat
Hello Bharat,
Thank you for your post on this matter. I will answer your inquiries in the order they were asked.
1. In the IgrGrid, the columns expose a property called formatter that allows you to define a function to format the data in that column and provide the string that you wish to display. The signature for this function looks like the following:
public myFormatter(value: any, rowData: any){ return "FORMATTED STRING HERE"; }
The value parameter in this case will be the cell value being formatted and the rowData will be the full underlying data item to the row. You will need to parse your date value and return it in the value that you wish to see.
2. The current behavior of the IgrGrid is that you need to click on the sort indicator to sort the column and it will be highlighted if the column is sorted. If you hide all of the sort indicators initially, you will not be able to sort the column without some additional application code.
If you wish to go the application code route though, you will need to use the headerTemplate property of the columns and provide a template for your headers that hooks a click event so you can detect a click in the header. In that click event, you would need to modify the sortingExpressions collection of the grid.
3. Save and load layout is something that is under development for the IgrGrid component and will be available in a future version.
4. You can utilize the emptyGridMessage property on the grid for this. If you set this to an empty string, you should be able to remove it.
Please let me know if you have any other questions or concerns on this matter.
Thanks Andrew for the response.
Please provide an alternative approach for Load and Save Layout, because we have dependent functionality in our grid. Also when we can expect the new version that will have these API?
I unfortunately do not have an alternative approach to the save and load layout in this case. This is a feature that is under development and if you are looking for an alternative, my best recommendation is to continue using the IgrDataGrid control as this has the save and load layout built in.
The alternative while still using the IgrGrid would be to write out the different pieces that you are looking to save to a text file or something of the like, and then you would need to read that text file back and apply the customizations to the grid – essentially creating the feature yourself within your application. This would not be trivial.
As for when the save and load layout will be available, I do not have a concrete release date for this feature, but we are tentatively shooting for sometime in Q1 of 2024.
When can we expected for Save and Load Layout will be Available in the new Grid?
The save and load layout methods are now available with the release of Ignite UI for React 18.4.0. You can read about this feature here: https://www.infragistics.com/products/ignite-ui-react/react/components/grids/grid/state-persistence