Handle accent with Jquery

Question

I’m having trouble treating stress in jQuery.

I would like to remove word accents and replace spaces with "%20". I tried to do it the way down, but it didn’t work.

cidade_sem_tratar = $('#estados').val();
console.log(cidade_sem_tratar);

cidade_tratada = cidade_sem_tratar
.replace(/[áàâã]/,'a')
.replace(/[éèê]/,'e')
.replace(/[óòôõ]/,'o')
.replace(/[úùû]/,'u')
.replace(' ','%20');
console.log(cidade_tratada);

The result is as follows:

Please, could you help me?

Hug and Thanks!

Answer 1

Your code is correct in replacing accents, but to replace ALL spaces, change the last one replace for:

.replace(/\s/g,'%20')

As it stands, it will replace only the first space found.

See working:

cidade_sem_tratar = $('#estados').val();
console.log(cidade_sem_tratar);

cidade_tratada = cidade_sem_tratar
.replace(/[áàâã]/,'a')
.replace(/[éèê]/,'e')
.replace(/[óòôõ]/,'o')
.replace(/[úùû]/,'u')
.replace(/\s/g,'%20');
console.log(cidade_tratada);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="estados" value="Afonso Cláudio" />

Using Function

function remAcentos(v){
   var c='áàãâäéèêëíìîïóòõôöúùûüçÁÀÃÂÄÉÈÊËÍÌÎÏÓÒÕÖÔÚÙÛÜÇ';
   var s='aaaaaeeeeiiiiooooouuuucAAAAAEEEEIIIIOOOOOUUUUC';
   var n = '';
   for(var x=0;x<v.length;x++){
      c.search(v.substr(x,1))>=0 ?
      n+=s.substr(c.search(v.substr(x,1)),1) :
      n+=v.substr(x,1);
   }
   return n;
}

cidade_sem_tratar = $('#estados').val();
console.log(cidade_sem_tratar);
cidade_tratada = remAcentos(cidade_sem_tratar).replace(/\s/g,'%20');
console.log(cidade_tratada);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="estados" value="Afonso Cláudio" />

Answer 2

Check that the encodeURI function does what it wants, for example:

var myStr = "Afonso Cláudio";
var res = encodeURI(myStr);

function to remove accents:

function removerAcentos( newStringComAcento ) {
  var string = newStringComAcento;
  var mapaAcentosHex    = {
    a : /[\xE0-\xE6]/g,
    A : /[\xC0-\xC6]/g,
    e : /[\xE8-\xEB]/g,
    E : /[\xC8-\xCB]/g,
    i : /[\xEC-\xEF]/g,
    I : /[\xCC-\xCF]/g,
    o : /[\xF2-\xF6]/g,
    O : /[\xD2-\xD6]/g,
    u : /[\xF9-\xFC]/g,
    U : /[\xD9-\xDC]/g,
    c : /\xE7/g,
    C : /\xC7/g,
    n : /\xF1/g,
    N : /\xD1/g
};

for ( var letra in mapaAcentosHex ) {
    var expressaoRegular = mapaAcentosHex[letra];
    string = string.replace( expressaoRegular, letra );
}

return string;
}

You can use the remove function and then encodeURI to put %20 in the spaces

Answer 3

replace in javascript works with regex, and vc n is passing a regex to swap the spaces. tries to put like this:

string.replace(/ /g, '%20');

You can test regex on websites like this, for example: https://regex101.com/