Как автоматически заполнить поверочного текст

Question

У меня есть форма в моем веб-приложение с этими метками:

<p> 
    <label>Imponibile</label> 
    <span class="field"> 
<input type="text" name="imponibile" id="imponibile" class="width100" value="<?php echo $pagamento['imponibile'] ?>" /> 
</span> 
</p> 
<p> 
    <label>Iva %</label> 
    <span class="field"> 
<input type="text" name="iva" id="iva" class="width100" value="<?php echo $pagamento['iva'] ?>" /> 
</span> 
</p> 
<p> 
    <label>Totale</label> 
    <span class="field" id="totale"> 0.0 
</span> 
</p> 

Я хотел бы, что, когда пользователь вводит значение Iva% и Imponibile то промежуток Тотале должен заполняться значение, заданное формулой для превалирующего тега. Вот что я написал:

<script type="text/javascript"> 
    jQuery(document).ready(function(){ 

    ... 
    $("#totale").text($("#imponibile").val()+($("#imponibile").val() * $("#iva").val())); 
    }); 
</script> 

который не работает. У меня нет опыта JS или jQuery. Любая помощь?

Код: JQuery (документ) .ready (функция() {

jQuery('#datepicker').datepicker({ 
    changeMonth: true, 
    changeYear: true, 
    showButtonPanel: true, 
    yearRange: "-80:+0", 
    dateFormat: 'dd-mm-yy' 
}); 

jQuery("#form1").validate({ 

    errorPlacement: function (error, element) { 
     //check whether chosen plugin is initialized for the element 
     if (element.data().chosen) { //or if (element.next().hasClass('chosen-container')) { 
      element.next().after(error);} 
     else {element.after(error);} 
    }, 

    ignore: [], 
    rules: { 
     id_progetto: "required", 
     imponibile: "required", 
     data_pagamento: "required", 
     metodo_pagamento: "required", 
     tipo_pagamento: "required", 
     iva: "required", 
     is_pagato: "required", 
    }, 

    messages: { 
     id_progetto: "Specifica il progetto di riferimento", 
     imponibile: "Inserisci il valore dell'imponibile del pagamento", 
     data_pagamento: "Inserisci la data del pagamento", 
     metodo_pagamento: "Seleziona un metodo di pagamento", 
     tipo_pagamento: "Seleziona la tipologia del pagamento", 
     iva: "Inserisci il valore corretto dell'IVA", 
     is_pagato: "Indica se il pagamento è stato versato", 

    } 
}); 

var value = parseFloat($("#imponibile").val()) + (parseFloat($("#imponibile").val()) * parseFloat($("#iva").val())); 
$("#totale").text(value); 

jQuery(".submit").click(function(){ 
    if(jQuery("#form1").valid()) 
    jQuery("#caricamento").css("display","block"); 
}); 

}); 

Answer 1

Вы должны использовать parseFloat числовых значений:

var value = parseFloat($("#imponibile").val()) + (parseFloat($("#imponibile").val()) * parseFloat($("#iva").val())); 

$("#totale").text(value); 

Documentation

Answer 2

Trigger этот расчет на изменение ввода

$('#iva').on('input',function(){ 
    var imponibile = parseInt($("#imponible").val(), 10); 
    var iva = parseInt($("#iva").val(), 10); 

    // calculate 
    var totale = imponibile * iva; 
    // output to frontend 
    $("#totale").text(totale); 
}); 

Answer 3

Вы никогда не назначаете какое-либо входное или любое другое событие для ввода.

function Total(){ 
    var tIva = $('#iva'); 
    var tImp = $('#imponibile'); 
    var tT = $('#totale'); 

    tT.html((parseFloat(tIva.val()) + parseFloat(tImp.val())).toFixed(2)) 
} 

$(document).ready(function(){ 
    $('#iva').bind('input', function(){Total()}) 
    $('#imponibile').bind('input', function(){Total()}) 
}) 

https://jsfiddle.net/vdfjrhu9/

Или здесь с JQuery

https://jsfiddle.net/vdfjrhu9/1/

Answer 4

Попробуйте это ..

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 

<script> 
$('#iva').on('input',function(){ 
    var value = parseFloat($("#imponibile").val()) +  (parseFloat($("#imponibile").val()) * parseFloat($("#iva").val())); 
$("#totale").text(value); 
}); 
</script> 

Working Fiddle Here