Binding HeaderText

Question

Hello,I want to bind the HeaderText property to a List. I already tried HeaderText="{Binding Source={x:Reference rootView}, Path=BindingContext.HeaderTitles[0]}"Where rootView is the x:Name of the parent ContentView. It only works when is a string property, but with is a List, it doesn't work.

Shivagurunathan Kamalakannan · Answer

Hi Juan Carlos Gonzalez Salazar, We have checked your query. Your requirement can be achieved by using HeaderTemplate in SfDataGrid. Refer the below code for more details. Note: We have loaded a picker in the HeaderTemplate, You can load any views based on your requirement. We have prepared a sample based on your requirement and you can download the same from below Link. Sample Link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/SfDataGridSample1911038893 Regards, Shivagurunathan. K

Victor Rafael Bocanegra Arias · Answer

Good using SfDataGrid 17.2.0.47 I am trying to update the HeaderText of the columns from my ViewModel. I've tried binding but it doesn't work for me. I am using Behaviors:

In XAML:

...

<sfDataGrid:SfDataGrid.Behaviors>

<b:DataChangedBehavior

Binding="{Binding AnioTitles.Count}"

ComparisonCondition="Equal"

Value="10">

<b:InvokeMethodAction MethodName="RefreshGrid" TargetObject="{Binding Source={x:Reference view}}" />

</b:DataChangedBehavior>

</sfDataGrid:SfDataGrid.Behaviors>

...

In Behind Code:

...

public void RefreshGrid()

{

_viewModel = BindingContext as AttorneyDetailPageViewModel;

if (dataGrid.Columns.Count > 0)

{

dataGrid.Columns[3].HeaderText = _viewModel.AnioTitles[0].Title;

dataGrid.Columns[4].HeaderText = _viewModel.AnioTitles[1].Title;

dataGrid.Columns[5].HeaderText = _viewModel.AnioTitles[2].Title;

dataGrid.Columns[6].HeaderText = _viewModel.AnioTitles[3].Title;

dataGrid.Columns[7].HeaderText = _viewModel.AnioTitles[4].Title;

dataGrid.Columns[8].HeaderText = _viewModel.AnioTitles[5].Title;

dataGrid.Columns[9].HeaderText = _viewModel.AnioTitles[6].Title;

dataGrid.Columns[10].HeaderText = _viewModel.AnioTitles[7].Title;

dataGrid.Columns[11].HeaderText = _viewModel.AnioTitles[8].Title;

dataGrid.Columns[12].HeaderText = _viewModel.AnioTitles[9].Title;

dataGrid.View.Refresh();

}

but it does not update the HeaderText information. Only when I scroll the grid are the values updated, it is as if the View of the dataGrid does not update the HeaderText. Any help please. Thank you so much.

I attach a gif of how it is displayed.

Attachment: screen_576c56d7.rar

Balasubramani Sundaram · Answer

Hi Victor,  
 
Thank you for contacting Syncfusion support.  
 
Based on your provided details, we have checked the issue “Header text does not change at run time” we unable to replicate the issue in our side. We have checked the issue by written the behavior for the SfDataGrid and bind in it and set the header text at “GridViewCreated” and “GridLoadedEvent” event its working fine as we expected. 
 
Please refer the following sample, 
 
Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/SupportXForms-830419189 
 
Note: Issue has been checked with Xamarin. Forms version 3.2 and Syncfusion NuGet version 17.2.0.49 
 
Please check the sample and let us know if you still facing the same issue? If not, please modify the sample based on your scenario and revert us with the more details, so that it will be helpful for us to check on it and provide you the solution at the earliest.  
 
Regards, 
Balasubramani Sundaram

Victor Rafael Bocanegra Arias · Answer

Thanks for your quick response.In the example that you send me the values of the titles, the columns are established when creating the grid. What I need is to be able to update these values at runtime from the viewModel. I am sending the example with some modifications which explain what I want to do and I don't know if I am doing it in the right way or there is a better way to do it.Thanks again for your time.Attachment: SupportXForms830419189_406dbbb8.rar

Balasubramani Sundaram · Answer

Hi Victor, Thank you for your update. Your requirement can be achieved by using the HeaderTemplate in each grid column. Please refer the sample and code snippet. Code Snippet [C#] [MainPage.xaml] ......... ......... ......... ......... ......... ......... [ViewModel.cs] private List _columnTitles; public List ColumnTitles { get { return _columnTitles; } set { this._columnTitles = value; this.RaisePropertyChanged("ColumnTitles"); } } Sample link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/SupportXForms1036042458 We hope this helps. Please let us know, if you need any further assistance. Regards,Balasubramani Sundaram.

Victor Rafael Bocanegra Arias · Answer

Thanks for the example it works correctly. But when I try to replicate it in my project it doesn't work, it still doesn't refresh the HeaderText. What I forgot to mention that SfTabView used might interfere?

Balasubramani Sundaram · Answer

Hi Victor,    
   
Thanks for the update.      
   
We checked the issue “Header text does not change at run time in SfDataGrid” loaded inside the item of SfTabview. When we load the SfDataGrid inside the tab view header text gets updating at runtime as well as in loading time, its working fine in our end. We have prepared sample based on your requirement.   
   
Please refer the below sample.   
   
Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/SupportXForms805812032   
   
Video Link : https://www.syncfusion.com/downloads/support/directtrac/general/ze/SfTabView_video722410192   
   
Please get back to us if you require further other assistance from us.     
     
Regards,Balasubramani Sundaram

Victor Rafael Bocanegra Arias · Answer

The problem with the example sent is that the _viewModel is declared in XAML. I use Prism with activated viewModelLocator, which is why since the XAML file I don't know how to refer to the ViewModel and therefore I can't make it work. Please help. Thank you

Balasubramani Sundaram · Answer

Hi Victor,

Thank you for the update,

Based on your provided details we have prepared a sample on the prism with run-time changes of header text in SfDataGrid and instead of writing a behavior class we can convert the event to command behavior through the prism” EventToCommandBehavior” support.

Please refer the following code snippet and sample,

Code Snippet [Xaml]

[MainPage.Xaml]

<dataGrid:SfDataGrid.Behaviors>

<b:EventToCommandBehavior EventName="GridViewCreated"

Command="{Binding Source={x:Reference Page}, Path= BindingContext.GridViewCreatedCommand}"

CommandParameter="{x:Reference datagrid}"

/>

dataGrid:SfDataGrid.Behaviors>

<dataGrid:GridTextColumn MappingName="OrderID">

<dataGrid:GridTextColumn.HeaderTemplate>

DataTemplate>

dataGrid:GridTextColumn.HeaderTemplate>

dataGrid:GridTextColumn>

[MainPageViewModel.cs]

private DelegateCommand _gridViewCreatedCommand;

public DelegateCommand GridViewCreatedCommand => _gridViewCreatedCommand ?? (_gridViewCreatedCommand = new DelegateCommand(ExecuteCommand));

private void ExecuteCommand (SfDataGrid dataGrid)

{

/// Here we can achieve your customization

}

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/TestPop1414833914

We hope this helps. Please let us know, if you need any further assistance.

Regards,
Balasubramani Sundaram.

Victor Rafael Bocanegra Arias · Answer

Thanks for the answer, but what you suggest would not be going against good MVVM practices, not handling UI controls in the ViewModel ?.

What I still do not understand is because I have an array with column titles and binding they are not updated, I have asked the PRISM forum and they tell me that it is the correct way that perhaps the problem is control.

Thank you

Balasubramani Sundaram · Answer

Hi Victor,    
   
Thanks for the update.    
   
Yes, we can do the UI change in View Model too, because in prism they bound the view model for every page through the “Register”. However, we do the same UI change in behavior of SfDataGrid too, but we are unable to get the bound view model in code behind of the page. So that why we suggest this way to do the UI changes. If you access the view model in behavior, then also it’s not a good MVVM practices.    
   
In the previously provided sample itself we have done the same to achieve your requirement.   
   
Please let us know, if you need any further assistance.   
   
Regards,Balasubramani Sundaram

Victor Rafael Bocanegra Arias · Answer

In the case that I have is that I load all the information of the different tabs and after having all the information there I just want to update the headers of the grids. In the example you update the headers through a control I think that is why it is updated, I have tried unsuccessfully to replicate your example in my case, it still does not refresh the headers, it only happens when I scroll through the grid. Regards

Balasubramani Sundaram · Answer

Hi Victor,  
 
Thanks for the update.    
 
We have created a incident under your DT account to follow up with the query. Please log into your Direct trac account for more updates. Please use the below link to login. 
 
https://www.syncfusion.com/account/login 
 
Regards,Balasubramani Sundaram.