Skip to main content
Adiciona mais exemplos
Fonte Link
Valdeir Psr
  • 11mil
  • 2
  • 18
  • 33
jQuery(document).ready(function() {
    jQuery('select[name="idservico[]"]').change(function() {

        let selects = jQuery("select[name=\"idservico[]\"]");
        let valorDoSelect = 0;
        
        /* Captura e soma o valor dode "select"todos os select */
        let$(selects).map(function(i, e) {
          valorDoSelect =+= parseFloat(jQuery $(thise).find(':selected').data('valor').toString().replace(",", ".") );
        });
    
        /* CapturaExibe o valor do "input" */
        $('#valor').val( valorDoSelect )
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select name="idservico[]" id="idservico">
  <option data-valor="0" value="1">Selecione uma opção</option>
  <option data-valor="25,00" value="2">opção 1 (R$ 25,00)</option>
  <option data-valor="20,00" value="3">opção 2 (R$ 20,00)</option>
</select>

<select name="idservico[]" id="idservico2">
  <option data-valor="0" value="4">Selecione uma opção</option>
  <option data-valor="50,00" value="5">opção 3 (R$ 50,00)</option>
  <option data-valor="40,00" value="6">opção 4 (R$ 40,00)</option>
</select>


<input type="text" name="valor" id="valor" readonly />

ou ainda

jQuery(document).ready(function() {
    jQuery('select[name="idservico[]"]').change(function() {

        let valorDoInputselects = jQuery("select[name=\"idservico[]\"]");
        let total = 0;
        
        /* VerificaPercorre setodos oos "input"select */
 possui um valor para ser somado */ $(selects).map(function(i, e) {
        if ( let values = $('#valor'e).valfind(":selected");
 != ""      
          /* Percorre todos os valores selecionados */
          $(values).map(function(k, j) {
            valorDoInputtotal =+= parseFloat( $('#valor'j).valdata('valor').replace(",", ".") );
          });
    
     });
    /* Soma os valores */
        $('#valor'"#valor").val( valorDoSelect + valorDoInput total);
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select name="idservico[]" id="idservico">id="idservico" multiple>
  <option data-valor="25,00" value="1">opção 1 (R$ 25,00)</option>
  <option data-valor="20,00" value="1">opçãovalue="2">opção 2 (R$ 20,00)</option>
  <option data-valor="50,00" value="3">opção 3 (R$ 50,00)</option>
  <option data-valor="40,00" value="4">opção 4 (R$ 40,00)</option>
</select>

<select name="idservico[]" id="idservico2">id="idservico" multiple>
  <option data-valor="50valor="1,00" value="1">opção 35 (R$ 501,00)</option>
  <option data-valor="40valor="2,00" value="1">opçãovalue="2">opção 46 (R$ 402,00)</option>
  <option data-valor="3,00" value="3">opção 7 (R$ 3,00)</select>option>
  <option data-valor="4,00" value="4">opção 8 (R$ 4,00)</option>
</select>

<input type="text" name="valor" id="valor" readonly />
jQuery(document).ready(function() {
    jQuery('select[name="idservico[]"]').change(function() {

        /* Captura o valor do "select" */
        let valorDoSelect = parseFloat(jQuery(this).find(':selected').data('valor').replace(",", "."));

        /* Captura o valor do "input" */
        let valorDoInput = 0;
        
        /* Verifica se o "input"  possui um valor para ser somado */
        if ($('#valor').val() != "") {
            valorDoInput = parseFloat($('#valor').val());
        }
    
         /* Soma os valores */
        $('#valor').val( valorDoSelect + valorDoInput )
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select name="idservico[]" id="idservico">
  <option data-valor="25,00" value="1">opção 1 (R$ 25,00)</option>
  <option data-valor="20,00" value="1">opção 2 (R$ 20,00)</option>
</select>

<select name="idservico[]" id="idservico2">
  <option data-valor="50,00" value="1">opção 3 (R$ 50,00)</option>
  <option data-valor="40,00" value="1">opção 4 (R$ 40,00)</option>
</select>


<input type="text" name="valor" id="valor" readonly />
jQuery(document).ready(function() {
    jQuery('select[name="idservico[]"]').change(function() {

        let selects = jQuery("select[name=\"idservico[]\"]");
        let valorDoSelect = 0;
        
        /* Captura e soma o valor de todos os select */
        $(selects).map(function(i, e) {
          valorDoSelect += parseFloat( $(e).find(':selected').data('valor').toString().replace(",", ".") );
        });
    
        /* Exibe o valor */
        $('#valor').val( valorDoSelect )
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select name="idservico[]" id="idservico">
  <option data-valor="0" value="1">Selecione uma opção</option>
  <option data-valor="25,00" value="2">opção 1 (R$ 25,00)</option>
  <option data-valor="20,00" value="3">opção 2 (R$ 20,00)</option>
</select>

<select name="idservico[]" id="idservico2">
  <option data-valor="0" value="4">Selecione uma opção</option>
  <option data-valor="50,00" value="5">opção 3 (R$ 50,00)</option>
  <option data-valor="40,00" value="6">opção 4 (R$ 40,00)</option>
</select>


<input type="text" name="valor" id="valor" readonly />

ou ainda

jQuery(document).ready(function() {
    jQuery('select[name="idservico[]"]').change(function() {

        let selects = jQuery("select[name=\"idservico[]\"]");
        let total = 0;
        
        /* Percorre todos os select */
        $(selects).map(function(i, e) {
          let values = $(e).find(":selected");
        
          /* Percorre todos os valores selecionados */
          $(values).map(function(k, j) {
            total += parseFloat( $(j).data('valor').replace(",", ".") );
          });
        });
        
        $("#valor").val(total);
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select name="idservico[]" id="idservico" multiple>
  <option data-valor="25,00" value="1">opção 1 (R$ 25,00)</option>
  <option data-valor="20,00" value="2">opção 2 (R$ 20,00)</option>
  <option data-valor="50,00" value="3">opção 3 (R$ 50,00)</option>
  <option data-valor="40,00" value="4">opção 4 (R$ 40,00)</option>
</select>

<select name="idservico[]" id="idservico" multiple>
  <option data-valor="1,00" value="1">opção 5 (R$ 1,00)</option>
  <option data-valor="2,00" value="2">opção 6 (R$ 2,00)</option>
  <option data-valor="3,00" value="3">opção 7 (R$ 3,00)</option>
  <option data-valor="4,00" value="4">opção 8 (R$ 4,00)</option>
</select>

<input type="text" name="valor" id="valor" readonly />
Fonte Link
Valdeir Psr
  • 11mil
  • 2
  • 18
  • 33

Acontece que dessa forma você não está somando, está apenas pegando o valor do select e adicionando no input.

Segue um exemplo que pode auxiliar.

jQuery(document).ready(function() {
    jQuery('select[name="idservico[]"]').change(function() {

        /* Captura o valor do "select" */
        let valorDoSelect = parseFloat(jQuery(this).find(':selected').data('valor').replace(",", "."));

        /* Captura o valor do "input" */
        let valorDoInput = 0;
        
        /* Verifica se o "input" já possui um valor para ser somado */
        if ($('#valor').val() != "") {
            valorDoInput = parseFloat($('#valor').val());
        }
    
        /* Soma os valores */
        $('#valor').val( valorDoSelect + valorDoInput )
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select name="idservico[]" id="idservico">
  <option data-valor="25,00" value="1">opção 1 (R$ 25,00)</option>
  <option data-valor="20,00" value="1">opção 2 (R$ 20,00)</option>
</select>

<select name="idservico[]" id="idservico2">
  <option data-valor="50,00" value="1">opção 3 (R$ 50,00)</option>
  <option data-valor="40,00" value="1">opção 4 (R$ 40,00)</option>
</select>


<input type="text" name="valor" id="valor" readonly />

Quando você trabalha com moedas, evite utilizar vírgula (Ex: 25,00) para separar as casas decimais, utilize sempre pontos (Ex: 25.00).