Posted 27 June 2021, 10:14 pm EST
Hello,
Is there a way to add style or class to a single cell in the flexgrid.
Like if i want a single cell to change background color.
Best Regard,
Emil
Single cell in flexgrid
Posted by: ehh on 27 June 2021, 10:14 pm EST
-
ehh
-
manish.gupta
Posted 29 June 2021, 1:18 am EST
Hi,
You may format the cells using the CellFactory. Please refer to the following demo sample for reference:
https://demos.componentone.com/blazor/blazorexplorer/FlexGrid/ConditionalFormattingHope it helps!
Regards,
Manish Gupta -
ehh
Posted 29 June 2021, 5:57 pm EST
Hello Manish,
Thanks for the answer, im not sure i can use the CellFactory for my problem. But maybe you can help if i explain it a little more.I have an object for each cell in my grid, and im building my grid unbound.
Each cell have following properties.Value,
BackColor,
Format,
EditedIs there a way to parse my cell objects to the CellFactory, and set the formatting and backcolor there or is that not posible?.
Hope it describes the problem a little better :).
Best Regards,
Emil -
manish.gupta
Posted 30 June 2021, 8:56 pm EST
Hi Emil,
Please refer to the following demo sample for reference which has the MyCell class having Value, BackColor, Format and Edited property and the FlexGrid values are set and formatting is done using Unbound mode with CellFactory.Regards,
Manish Gupta
FlexGrid_UnboundGridStyling.zip -
ehh
Posted 30 June 2021, 10:51 pm EST - Updated 29 September 2022, 12:48 am EST
Thanks for the great demo, this is exactly what im looking for.
There is now a different problem, when i try and edit my cell i get the name of the class. When i would like to get the value of the object.Image from your demo.
Best Regards,
Emil -
manish.gupta
Posted 1 July 2021, 8:11 pm EST
Hi Emil,
For this, we need to override the OnCellEditorCreated and OnEditEnded method for GridCellFactory.
Please refer to the attached sample for reference.Regards,
Manish Gupta -
ehh
Posted 2 July 2021, 12:13 am EST
You did it agian, your demo pointed me in the right direction.
Thanks a lot for the help.
Best Regards,
Emil -
ehh
Posted 25 July 2021, 11:05 pm EST
I seem to have run into a new problem after some testing, when i select a cell, and want to start typing in a quick edit fashion, the first input I enter is dropped and the cell becomes editable. Is there a way to enable quick edit when using the cellfactory and the OnCellEditorCreated.
Best Regards,
Emil -
manish.gupta
Posted 26 July 2021, 8:57 pm EST
Hi Emil,
For this, we need to write a JS function to retain the first character input. This method should be called once the page is rendered.
Please refer to the attached sample and the following code snippet:function Editor() { var grid = document.getElementById("grid-wrapper"); grid.addEventListener("keydown", function (e) { var _inputs = grid.querySelectorAll("input"); setTimeout(function () { var inputs = grid.querySelectorAll("input"); if (inputs[1] && _inputs.length == 1) { _inputs = 2; inputs[1].value = inputs[0].value; } },20) },true) }Regards,
Manish Gupta -
ehh
Posted 4 January 2024, 10:07 pm EST
Hello Manish
The solution you supplied seemed to be working fine when I implemented it in my own solution, but when our users started to use the system, there seems to be a problem with the delay not working as intended.
Sometimes when the user wants to edit a cell in the grid in a quick edit fashion, by selecting the cell and pressing a key, the grid sometimes omits the key input and startes the edit, or it will take the key input and place it in the cell, but then select all the text in the cell and the user will then overwrite the first key input. There is no way for us to consistently recreate the problem.
Hope I have explained the issue enough.
Best regards
Emil -
manish.gupta
Posted 7 January 2024, 6:21 pm EST - Updated 7 January 2024, 6:26 pm EST
Hello Emil,
We are sorry for the inconvenience and we understand the issue but the problem is that we are not able to replicate the issue at our end.
The only suggestion for now we have is to reduce the timeout to 5 ms from 20ms as suggested in the previous reply.It works at our end with 5ms, please refer to the attached screenshot for reference:
Please note that the timeout value can be adjusted by changing and seeing the effect on the FlexGrid edit functionality. The lesser timeout value, there are chances to occur the issue.
The mentioned issue should be occurred to those customers only whose typing speed is faster. So please next time, please ask the customer to record the video of the issue and share with us.
Please also ask the customer to share the machine configuration like RAM, OS and browser he is using so that we may try to replicate the issue with the specified environment.
Regards,
Manish Gupta -
ehh
Posted 14 January 2024, 7:27 pm EST - Updated 14 January 2024, 7:58 pm EST
Hello Manish,
I have tried getting some of our users to record the issues.
In the following clips, the actions made are as follows.Chrome or Safari on Mac#1:
The user inputs +2, the cell starts the edit fine but overwrites the 2 with the plus, even though the plus is the first character.Chrome or Safari on Mac#2:
The user once again inputs +2, the cell once again starts the edit fine, but drops the first character the user inputs, because it selects it.Edge on Windows#1:
Here it does the same as on Mac#1, but it sometimes works as intended.Edge on Windows#2:
The user presses a number, but this only triggers the edit funciton, the first input is lost.Every issue is from a different machine, the issues have also been reported in other browsers.
Hope this helps with explaning the issue we seem to have.
If needed it is possible to create a guest account to our system, so you would be able to test the issue for yourself, we would just need an email to create the user.
Best regards
Emil -
manish.gupta
Posted 16 January 2024, 12:08 am EST
Hi Emil,
We are able to replicate the issue with mac device and we are trying to fix it. We will update you as we get an fix for this.Regards,
Manish Gupta -
manish.gupta
Posted 17 January 2024, 12:54 am EST
Hello Emil,
Please find the attached sample for reference with updated code. In the sample, we are not using the JS code to fix the first character code. We are now fixing it using the C# by calling the Default method if the editing is starting using Quick edit.Hope it should resolve all of your issues!
Regards,
Manish Gupta -
ehh
Posted 21 January 2024, 7:10 pm EST
Hello Manish,
Thanks for the quick response, it seems your solution fixed the problem we are currently running it in our test enviroment without any issues, I will let you know if we have issues once we push it out to our users.
Best regards
Emil
