SfNumericTextBox inside Syncfusion ListView - How to EventToCommandBehavior for MVVM

Hello Syncfusion-Team,

there are several SfNumericTextBoxes inside Syncfusion ListView. The app uses MVVM pattern and it is using your provided example to transform events from ListView to Commands to be used in ViewModel.

Now I want to do the same with the events for SfNumericTextBox (LostFocus and Completed). I tried to adopt your examle and it is registering the events 'Completed' and 'FocusChanged' but the events seem not to fire.
Please could you provide an example for a propper EventToCommandBehavior for SfNumericTextBox inside a ListView?

4 Replies

SS Sridevi Sivakumar Syncfusion Team April 8, 2021 02:21 PM UTC

Hi Andreas,

Greetings from Syncfusion.

We have analysed your requirement and we have suspected that you have added the ICommand property in your view model class and bind that directly to the SfNumeicTextbox(list view item) EventToCommandBehavior command.

SfListView or ListView binding context is your view model and list view item(SfNumericTextBox) binding context is ItemSource Item. So that, binding not working and command in list view items are not fired.  To resolve this problem, bind the command as per the below code snippet.

Code snippet: [XAML] 
        <xforms:SfListView x:Name="listView"  ItemsSource="{Binding MyList}"> 
            <xforms:SfListView.ItemTemplate> 
                <DataTemplate> 
                    <ViewCell> 
                        <StackLayout Margin="10"> 
                            <syncfusion:SfNumericTextBox x:Name="numericTextBox"  Value="45" > 
                                <syncfusion:SfNumericTextBox.Behaviors> 
                                    <local:EventToCommandBehavior EventName="Completed" Command="{Binding BindingContext.CompletedCommand, Source={x:Reference Name=listView}}"  /> 
                                    <local:EventToCommandBehavior EventName="FocusChanged" Command="{Binding BindingContext.FocusChangedCommand, Source={x:Reference Name=listView}}"  /> 
                                </syncfusion:SfNumericTextBox.Behaviors> 
                            </syncfusion:SfNumericTextBox> 
                        </StackLayout> 
                    </ViewCell> 
                </DataTemplate> 
            </xforms:SfListView.ItemTemplate> 
        </xforms:SfListView> 

ViewModel: 
  public class ViewModel : INotifyPropertyChanged 
    { 
... 
        private ICommand completedCommand; 
  
        public ICommand CompletedCommand 
        { 
            get { return completedCommand; } 
            set 
            { 
                completedCommand = value; 
                OnPropertyChanged("CompletedCommand"); 
            } 
        } 
  
        private ICommand focusChangedCommand; 
        public ICommand FocusChangedCommand 
        { 
            get { return focusChangedCommand; } 
            set 
            { 
                focusChangedCommand = value; 
                OnPropertyChanged("FocusChangedCommand"); 
            } 
        } 
  
        void CompletedMethod(object obj) 
        { 
  
        } 
        void FocusChangedMethod(object obj) 
        
        { 
  
        } 
    } 

We have prepared a sample for your requirement, please have a sample from the below link 
https://www.syncfusion.com/downloads/support/forum/164318/ze/NumericSample1929418572

Note: The completed event is not fired in the Android platform and we already logged this issue and we will include this fix in our upcoming weekly NuGet release, which expected to be rolled out on April 13, 2021.

Let us know if you need any further assistance.

Regards,
Sridevi S. 
 



AN Andreas April 8, 2021 05:52 PM UTC

Hi Sridevi,

thank you for your help and example!

I missed the following part in XAML:

<local:EventToCommandBehavior EventName="Completed" Command="{Binding BindingContext.CompletedCommand, Source={x:Reference Name=listView}}" /> 
<local:EventToCommandBehavior EventName="FocusChanged" Command="{Binding BindingContext.FocusChangedCommand, Source={x:Reference Name=listView}}" />
Now it is working perfectly.

Regards,
Andreas


SS Sridevi Sivakumar Syncfusion Team April 9, 2021 06:27 AM UTC

Hi Andreas,

Thanks for your update. We are glad to hear that given solution works at your end.

Please let us know if you need any further assistance.

Regards,
Sridevi S. 



SS Sridevi Sivakumar Syncfusion Team April 13, 2021 09:43 AM UTC

Hi Andreas,

We have fixed the “
The completed event is not fired in the Android platform issue and the fix is included in our weekly NuGet of April 13, 2021.

NuGet Version: 19.1.0.56

We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance.

Regards,
Sridevi S.
 


Loader.
Up arrow icon