How to use two scripts in a single select (onechange)

1

I have a question: I have two scripts, one to change the image and another of the respective select, and another to make the calculation between them.

I would like to use both for the same select, the problem is that one is used with:

onchange="processa(this.options[this.selectedIndex].value,'');

and the other one with:

onchange="processa();

In this case what can I do to use these two scripts, in a single select simultaneously?

Script 1

<script type="text/javascript">
/* URL of folder with images  */
var baseURL_OF_images = "file:///C|/Users/Vilma/Desktop/Developer/EloBurn/elojob/";
/* array of default image files */
var images =
      [ "bronze.png", 
        "prata.png",
        "gold.png", 
        "platina.png",
        "diamante.png" 
        ]

        function processa(imgNum,target){
        var z = parseInt(imgNum);
        var x = z - 1;
        var src = baseURL_OF_images + ( ( x < 0 ) ? "bronze.png": images[x] );

  document.getElementById("AvatarImage"+target).src = src;
  return true;
}
</script>

Script 2

<script>
function processa(){
    //recolhe a informação dos select's
    var tipo_e = $("#tipo_esq option:selected").val();
    var div_e = $("#div_esq option:selected").val();
    var tipo_d = $("#tipo_dir option:selected").val();
    var div_d = $("#div_dir option:selected").val();

    //definir as arrays com as combinacoes e os respectivos valores
    var combinacoes = ['11','12','13','14','15','21','22','23','24','25','31','32','33','34','35','41','42','43','44','45','51','52','53','54','55'];
    var valor = ["15","15","15","15","15","20","20","20","20","20","25","25","25","25","25","45","45","45","45","45","120","120","120","120","120"];

    //definir as chaves
    var esquerda = tipo_e+div_e;
    var direita = tipo_d+div_d;

    //encontrar as chaves na array
    var pum = combinacoes.indexOf(esquerda);
    var pdois = combinacoes.indexOf(direita);

    var soma = parseInt("0");

    //verificacao dos resultados e mostragem dos mesmos se estiver tudo bem
    if(pum >= pdois){
    $("#erro").text("uma frase qualquer de erro");
    $("#valor").text("");
    }else{
    for (var i in valor) { 
        if(i >= pum && i < pdois){
        var vvv = parseInt(valor[i]);
            soma = soma + vvv; 
            var fim = "R$ "+soma+",00";
            $("#valor").text(fim);
        }
    } 
    }
}
</script>

My code:

<img id="AvatarImage" name="AvatarImage" src="file:///C|/Users/Vilma/Desktop/Developer/EloBurn/elojob/bronze.png" style="widht:200px;height:200px;" />
<select id="tipo_esq" onchange="processa();">
    <option value="1" selected>Bronze</option>
    <option value="2">Prata</option>
    <option value="3">Ouro</option>
    <option value="4">Platina</option>
    <option value="5">Diamante</option>
</select>
<select id="div_esq" onchange="processa();">
    <option value="1" selected>Division V</option>
    <option value="2">Division IV</option>
    <option value="3">Division III</option>
    <option value="4">Division II</option>
    <option value="5">Division I</option>
</select>
<img id="AvatarImage2" name="#AvatarImage2" src="file:///C|/Users/Vilma/Desktop/Developer/EloBurn/elojob/bronze.png" style="widht:200px;height:200px;" />
<select id="tipo_dir" onchange="processa();">
    <option value="1" selected>Bronze</option>
    <option value="2">Prata</option>
    <option value="3">Ouro</option>
    <option value="4">Platinum</option>
    <option value="5">Diamante</option>
</select>
<select id="div_dir" onchange="processa();">
    <option value="1" selected>Division V</option>
    <option value="2">Division IV</option>
    <option value="3">Division III</option>
    <option value="4">Division II</option>
    <option value="5">Division I</option>
</select>

<div class="col-md-6" id="valor"></div>
<div class="col-md-6" id="erro"></div>

Sincerely

    
asked by anonymous 21.05.2016 / 19:54

1 answer

0

Uses .eventHandler in JavaScript. So you run a function every time a select on page changes (the same unique code is for everyone) and within the processa function in the example below you know that this is select and this.value is the selected value of select .

var selects = document.querySelectorAll('select');
for (var i = 0; i < selects.length; i++){
    selects[i].addEventListener('change', processa);
}

function processa(e){
    fn1(this.value, '');
    fn2();
}
    
21.05.2016 / 19:57