[eljakovarkadiy]

Добрый день!

Есть форма:

<form  id="regforma" style="flex: 1 100%">
            <label class="note">Регистрация нового пользователя</label>
            <label class="input-holder full-name"><span class="input-title">Полное Имя*</span>
              <input type="text"/>
            </label>
            <label class="input-holder"><span class="input-title">Логин*</span>
              <input type="text"/>
            </label>
            <label class="input-holder"><span class="input-title">Пароль*</span>
              <input type="password"/>
            </label>
            <label class="input-holder"><span class="input-title">Подтвердить пароль*</span>
              <input type="password"/>
            </label>
            <div class="upload-image preview-img-upload"><span class="input-title">Загрузить Аватар*</span>
              <div class="preview-img-holder"><span class="remove-image fa fa-times"></span>
                <div class="img-holder"><img class="preview-img" src="" alt="image" draggable="false"/></div>
              </div>
              <label class="input-holder"><span class="icon fa fa-cloud-upload"></span>
                <input class="hide" type="file" accept="image/*"/>
              </label>
            </div>
            <label class="input-holder submit">
             <input type="submit" value="Регистрация" />
            </label>
            <p class="error-msg">Пожалуйста, заполните все поля</p>
          </form>

Необходимо, чтобы при нажатии на кнопку "Регистрация" происходило перенаправление на другую страницу(с проверкой заполненных полей), а данная команда должна появится на той же странице, на которую пользователь попадет после нажатия кнопки "зарегистрироваться" :

<div class="welcome-msg">
            <div class="user-img"><img src="" alt="image" draggable="false"/></div>
            <p class="paragraph-message">Добро пожаловать, <span class="username"></span></p>
          </div>

Сам скрипт:

function previewImageBeforeUpload() {
  var element = $('.preview-img-upload');
  var reader;

  function readURL(input, selector) {
    if (input.files && input.files[0]) {
      reader = new FileReader();
      reader.onload = function(e) {
        selector
          .parents('.preview-img-upload')
          .addClass('active')
          .find('.preview-img')
          .attr('src', e.target.result);
      };
      reader.readAsDataURL(input.files[0]);
    }
  }

  function removeImage() {
    element
      .find('.remove-image')
      .click(function() {
        $(this)
          .parents('.preview-img-upload').removeClass('active').find('.preview-img').attr('src', '');
        $(this).parents('.preview-img-upload').find('input').val('');
        });
    }
    removeImage();

  $(document.body).on('change', '.preview-img-upload input', function() {
        readURL(this, $(this));
    });

}
previewImageBeforeUpload();

$('#regforma').on('submit', function(e){
  var $this = $(this);
  var isEmpty = $this.find('input').filter(function(){
            return this.value === "";
        });
  if(isEmpty.length){
 e.preventDefault();
    $this.find('.error-msg').addClass('active');
  }else{
    
      var userName = $('.full-name input').val();
      var userImage = $('.preview-img').attr('src');

      $('.welcome-msg .user-img img').attr('src', userImage);
      $('.welcome-msg .paragraph-message .username').text(userName);

    $('.page-holder').addClass('active');
    setTimeout(function(){
      $this.hide();
      $('.welcome-msg').addClass('active');
    }, 1000);
  }
  
});

// hide error message if input keyup
$('input').change(function(){
  $('.error-msg').removeClass('active');
})
})