Field Width

[Frederick Switzer]

How and where do I set the field width for a field in my dataform.  I mean the width of the editor, not the length of the input characters.  For example State, only equals 2 characters.

Thanks

[SaiGanesh Sakthivel]

Hi Frederick,

#Regarding changing the editor width for the SfDataForm

We have documented ‘How to change the editor width 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/dataform-settings#change-editor-layout-settings

Please refer to the code snippet for your reference.

private void dataForm_GenerateDataFormItem(object sender, Syncfusion.Maui.DataForm.GenerateDataFormItemEventArgs e)

{

    if (e.DataFormItem != null)

    {

        if (e.DataFormItem.FieldName == "LastName")

        {

            e.DataFormItem.DefaultLayoutSettings = new DataFormDefaultLayoutSettings();

            e.DataFormItem.DefaultLayoutSettings.EditorWidth = 400;

        }

    }

}

Please let us know if you have any concerns.

Regards,
SaiGanesh Sakthivel

[Frederick Switzer]

Checking this userguide doc, There is no mention of how to set the field width of the editor.

https://help.syncfusion.com/maui/dataform/dataform-settings#change-editor-layout-settings

Here is my code and the input length is changed to 3 but the editor width in not changed.

if (e.DataFormItem != null)


{
    if (e.DataFormItem.FieldName == "State")


    {
        e.DataFormItem.DefaultLayoutSettings = new DataFormDefaultLayoutSettings();


        e.DataFormItem.DefaultLayoutSettings.EditorWidth = 20;
    }


    if (e.DataFormItem.FieldName == "State" && e.DataFormItem is DataFormTextItem state)


    {
        state.MaxLength = 2;
    }
}

[Vidyalakshmi Mani]

Hi Frederick,

We have checked the provided code snippets and confirmed that the `EditorWidth` is functioning correctly. Please note that the `MaxLength` property you've specified is responsible for restricting the number of input characters entered into the editor, while the `EditorWidth` property allows for customization of the editor's width.

To assist you further, we've created a simple sample for your reference. Please review the attached sample and output image. If you're still encountering the same issue, please let us know.

Regards,

Vidyalakshmi M.

Attachment: GettingStarted_2dd7c715.zip

[Frederick Switzer]

Vidyalakshmi,

Thanks for the sample, and it runs fine and the editor width in the sample gets adjusted, however , when I make that change in my code, the input length changes, but the editor width does not change.

Here is the .cs code I'm using.

private void patientDataForm_GenerateDataFormItem(object sender, Syncfusion.Maui.DataForm.GenerateDataFormItemEventArgs e)
{
    if (e.DataFormItem != null)
    {
        if (e.DataFormItem.FieldName == "State" && e.DataFormItem is DataFormTextItem state)
        {
            e.DataFormItem.DefaultLayoutSettings = new DataFormDefaultLayoutSettings();
            e.DataFormItem.DefaultLayoutSettings.EditorWidth = 100;
            state.MaxLength = 4;
        }


        if (e.DataFormItem.FieldName == "pid")
        {
            e.DataFormItem.IsVisible = false;
        }
    }






    if (e.DataFormGroupItem != null)


    {
        if (e.DataFormGroupItem.Name == "Basic")
        {
            e.DataFormGroupItem.ColumnCount = 4;
        }
        else if (e.DataFormGroupItem.Name == "Contact")
        {
            e.DataFormGroupItem.ColumnCount = 4;
        }
    }
}

And here is my xaml

        <Frame
            Grid.Row="1"
            Grid.RowSpan="5"
            Grid.Column="2"
            Grid.ColumnSpan="5"
            Margin="10">


            <dataform:SfDataForm
                x:Name="patientDataForm"
                 AutoGenerateItems="True"
                GenerateDataFormItem="patientDataForm_GenerateDataFormItem"
                LayoutType="TextInputLayout"
                ValidateProperty="patientDataForm_ValidateProperty" />
        </Frame>


        <Frame
            Grid.Row="1"
            Grid.RowSpan="5"
            Grid.Column="2"
            Grid.ColumnSpan="5"
            Margin="10">


            <dataform:SfDataForm
                x:Name="patientDataForm"
                 AutoGenerateItems="True"
                GenerateDataFormItem="patientDataForm_GenerateDataFormItem"
                LayoutType="TextInputLayout"
                ValidateProperty="patientDataForm_ValidateProperty" />
        </Frame>

I can't find anything that would prevent the editor width to not change?

[Vidyalakshmi Mani]

Hi Frederick,

Thank you for sharing your code snippets with us. After reviewing them, we've observed that you're using the TextInputLayout. Please note that the EditorWidth property is designed for customizing the editor width in the DefaultLayout, and it doesn't apply to the text input layout. Please refer to our UG document for more information: Change-the-label-and-editor-width

If you have any more questions or need further assistance, feel free to reach out to us.

Regards,

Vidyalakshmi M.

[Frederick Switzer]

VM,

Thank you, that was the fix.:)

[Vidyalakshmi Mani]

Hi Frederick,

We are glad that your issue has been resolved! Please let us know if you need further assistance. As always, we are happy to help you out.

Regards,

Vidyalakshmi M.