We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
WEBINAR  Visualize Customer Survey Reports Using Our React 3D Circular Charts Control —Thursday, May 02, 10:00 A.M. ET REGISTER NOW
close icon
  1. Home
  2. Forum
  3. WPF
  4. Format a date value in GridUnboundColumns format property

Format a date value in GridUnboundColumns format property

Hi,

I have to use a GridUnboundColumn with format:  "'Datum: {validDate}'"

The result is: "Datum: 28.10.2016 00:00:00"

The expected result is: "Datum: 28.10.2016"

How can I achieve that?

Regards

Harald

14 Replies
JG Jai Ganesh S Syncfusion Team August 19, 2016 11:51 AM UTC

Hi Harald, 
 
You can achieve your requirement to format the DateTime value in GridUnboundColumn by wiring the QueryUnboundColumnValue event like below, 
 
this.datagrid.QueryUnboundColumnValue += datagrid_QueryUnboundColumnValue; 
 
 
void datagrid_QueryUnboundColumnValue(object sender, GridUnboundColumnEventsArgs e) 
{ 
    var value = e.Value.ToString(); 
    DateTime dt = Convert.ToDateTime(value); 
    e.Value = "Datum:" + dt.ToString("M.d.yyyy"); 
} 
 
 
Screen Shot: 
 
 
Regards, 
Jai Ganesh S 


HB Harald Betzler August 21, 2016 02:32 PM UTC

Hi Jai,

thank you for the solution. 

Is there a way to achieve the target by xaml?

Imagine you have 8 unbound columns with date values to format into german date format. But each column in another format (e.g. "abc: 01.01.2016", "def: 02.02.2016", "ghi: 03.03.2016", etc).

Then you have to identity the column in the eventhandler (by column index or by column header title). But this is very fragile to changes (adding / removing columns). Therefore it should better realized by xaml.

Can you help me?

Regards
Harald

HB Harald Betzler August 21, 2016 02:43 PM UTC

I have a further need to format the date within the Format property of GridUnBoundColumn:
Format="'{ValidFrom} - {ValidTo} (von {DelegatorSalutation} {DelegatorFirstname} {DelegatorLastname})'"
In this case the grid displays:  01.08.2016 00:00:00 - 15.08.2016 00:00:00 (von Herrn Max Müller)

But it should be: 01.08.2016 - 15.08.2016 (von Herrn Max Müller)

I think, this is not resolvable with a eventhandler in code behind.

Regards
Harald



JG Jai Ganesh S Syncfusion Team August 22, 2016 12:21 PM UTC

Hi Harald, 
 
Please find the responses for your queries as below, 
 
Query 1: 
UnboundColumn provides support for specify expressions only. You can find the details on below documentation link, 
 
 
Query 2: 
 
Your requirement can be achieved using QueryUnboundColumnValue event.  
 
void datagrid_QueryUnboundColumnValue(object sender, GridUnboundColumnEventsArgs e) 
{ 
    var data = e.Value as BusinessObjects; 
    string validFrom=null, validTo=null; 
    if (data != null) 
    { 
            validFrom = data.ValidFrom.ToString("M.d.yyyy"); 
            validTo = data.ValidTo.ToString("M.d.yyyy"); 
    } 
 
    e.Value = validFrom + "-" + validTo; 
 
} 
 
In the above code, we have format the two DateTime values and append it by “–“ . Likewise, you can get the values and format it in QueryUnboundColumnValue event. 
 
 
Regards, 
Jai Ganesh S 


HB Harald Betzler August 23, 2016 12:39 PM UTC

Hi Jai,

thank you for the example. But due to MVVM concerns it should be avoided to reference the model from the view. "BusinessObjects" is typically defined in the model (but not in your simplified example). 

Back to my requirement to build this string in an unbound column:
Format="'{ValidFrom} - {ValidTo} (von {DelegatorSalutation} {DelegatorFirstname} {DelegatorLastname})'"
The grid displays:  01.08.2016 00:00:00 - 15.08.2016 00:00:00 (von Herrn Max Müller)

But it should display: 01.08.2016 - 15.08.2016 (von Herrn Max Müller)

It would be very helpful to format date values (and perhaps other number values) directly in the xaml column definition like this suggestion (or with other syntax):
Format="'{ValidFrom(M.d.yyyy)} - {ValidTo(M.d.yyyy)} (von {DelegatorSalutation} {DelegatorFirstname} {DelegatorLastname})'"

Is there really no chance to avoid code behind?

Sure, I could form this string in the viewmodel. But viewmodel should not handle formatting problems. This should handled in the view.

At the moment I think, that Syncfusions SfDataGrid is not really compatible with MVVM concept.

Regards
Harald



JG Jai Ganesh S Syncfusion Team August 24, 2016 02:01 PM UTC

Hi Harald, 
 
As we said in our previous update, you cannot set the DateTime format through Xaml in UnboundColumn. Now we have modified our sample as a MVVM pattern by wiring the QueryUnboundColumnValue event through behavior, 
 
<interactivity:Interaction.Behaviors> 
       <local:InitialSetupBehaviour/> 
 </interactivity:Interaction.Behaviors> 
 
public class InitialSetupBehaviour : Behavior<SfDataGrid> 
    { 
        protected override void OnAttached() 
        { 
            this.AssociatedObject.QueryUnboundColumnValue += AssociatedObject_QueryUnboundColumnValue; 
        } 
 
        void AssociatedObject_QueryUnboundColumnValue(object sender, GridUnboundColumnEventsArgs e) 
        { 
            var data = e.Value as BusinessObjects; 
            string validFrom = null, validTo = null; 
            if (data != null) 
            { 
                validFrom = data.ValidFrom.ToString("M.d.yyyy"); 
                validTo = data.ValidTo.ToString("M.d.yyyy"); 
            } 
 
            e.Value = validFrom + "-" + validTo; 
        } 
         
        protected override void OnDetaching() 
        { 
            this.AssociatedObject.QueryUnboundColumnValue -= AssociatedObject_QueryUnboundColumnValue; 
        } 
    } 
 
 
Regards, 
Jai Ganesh S 


HB Harald Betzler August 30, 2016 05:01 PM UTC

Hi Jai,
thank you for the behavior solution.

Now I've a problem with the observability. The expected string is formatted by the behavior class. But only while loading the data.

I attached your sample (extended by some changes).
I changed column 2 and 3 from Quantity to ValidFrom and Unit Price to ValidTo. These are the single values of the concatenated string in column 4.
I added a button and a click event handler, that changes the ValidFrom and ValidTo values in the observable collection GDSource in the view model.

As expected the values in column 2 and 3 are changed. But as not expected the concatenated string in column 4 ist noch changed.

How can this be realized?

regards
Harald

Attachment: SfGridDemo_c587fea4.zip

JG Jai Ganesh S Syncfusion Team August 31, 2016 02:02 PM UTC

Hi Harald, 
 
You can achieve your requirement to change the UnboundColumn value at runtime by calling the UpdateUnboundColumns method like below, 
 
public void ChangeDate(object sender, RoutedEventArgs routedEventArgs) 
   { 
            var vm = (ViewModel) DataContext; 
 
            var item = vm.GDCSource.FirstOrDefault(); 
            if (item != null) 
            { 
                item.ValidFrom = DateTime.Today; 
                item.ValidTo = DateTime.Today; 
            } 
             
            datagrid.UpdateUnboundColumns(item); 
             
     } 
 
You can also refresh the UnboundColumn value in CurentCellEndEdit event. Please refer the following UG for more details, 
 
 
Regards, 
Jai Ganesh S 


HB Harald Betzler August 31, 2016 02:48 PM UTC

Hi Jai,

thank you for the UpdateUnboundColumns hint.

I realize, that the sample was too simple. I implemented the button and the click eventhandler to demonstrate, that the unbound column won't be recalculated.

But in reality my data source is updated by another view - as usual in MVVM. And another view cannot explicitly trigger an update of the unbound columns. Views typically do not know about other views.

The grid will be notified about data changes from the data source by INotifyPropertyChanged. This works for bound column and should also work for unbound columns. Unbound columns have to be updated automatically - otherwise they do not work according the binding concept of MVVM.

Regards
Harald

JG Jai Ganesh S Syncfusion Team September 1, 2016 12:47 PM UTC

Hi Harald, 
 
You can achieve your requirement in MVVM pattern by update the UnboundColumns through RecordPropertyChanged event in Behavior class. 
 
this.AssociatedObject.ItemsSourceChanged += AssociatedObject_ItemsSourceChanged; 
 
void AssociatedObject_ItemsSourceChanged(object sender, GridItemsSourceChangedEventArgs e) 
{ 
    this.AssociatedObject.View.RecordPropertyChanged += View_RecordPropertyChanged; 
} 
 
void View_RecordPropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e) 
{ 
    var record=(sender as BusinessObjects); 
    this.AssociatedObject.UpdateUnboundColumns(record); 
} 
 
 
If the above solution is not working in your end, then please share how you update the data source using another view. This would be more helpful for us to provide the prompt solution. 
 
Regards, 
Jai Ganesh S 


HB Harald Betzler September 1, 2016 06:28 PM UTC

Hi Jai,

thank you. That's what I need.

Regards
Harald

JG Jai Ganesh S Syncfusion Team September 2, 2016 01:58 AM UTC

Hi Harald, 
 
Thank you for the update. 
 
Please let us know if you need further assistance on this. 
 
Regards, 
Jai Ganesh S 


YA yanghaibo January 24, 2022 06:18 AM UTC

Hi Jai,

I have a question, if my datagrid have more than one unbound column, and  expressions can not achieve my 

requirement, I have to query database to get the value, so I have to use QueryUnboundColumnValue event, but QueryUnboundColumnValue it seems that QueryUnboundColumnValue event can only support one unbound column, how to achieve multi-unboundcolumn requirement?


VS Vijayarasan Sivanandham Syncfusion Team January 25, 2022 02:22 PM UTC

Hi Yanghaibo,

Your requirement to add multi unboundcolumn by using QueryUnboundColumnValue event in SfDataGrid can be achieved by checking the GridColumn.MappingName property. Please refer to the below code snippet,

 
void OnQueryUnboundColumnValue(object sender, GridUnboundColumnEventsArgs e) 
{ 
            if (e.UnBoundAction == UnBoundActions.QueryData) 
            { 
                //here customize based on your scenario 
                if (e.Column.MappingName == "GrandTotal") 
                { 
                    var unitPrice = Convert.ToDouble(e.Record.GetType().GetProperty("Quantity").GetValue(e.Record)); 
                    var disCount = Convert.ToDouble(e.Record.GetType().GetProperty("Amount").GetValue(e.Record)); 
                    var save = unitPrice * disCount; 
                    e.Value = save.ToString(); 
                } 
                else if(e.Column.MappingName == "DiscountAmount") 
                { 
                    var unitPrice = Convert.ToDouble(e.Record.GetType().GetProperty("Discount").GetValue(e.Record)); 
                    var disCount = Convert.ToDouble(e.Record.GetType().GetProperty("Amount").GetValue(e.Record)); 
                    var save = unitPrice * disCount / 100; 
                    e.Value = save.ToString() + "$"; 
                } 
            } 
} 

Sample Link: https://www.syncfusion.com/downloads/support/forum/125445/ze/SfDataGridDemo-1584474017

For more information related to QueryUnBoundColumnValue event, please refer the user guide documentation,

 

Regards, 
Vijayarasan S 


Loader.
Live Chat Icon For mobile
Up arrow icon