I can not validate the image extension using charAt

Question

I can not validate the image extension using charAt

Navigation

#1 by (1 votes)

1

I'm trying to do a simple validation on the extent of the images that will be uploaded, but it's not working very well so far, could you help me?

Follow the code I'm trying to get it to work.

var aoptionFoto = document.getElementById("optionsFotoImg").value;
var aopcDemaisTemFoto = ['Sim', 'Não'];
var ainput13 = document.getElementById("OutroTipoImagemFile").value == "";
var validaExt = ['jpg', 'png','gif', 'jpeg'];
var extImagem = ainput13.charAt(ainput13.length-3);

if(aoptionFoto == 'Sim' && ainput13 == true){
      swal({
        title: "Ops.. Algo está errado !",
        text: "Para finalizar a compra é necessario fazer o upload da imagem.",
        button: "Continuar",
      });
      document.formMonteCaixa.OutroTipoImagemFile[0].focus();

    }else if(aoptionFoto == 'Sim' && ainput13 == false && extImagem != validaExt){
      swal({
        title: "Ops.. Algo está errado !",
        text: "Para finalizar a compra é necessario fazer o upload da imagem com extensões valida.",
        button: "Continuar",
      });
      document.formMonteCaixa.OutroTipoImagemFile[0].focus();

  }else{
    document.getElementById('BlocoDeEnvioEmailPag').style.display = 'block';
  }

<p>Faça o upload da imagem</p>
            <input name="OutroTipoImagemFile" id="OutroTipoImagemFile" accept="image/*" type="file">

The error that returns in the console is this:

Uncaught TypeError: ainput13.charAt is not a function at Checkout: ((index): 407) at HTMLButtonElement.onclick ((index): 753)

javascript html if chart

asked by anonymous 14.06.2018 / 09:15

1 answer

UWP XAML ListView.ItemTemplate does not follow the column spacing defined in ListView.HeaderTemplate Firebase Query realtime database does not return changed values in the database

score 1 · Accepted Answer

You are comparing wrong values. charAt is also only getting 1 character in the string. Do the following, use split and .pop() to get the extension ( split wrap the filename in array and pop() takes the value of the last index of the array, which is exactly the extension):

var ainput = document.getElementById("OutroTipoImagemFile").value;
var ainput13 = ainput == "";
var validaExt = ['jpg', 'png','gif', 'jpeg'];
var extImagem = ainput.split(".").pop().toLowerCase();

And here:

}else if(aoptionFoto == 'Sim' && ainput13 == false && extImagem != validaExt){

You change to:

}else if(aoptionFoto == 'Sim' && ainput13 == false && !~validaExt.indexOf(extImagem)){

To check if the extension exists in the array.

Full Code:

var aoptionFoto = document.getElementById("optionsFotoImg").value;
var aopcDemaisTemFoto = ['Sim', 'Não'];
var ainput = document.getElementById("OutroTipoImagemFile").value;
var ainput13 = ainput == "";
var validaExt = ['jpg', 'png','gif', 'jpeg'];
var extImagem = ainput.split(".").pop().toLowerCase();

if(aoptionFoto == 'Sim' && ainput13 == true){
      swal({
        title: "Ops.. Algo está errado !",
        text: "Para finalizar a compra é necessario fazer o upload da imagem.",
        button: "Continuar",
      });
      document.formMonteCaixa.OutroTipoImagemFile[0].focus();

    }else if(aoptionFoto == 'Sim' && ainput13 == false && !~validaExt.indexOf(extImagem)){
      swal({
        title: "Ops.. Algo está errado !",
        text: "Para finalizar a compra é necessario fazer o upload da imagem com extensões valida.",
        button: "Continuar",
      });
      document.formMonteCaixa.OutroTipoImagemFile[0].focus();

  }else{
    document.getElementById('BlocoDeEnvioEmailPag').style.display = 'block';
  }

<p>Faça o upload da imagem</p>
            <input name="OutroTipoImagemFile" id="OutroTipoImagemFile" accept="image/*" type="file">