edit profile validation refreshes all field if missing wordpress

Approach 1, disable save button

What you can do, is to prevent the user from saving the form if the required fields are not filled. This can be simply done via javascript.

function require_fields_script(){
    echo "
        <script type="text/javascript">
            (function($){
                $('#submit').on('click',function(e){
                    if (!$('#email').val() || !$('#nickname').val()){
                        e.preventDefault();
                        if (!$('#email').val()) {
                            window.alert('Please enter your email before saving.');
                        } else {
                            window.alert('Please enter your nickname before saving.');
                        }
                    }
                });
            })(jQuery);
        </script>";
}
add_action( 'admin_footer', 'require_fields_script' );

This can also be done by saving the values in a transient/globals and retrieving them after a fail save, but that’s not necessary.

The point is, if the field is not set, there is no reason to let the user save it at the first place.

Approach 2, revert to default values

There is also another trick. When you load the page, there will be some default/pre-saved value as email and nickname. If the user tried to save the form without entering these, you can set them back to the old values. To do so, this is your way:

function require_fields_script(){
    echo "
        <script type="text/javascript">
            (function($){
                var currentMail = $('#email').val();
                var currentNickname = $('#nickname').val();
                $('#submit').on('click',function(e){
                    if (!$('#email').val()){
                        $('#email').val(currentMail);
                    }
                    if (!$('#nickname').val()){
                        $('#nickname').val(currentNickname);
                    }
                });
            })(jQuery);
        </script>";
}
add_action( 'admin_footer', 'require_fields_script' );

Approach 3, fake an admin alert using jQuery

We can create a fake admin error by using $.before if the fields are not set. This is how we do it:

function require_fields_script(){
    echo "
        <script type="text/javascript">
            (function($){
                $('#submit').on('click',function(e){
                    if (!$('#email').val()){
                        e.preventDefault();
                        $( '#your-profile' ).before( '<div class=\'error\'><p><strong>ERROR</strong>: Please enter an email.</p><button type=\'button\' class=\'notice-dismiss\'><span class=\'screen-reader-text\'>Dismiss this notice.</span></button></div>' );
                        $('html,body').animate({scrollTop:0},700);
                    }
                    if (!$('#nickname').val()){
                        e.preventDefault();
                        $( '#your-profile' ).before( '<div class=\'error\'><p><strong>ERROR</strong>: Please enter a nickname.</p><button type=\'button\' class=\'notice-dismiss\'><span class=\'screen-reader-text\'>Dismiss this notice.</span></button></div>' );
                        $('html,body').animate({scrollTop:0},700);
                    }
                });
            })(jQuery);
        </script>";
}
add_action( 'admin_footer', 'require_fields_script' );

This will throw an error and scroll the page to top, so the user can be noticed of the error. We can remove the div afterward, but since it will be removed automatically on save, it’s not really necessary to do. Anyway, to remove the errors, you can use $.remove():

if ($('.error').length) {
    $('.error').remove();
}

PATCH UPDATE

I’ve created a patch that fully resolves the issue by doing AJAX and jQuery checks. The patch can be found on trac here. At the moment it has a minor bug, which I’ll cover it that soon.