Search code examples
blazorblazor-client-side

how capture if EditForm component is "dirty" in Blazor webassembly


Is there an equivalent to the concept of dirty forms in Angular for EditForm in Blazor Webassembly? I would like to show up a text "You have made changes. Any unsaved changes will be lost!" to indicate the user that something is not yet saved and the submit button should be hit before leaving.


Solution

  • Yes, there is, but we don't use dirty words, we use modified or unmodified.

    The EditContext class provide the following:

         /// <summary>
            /// Determines whether any of the fields in this <see cref="EditContext"/> have been modified.
            /// </summary>
            /// <returns>True if any of the fields in this <see cref="EditContext"/> have been modified; otherwise false.</returns>
            public bool IsModified()
            {
                // If necessary, we could consider caching the overall "is modified" state and only recomputing
                // when there's a call to NotifyFieldModified/NotifyFieldUnmodified
                foreach (var state in _fieldStates)
                {
                    if (state.Value.IsModified)
                    {
                        return true;
                    }
                }
    
            return false;
            }
    
    
        /// <summary>
            /// Determines whether the specified fields in this <see cref="EditContext"/> has been modified.
            /// </summary>
            /// <returns>True if the field has been modified; otherwise false.</returns>
            public bool IsModified(in FieldIdentifier fieldIdentifier)
                => _fieldStates.TryGetValue(fieldIdentifier, out var state)
                ? state.IsModified
                : false;
    
            /// <summary>
            /// Determines whether the specified fields in this <see cref="EditContext"/> has been modified.
            /// </summary>
            /// <param name="accessor">Identifies the field whose current validation messages should be returned.</param>
            /// <returns>True if the field has been modified; otherwise false.</returns>
            public bool IsModified(Expression<Func<object>> accessor)
                => IsModified(FieldIdentifier.Create(accessor));