JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Data Grid › Grid Properties Not Updating
Tagged: blazor grid
- This topic has 4 replies, 2 voices, and was last updated 1 year, 2 months ago by svetoslav_borislavov.
-
AuthorPosts
-
September 27, 2023 at 8:00 pm #108823FerrisChampParticipant
Hello,
I am trying to keep track of the conditional formatting that a user applies. For the filtering and grouping, I was able to use an event to update a variable keeping track of the changes. However, the conditional formatting doesn’t have an event I see, and the grid properties don’t update (grid.ConditionalFormatting, grid.Grouping.GroupBy, grid.Filtering.Filter). Is there a way to force the properties into a two-way binding or create an event for OnConditionalFormatting?
Thank you,
Ferris
September 28, 2023 at 7:03 am #108825svetoslav_borislavovParticipantHi,
Grid’s conditional formatting property is dynamic,
please see the following example:
https://codepen.io/dkeamcaksoem/pen/JjwZdrQYou may add and remove formating and get the current with the button
Best Regards,
Svetoslav BorislavovSmart UI Team
https://www.htmlelements.com/September 28, 2023 at 2:47 pm #108828FerrisChampParticipantHi,
So I am starting off with no conditional formatting then trying to capture any conditional formatting on a button click.
var temp = grid.ConditionalFormatting;
However the grid.ConditionalFormatting property is empty (count = 0) even when I have conditional formatting applied. I am using the C# on the razor page and not JS, not sure if that makes a difference.
Thanks you,
Ferris
October 2, 2023 at 3:50 pm #108856FerrisChampParticipantHi,
Update by calling a JS function, I was able to see the updates with the conditional formatting property.
window.GetConditionalFormatting = () => {
const grid = document.getElementById(“io-page-grid”);
const format = grid.conditionalFormatting
console.log(format);
return format;}
This is what I get:
column: “all”
condition: “equal”
firstValue: “0”
fontFamily: “Roboto, \\\”Helvetica Neue\\\”, sans-serif”
fontSize: “14px”
highlight: “#9FC5E8”secondValue: 1
text: “#5A5A5A”
However, when trying to return the data to my C# code:
List<GridConditionalFormatting> formatting = await JS.InvokeAsync<List<GridConditionalFormatting>>(“GetConditionalFormatting”);
I get something different instead:
column: “all”
condition: “LessThan”
firstValue: “0”
fontFamily: “”
fontSize: “The default fontSize as set in CSS”
highlight: “The default backgroundColor as set in CSS”secondValue: 1
text: “The default color as set in CSS”
The values of some of the properties seem to be different. Could you help me correct this issue?
Thank you,
Ferris
- This reply was modified 1 year, 2 months ago by FerrisChamp.
- This reply was modified 1 year, 2 months ago by FerrisChamp. Reason: formatting issues
- This reply was modified 1 year, 2 months ago by FerrisChamp.
- This reply was modified 1 year, 2 months ago by FerrisChamp.
October 3, 2023 at 5:18 am #108867svetoslav_borislavovParticipantHi,
You may try creating a custom class for the list returned from JS.
Using the class for this purpose may not work as expectedBest Regards,
Svetoslav BorislavovSmart UI Team
https://www.htmlelements.com/ -
AuthorPosts
- You must be logged in to reply to this topic.