This is a migrated thread and some comments may be shown as answers.

The form in edit mode collapses if validation passed when other column was clicked?

3 Answers 48 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Vladimir
Top achievements
Rank 1
Veteran
Vladimir asked on 12 Aug 2020, 10:21 AM

I have a RadGridView which contains one column which is for input, and this column contains a CellEditTemplate with several fields for input, like name, middle names and surname.

Name and surname must not be empty for the validation to pass. When I click to add new row, the form with these fields appear in view and I can edit them.

If I add text for the mandatory fields, name and surname and then click on other column in this new row, the validation passes and form collapses, which makes the row look as saved when its not.

This could have two solutions, either tell the user that the row is still in edit mode and its not saved, or just prevent the form from collapsing.

How can I do both things for example?

Display message that the row is still in edit mode, and prevent the form from collapsing if it is still in edit mode?

 

Note: I have cell validating event set, and also name and surname have "Required" data annotation attribute.

3 Answers, 1 is accepted

Sort by
0
Dilyan Traykov
Telerik team
answered on 17 Aug 2020, 08:07 AM

Hello Vladimir,

Would you find it possible to replicate your setup in a small sample project so that I can suggest a viable solution for your particular scenario? You can either open a new support ticket and attach the project there or upload it to a storage provider of your choice and share the download link.

If you do not find this possible, please share code snippets of the custom CellEditTemplate, how you handle the validation, and any piece of code you find relevant so that I can get a better understanding.

Thank you in advance for your cooperation on the matter. I will be awaiting your reply.

Regards,
Dilyan Traykov
Progress Telerik

0
Vladimir
Top achievements
Rank 1
Veteran
answered on 24 Aug 2020, 06:51 AM

Here is a code snippet for the edit template. I the real case, it contains RadComboxBox and other fields.

I use cell validation. Previously it was on a complete row validation. But now since I have one cell with multiple input fields, cell validation

private void grd_CellValidating(object sender, GridViewCellValidatingEventArgs e)
        {
            string ErrorMessage = "";
            TextBox nameTB;
            TextBox surnameTB;
 
            if (e.Cell.Column.UniqueName.Equals("DetailsColumn"))
            {
                nameTB = FindElementByName<TextBox>(grd, "NameTB") as TextBox;
                surnameTB = FindElementByName<TextBox>(grd, "SurnameTB") as TextBox;
 
                if (nameTB == null || surnameTB == null)
                {
                    e.IsValid = false;
                    ErrorMessage += "Cannot find the first name or the last name input field! \n";
                }
                else
                {
                    if(nameTB.Text.Equals(string.Empty))
                    {
                        e.IsValid = false;
                        ErrorMessage += "First name must not be empty! \n";
                    }
 
                    if (surnameTB.Text.Equals(string.Empty))
                    {
                        e.IsValid = false;
                        ErrorMessage += "Last name must not be empty! \n";
                    }
                }
 
                e.ErrorMessage = ErrorMessage;
            }
        }
<tk:GridViewDataColumn.CellEditTemplate>
    <DataTemplate>
        <Border Padding="1"
            BorderBrush="{StaticResource Grey200Brush}"
            BorderThickness="1">
            <Grid  Background="{StaticResource Grey0Brush}">
             
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                 
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                 
                <TextBlock
                    VerticalAlignment="Center"
                    HorizontalAlignment="Left"
                    Margin="4"
                    Grid.Row="0"
                    Grid.Column="0"
                    Text="First name: "
                    Style="{StaticResource LabelTextBlock}"/>
                     
                <TextBlock
                    VerticalAlignment="Center"
                    HorizontalAlignment="Left"
                    Margin="4"
                    Grid.Row="1"
                    Grid.Column="0"
                    Text="Last name: "
                    Style="{StaticResource LabelTextBlock}"/>
                     
                <TextBox
                    x:Name="NameTB"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Stretch"
                    Grid.Row="0"
                    Grid.Column="1"
                    Margin="4"
                    Text="{Binding FirstName}"
                    TextAlignment="Left"
                    Style="{StaticResource TextBox}"/>
                     
                <TextBox
                    x:Name="SurnameTB"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Stretch"
                    Grid.Row="1"
                    Grid.Column="1"
                    Margin="4"
                    Text="{Binding LastName}"
                    TextAlignment="Left"
                    Style="{StaticResource TextBox}"/>
                     
                <StackPanel
                    Orientation="Horizontal"
                    HorizontalAlignment="Center"
                    Grid.Row="2"
                    Grid.Column="0"
                    Grid.ColumnSpan="2">
                     
                    <Button
                        Margin="4, 10, 4, 10"
                        Content="Save"
                        x:Name="saveBtn"
                        Click="saveBtn_Click"
                        Tag="plus"
                        Width="70"
                        Style="{StaticResource IconAndTextButton}"
                        />
                         
                    <Button
                        Margin="4, 10, 4, 10"
                        Content="Cancel"
                        x:Name="cancelBtn"
                        Click="cancelBtn_Click"
                        Width="70"
                        Tag="times"
                        Style="{StaticResource IconAndTextButton}"
                         />
                          
                </StackPanel>
            </Grid>
        </Border>
    </DataTemplate>
</tk:GridViewDataColumn.CellEditTemplate>

0
Accepted
Dilyan Traykov
Telerik team
answered on 25 Aug 2020, 02:35 PM

Hi Vladimir,

Thank you for the provided code snippets.

Based on them, I set up a small sample project to demonstrate a possible approach for achieving your requirement. It involves using the CellTemplateSelector property of the column and hooking it to a new property of the business object which determines whether they're being edited at the moment or not.

Do note that I've also bound the custom column to one of the properties and invoke a property changed notification to this property to reevaluate the cell template.

Please have a look and let me know if a similar approach would work for you. I will be awaiting your reply.

Regards,
Dilyan Traykov
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
GridView
Asked by
Vladimir
Top achievements
Rank 1
Veteran
Answers by
Dilyan Traykov
Telerik team
Vladimir
Top achievements
Rank 1
Veteran
Share this question
or