How to validate entry is empty in listview xamarin Forms

MehdiMllMehdiMll Member ✭✭

I have a ListView with multiple entries. In each, i should enter a value which would be check if it's empty or not. I must implement a solution that can check if all entries in ListView are valid when i tap a submit button.

Tagged:

Best Answer

Answers

  • GraverobberGraverobber Member ✭✭✭

    Are you using the MVVM pattern?
    If so, then here is the idea for MVVM:

    Usually you should have a Collection somewhere in you pages ViewModel that provides the models/viewModels for the items of your ListView.

    In the Model/ViewModel of your ListViewItem you should have access to the text of the entry of this single item.
    Then in the submit command of your Pages ViewModel, the one that holds the Source for your ListView, you can iterate over the Source Collection and check for each single item if string.IsNullOrEmpty(textOfThisItemEntry)

    If one of them is nullOrEmpty, your list is invalid otherwise it is valid.

  • MehdiMllMehdiMll Member ✭✭

    @Graverobber yes i am using MVVM and i check if each value is empty or not but how to color cellview and what row is not valid from viewModel

  • GraverobberGraverobber Member ✭✭✭

    @MehdiMll
    You can give the ViewModel of your ListViewItem a Color property that represents the background color.
    Bind it to the ViewCell BackgroundColor then.

    public class MyItemViewModel
    {
        public Color BG
        {
            get{return _bg;}
            set{_bg=value; OnPropertyChanged();}
        }
        private Color _bg {get; set,} = Color.White; //This is your default, not validated color
    }
    

    Now in the View xaml of your ViewCell you bind the BG property to the ViewCells BackgroundColor.

    Then in your loop where you check each single item you can do something like this:

    void Validate()
    {
        Source.ForEach((item)=>
        {
            int row = Source.IndexOf(item) //The index of the item in your Source collection equals to the row index in             ListView
            if(string.IsNullOrEmpty(item.Entry))
                item.BG = Color.Red; //This will change the rows BG to red, marking it as invalid
            else
                item.BG = Color.White; //Here you reset the BG in case that it was red before and another one fails now
        });
    }
    

    Disclaimer: I didn't test this code it is just written out of my head but you should get the idea.

  • JarvanJarvan Member, Xamarin Team Xamurai
    edited July 9

    @MehdiMll
    Bind the element of Model to Entry's 'Text'. Then detect the text is empty in Button click event.
    You can refer to the code:
    page.xaml.cs

    public partial class Page2 : ContentPage
    {
        ObservableCollection<model_2> list = new ObservableCollection<model_2>();
        public Page2()
        {
            InitializeComponent();
    
            list.Add(new model_2 { content = "content_1" });
            list.Add(new model_2 { content = "content_2" });
            list.Add(new model_2 { content = "content_3" });
    
            listview.ItemsSource = list;
        }
    
        private async void Button_Clicked(object sender, EventArgs e)
        {
            foreach (var item in list)
            {
                if (string.IsNullOrEmpty(item.entry_text))
                {
                    await DisplayAlert("Alert", "Exist Entry is empty", "OK");
                    return;
                }
                else
                {
                    //
                }
            }
        }
    }
    
    public class model_2 : INotifyPropertyChanged
    {
        public string content;
        public string Content
        {
            get
            {
                return content;
            }
            set
            {
                if (content != value)
                {
                    content = value;
                    NotifyPropertyChanged();
                }
            }
        }
    
        public string entry_text { get; set; }
        public string Entry_text
        {
            get
            {
                return entry_text;
            }
            set
            {
                if (entry_text != value)
                {
                    entry_text = value;
                    NotifyPropertyChanged();
                }
            }
        }
    
        protected virtual void NotifyPropertyChanged([CallerMemberName] string propertyName = "")
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    
        public event PropertyChangedEventHandler PropertyChanged;
    }
    

    page.xaml

    <StackLayout>
        <ListView x:Name="listview" HasUnevenRows="True" ItemSelected="Listview_ItemSelected">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout>
                            <Label Text="{Binding Content}"/>
                            <Entry Text="{Binding Entry_text}"/>
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <Button Clicked="Button_Clicked"/>
    </StackLayout>
    

  • MehdiMllMehdiMll Member ✭✭

    @Graverobber Thanks it work me for change color the item but how to scroll and focus to empty entry

  • MehdiMllMehdiMll Member ✭✭

    @yalinzh thanks a lot but im using the MVVM pattern

  • JarvanJarvan Member, Xamarin Team Xamurai
    edited July 9

    @MehdiMll
    I've updated my code using MVVM. You can check it.

Sign In or Register to comment.