Help with Dataform

[Amit Saraf]

1. How to Add Validation in dataform through XALM tags
2. How to Add Save & Cancel Buttons in DataForm.

Here is my Code for reference.

Model

    public class CPInfo : INotifyPropertyChanged

    {

        public event PropertyChangedEventHandler PropertyChanged;

        public void OnPropertyChanged([CallerMemberName] string name = "") => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));

        int _CPCode = 0;

        public int CPCode { get => _CPCode; set { if (_CPCode != value) { _CPCode = value; OnPropertyChanged(); } } }

        string _CPName;

        public string CPName { get => _CPName; set { if (_CPName != value) { _CPName = value; OnPropertyChanged(); } } }

        string _CPDisc;

        public string CPDisc { get => _CPDisc; set { if (_CPDisc != value) { _CPDisc=value; OnPropertyChanged(); } } }

        decimal _CPMinValue;

        public decimal CPMinValue { get => _CPMinValue; set { if (_CPMinValue != value) { _CPMinValue = value; OnPropertyChanged(); } } }

    }

XAML

 <dataForm:SfDataForm Grid.Row="1" ColumnCount="4" DataObject="{Binding cpInfo}" AutoGenerateItems="False"

                             CommitMode="PropertyChanged" LayoutType="TextInputLayout">

            <dataForm:SfDataForm.TextInputLayoutSettings>

                <dataForm:TextInputLayoutSettings ContainerType="None" EnableFloating="True"/>

            </dataForm:SfDataForm.TextInputLayoutSettings>

            <dataForm:SfDataForm.Items>

                <dataForm:DataFormTextItem BindingContext="{Binding cpInfo.CPName, Mode=TwoWay}" MaxLength="20"

                                           LabelText="Parameter Name" PlaceholderText="Claim parameter name"

                                            />

                <dataForm:DataFormTextItem BindingContext="{Binding cpInfo.CPDisc, Mode=TwoWay}" MaxLength="50"

                                           LabelText="Parameter Description" PlaceholderText="Description that explains parameter"

                                           ColumnSpan="2"/>

                <dataForm:DataFormNumericItem BindingContext="{Binding cpInfo.CPMinValue, Mode=TwoWay}"

                                              Minimum="0.00" Maximum="100.00"

                                              LabelText="Minimum Value" AllowNull="False" CustomFormat="N2"/>

            </dataForm:SfDataForm.Items>

        </dataForm:SfDataForm>

[SaiGanesh Sakthivel]

Hi Amit,

#Query 1: Regarding Validation in the dataform

We have documented ‘How to add the validation in the SfDataForm’ in our user guidance document. Please refer to the following UG documentation for your reference.

Link: https://help.syncfusion.com/maui/dataform/data-annotations#validation-attribute

Link: https://help.syncfusion.com/maui/dataform/validation?cs-save-lang=1&cs-lang=csharp#validate-the-specific-editor

#Query 2: Regarding the Save and cancel button in the dataform

We have documentation about ‘How to save or cancel the edited DataForm data in .NET MAUI DataForm (SfDataForm)’ in our Syncfusion Knowledge base in our website. Please refer to the following KB link for your reference.

https://support.syncfusion.com/kb/article/12756/how-to-save-or-cancel-the-edited-dataform-data-in-net-maui-dataform-sfdataform

Regards,
SaiGanesh Sakthivel

[Amit Saraf]

Thanks a lot

[Muniappan Subramanian]

We are glad that our solution meets your requirement. Please let us know if you need any further updates. As always, we are happy to help you out.

[Matej Cavar]

Hi, new here.

Is there a way to interact with dataform without using Behavior.
Something like:
Click on Login button runs a command (in ViewModel) which collects data from dataform and processes it? Some kind of funcionality similar to [ObservableProperty] in CommunityToolkit.

[Vidyalakshmi Mani]

Hi Matej,

You can achieve your requirement using the `Command` and `CommandParameter` properties of the `Button`. The `Command` property of the button is bound to the corresponding command in the ViewModel. Additionally, the `CommandParameter` property is set to `{x:Reference dataForm}`, allowing us to pass a reference of the `SfDataForm` control to the command methods. Inside the command method, we access the `SfDataForm` using the `sender` parameter. Any necessary data processing can be handled within this method. Please refer to the following code snippet for your reference.

Code snippet:

 

ViewModel

 

public class DataFormViewModel : INotifyPropertyChanged

{   

    public ICommand SaveCommand {  get; set; }

 

    public ICommand CancelCommand { get; set; }

 

    public DataFormViewModel()

    {

        SaveCommand = new Command(ExecuteSaveCommand);

        CancelCommand = new Command(ExecuteCancelCommand);

    }

 

    private void ExecuteSaveCommand(Object sender)

    {

        var dataForm = sender as SfDataForm;

        if (dataForm != null)

        {

            dataForm.Commit();

        }           

    }

 

    private void ExecuteCancelCommand(Object sender)

    {

        var dataForm = sender as SfDataForm;

        if (dataForm != null)

        {

            dataForm.DataObject = new ContactInfo();

        }

    }

}

 

MainPage.xaml

 

<dataForm:SfDataForm Grid.Row ="0" x:Name="dataForm" DataObject="{Binding ContactInfo}" AutoGenerateItems="True" ValidationMode="PropertyChanged" CommitMode="Manual" />

<Button Grid.Row="1" Text="Save" Command="{Binding SaveCommand}" CommandParameter="{x:Reference dataForm}"></Button>

<Button Grid.Row="2" Text="Cancel" Command="{Binding CancelCommand}" CommandParameter="{x:Reference dataForm}"></Button>

 

 

We have prepared a simple sample. Please find the attached sample for your reference.

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

Attachment: DataFormMAUI_92cf6fed.zip