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