Unable to bind SfTextInputLayout to NullableDatePicker

Hello support
I would like to ask you for help as I have been struggling with this issue whole weekend. 

I know, that Xamarin.Forms currently does not support nullable DatePicker control. Therefore I have implemented extended NullableDatePicker - according to this tutorial.
The ussage in XAML is following:
<textInputLayout:SfTextInputLayout Hint="{x:Static resources:AppResources.DateStart}" Grid.Column="0">
     <controls:NullableDatePicker NullableDate="{Binding StartDate}"/ Placeholder="">
textInputLayout:SfTextInputLayout>

It does not work well with SfTextInputLayout - I believe internal SfTextInputLayout implementation checks for DatePicker type and then binds to Date property (it's just my impression). If that is true, I believe the sollution would be to force SfTextInputLayout  to bind to NullableData property - or even some different property which I can create (string for example).

Is it possible to do that?

What is strange though, is that I have the issue only on iOS. Android works well.

Thanks a lot,
Tomas

10 Replies 1 reply marked as answer

SS Sridevi Sivakumar Syncfusion Team March 8, 2021 09:22 AM UTC

Hi Martin ARION,

Greetings from Syncfusion.

We have checked the reported your query. And we have created sample based mentioned tutorial then checked the value bound properly with NullableDatePicker control. It works fine at our end. The sample we tried can be downloaded from the below location

Samplehttps://www.syncfusion.com/downloads/support/forum/163273/ze/NullableDatePicker2040777942
 




If you still face any problem, can you revert us by modifying the attached sample based on your application scenario, this will help us to provide you a better solution at the earliest.

Regards,

Sridevi S. 
 
 



MA Martin ARION March 8, 2021 06:38 PM UTC

Hello,
the problem still persists.

I have modified you sample a bit - see attachement:
<StackLayout Orientation="Vertical">
			<textInputLayout:SfTextInputLayout Margin="20" Hint="{StaticResource Key=startDate}" >
				<local:NullableDatePicker NullableDate="{Binding MyDate}" PlaceHolder=""/>
			</textInputLayout:SfTextInputLayout>
			<Button Text="Show selected date" Clicked="Button_OnClicked"/>
		</StackLayout>
I added PlaceHolder to empty string - because I do not want to see /././,
Then I added button, which shows content of startDate variable.

Then after program run, select a date and then click the button.
Android behaves as expected - date is visible and button press shows content of MyDate variable which is in match with entered value.
iOS does not behave correctly - even after selection the date is not visible. But it has been correctly added into MyDate variable.



Thanks,
Tomas


Attachment: nullableDatePicker_7be60532.7z


SS Sridevi Sivakumar Syncfusion Team March 9, 2021 12:43 PM UTC

Hi Martin ARION,

Thanks for sharing the sample,

We have checked the reported issue with the shared sample, and we found that the custom control selected date not updated with SfTextInputLayout. We have resolved this problem by updating selected date to SfTextInputLayout as per the below code snippet.

Code snippet[NullableDatePickerRenderer]: 
       protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)  
       {  
              // Check if the property we are updating is the format property  
              if (e.PropertyName == Xamarin.Forms.DatePicker.DateProperty.PropertyName || e.PropertyName == Xamarin.Forms.DatePicker.FormatProperty.PropertyName)  
              {  
                     var entry = (NullableDatePicker.Controls.NullableDatePicker)this.Element;  
                     var parent = ((this.Element.Parent as Grid).Parent as StackLayout).Parent as SfTextInputLayout;  
                     MethodInfo method = parent.GetType().GetMethod("UpdateText",  BindingFlags.NonPublic | BindingFlags.Instance);  
                     method.Invoke(parent, new object[] { entry.Date.ToString() });  
                     // If we are updating the format to the placeholder then just update the text and return  
                     if (this.Element.Format == entry.PlaceHolder)  
                     {  
                           this.Control.Text = entry.PlaceHolder;  
                           return 
                     }  
              }  
              base.OnElementPropertyChanged(sender, e);  
       }  

We have modified the sample based on this, please find the sample from the below location.
https://www.syncfusion.com/downloads/support/forum/163273/ze/Modified_Sample-1420139634

Let us know if you need any further assistance.

Regards,
Sridevi S.
 
 



MA Martin ARION March 10, 2021 06:19 PM UTC

Hello,
it works. Thanks a lot. There is one small issue though.



In the picture I do have two NullableDatePicker controls. No date was added into the first one and a date was added and then removed from the second one.
As you can see the Hit on the second one does not go back into the center.

Is there a way how to handle this as well?
Thanks a lot,
Tomas


SS Sridevi Sivakumar Syncfusion Team March 11, 2021 04:43 PM UTC

Hi Martin ARION,

Thanks for your update, we have analyzed your query and resolved the problem by updating our SfTextInputLayout while removing value as per the below code snippet.

Code snippet[NullableDatePickerRenderer]:
 
  
        protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)  
        {  
                     // Check if the property we are updating is the format property  
                     if (e.PropertyName == Xamarin.Forms.DatePicker.DateProperty.PropertyName || e.PropertyName == Xamarin.Forms.DatePicker.FormatProperty.PropertyName)  
                     {  
                           var entry = (NullableDatePicker.Controls.NullableDatePicker)this.Element;  
                           var parent = ((this.Element.Parent as Grid).Parent as StackLayout).Parent as SfTextInputLayout;  
                           MethodInfo method = parent.GetType().GetMethod("UpdateText" 
       BindingFlags.NonPublic | BindingFlags.Instance);  
                           if (entry.NullableDate == null 
                           {  
                                  method.Invoke(parent, new object[] { string.Empty });  
                           }  
                           else  
                           {  
                                  method.Invoke(parent, new object[] { entry.Date.ToString() });  
                           }  
                           // If we are updating the format to the placeholder then just update the text and return  
                           if (this.Element.Format == entry.PlaceHolder)  
                           {  
                                  this.Control.Text = entry.PlaceHolder;  
                                  return 
                           }  
                     }  
                                         else if (e.PropertyName == NullableDatePicker.Controls.NullableDatePicker.NullableDateProperty.PropertyName)  
                     {  
                           var entry = (NullableDatePicker.Controls.NullableDatePicker)this.Element;  
                           if (entry.NullableDate == null 
                           {  
                                  var parent = ((this.Element.Parent as Grid).Parent as StackLayout).Parent as SfTextInputLayout;  
                                  MethodInfo method = parent.GetType().GetMethod("UpdateText" 
                                         BindingFlags.NonPublic | BindingFlags.Instance);  
                                  method.Invoke(parent, new object[] { string.Empty });  
                           }  
                     }  



 
  
                     base.OnElementPropertyChanged(sender, e);  
        }  
Can you please have a sample from the below link:
https://www.syncfusion.com/downloads/support/directtrac/general/ze/NullableDatePicker-1307735830

Let us know if you need any further assistance.

Regards,
Sridevi S.
 
 


Marked as answer

MA Martin ARION March 12, 2021 08:00 AM UTC

Thank you so much for your support. The solution works
Regards,
Tomas


SS Sridevi Sivakumar Syncfusion Team March 15, 2021 06:17 AM UTC

Hi Martin ARION,

Thank you for the update.

We are glad that the reported problem has been resolved at your end.

Please let us know if you need any further assistance.

Regards,
Sridevi S. 



YA Yas September 30, 2022 08:39 AM UTC

Hi sir @Sridevi Sivakumar, i tried using this code, but instead of date picker, i used time picker. Upon updating the time, i get this error message. Same error with the condition if the entry.NullableTime is not null







YA Yas replied to abdiel corda September 30, 2022 08:58 AM UTC

Was able to fix the error, added parameter on method.Invoke


method.Invoke(parent, new object[] { string.Empty , false });



ET Eswaran Thirugnanasambandam Syncfusion Team October 3, 2022 06:34 AM UTC

We are glad to know that the reported problem has been resolved at your end, and thanks for your valuable suggestions. Please let us know if you have any further queries on this. We are happy to help.


Loader.
Up arrow icon