Hello.
In override to show the user the image dimensions before upload.
This JS can help you.
In my case it disables the submit button, and generates a warning to the user.
//Coloca a biblioteca Jquery no seu HTML.
jQuery("#img_principal").change(function() { //campo de imagem
var fr = new FileReader;
fr.onload = function() {
var img = new Image;
img.onload = function() {
if (img.width < 1400 && this.height < 800) {
jQuery('.aviso').append("
Sua imagem é menor que 1400px de largura por 800px de altura use outra imagem
");
jQuery("#submit").attr("disabled", true); //Desabilita o botão sumbit
} else {
jQuery('.aviso').remove(); //remove a DIV aviso
jQuery('.aviso').append(" Sua imagem tem as dimensões corretas
"); //add outra mensagem
jQuery("#submit").removeAttr("disabled"); // Abilita o botão submit
}
};
img.src = fr.result;
};
fr.readAsDataURL(this.files[0]);
}); Gist link > https://gist.github.com/Uriel29/675faf3ca6e83c01e6ea