Add and subtract values when hiding or showing a div

Question

Add and subtract values when hiding or showing a div

Navigation

#1 by (0 votes)
#2 by (0 votes)

0

I would like to see if you can help me, guide me to solve this problem, I have a gross value and from this I can add or subtract values, depending on the selection I make, I mean, I come with a gross value of 500000, here I can select if by the combobox if I have scholarships, if I have a scholarship I must add the amount that will be added to the total, and the same for extra contributions, if I select if I should add the amount that will be added to the total, I think that it does, but my problem is that if I go back to hide any of the previous div does not perform the subtraction and I do not know what I'm failing, here I leave my code to see if you can help me:

Javascript:

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
function Suma(name){
    param=document.getElementById('ingreso').value;
    param1=document.getElementById('monto_aporte').value;

    if($('#aporteNo').is(':checked')){
        document.getElementById('total').value=eval(param);
    }else{
        document.getElementById('total').value=eval(param)+eval(param1);
    }
}

function Resta(name){
    param=document.getElementById('ingreso').value;
    param1=document.getElementById('monto_aporte').value;

    document.getElementById('total').value=eval(param);
}

function SumaS(name){
    param=document.getElementById('ingreso').value;
    param2=document.getElementById('monto_s').value;

    if($('#sNo').is(':selected')){
        document.getElementById('total').value=eval(param);
    }else{
        document.getElementById('total').value=eval(param)+eval(param2);
    }
}

function RestaS(name){
    param=document.getElementById('ingreso').value;
    param2=document.getElementById('monto_s').value;

    document.getElementById('total').value=eval(param);
}

$(document).ready(function (){
    $('input[name=aporte]').click(function (){
        if($(this).val()==1){
            $("#monto").fadeIn();
        }else{
            $("#monto").fadeOut();
        }
    });

});

function mostrar(id) {
    if (id!=8) {
        $("#montoS").show();
    }
    if (id==0 || id==8) {
        $("#montoS").hide();
    }
}
</script>

HTML:

<table width="534" border="0" cellspacing="3" cellpadding="0">
         <tr>
              <td width="137" class="label">&nbsp;</td>
              <td width="182">&nbsp;</td>
              <td width="195" class="ejemplos">&nbsp;</td>
            </tr>

              <td height="36" class="label">Total Liquido</td>
              <td>
                <input name="ingreso" type="text" id="ingreso" value="500000" onchange="javascript:Suma();"  onKeyPress="return isNumberKey(event)"/>
              </td>
              <td class="txtAdvertencia">&nbsp;</td>
            </tr> 
           <tr>
              <td class="txtBoldNormal">Tienes beca</td>
              <td>
                  <select name="ts" id="ts" onChange="mostrar(this.value);">
                    <option value="0">--</option>
                    <option value="8"  id="sSi" <?php if($pdata['ts']=="8") { echo "selected=\"selected\"";}?> onclick="javascript:RestaS();">Ninguno</option>
                    <option value="9"  id="sNo" <?php if($pdata['ts']=="9") { echo "selected=\"selected\"";}?> onclick="javascript:SumaS();">1</option>
                    <option value="10" id="sNo" <?php if($pdata['ts']=="10"){ echo "selected=\"selected\"";}?> onclick="javascript:SumaS();">2</option>
                    <option value="11" id="sNo" <?php if($pdata['ts']=="11"){ echo "selected=\"selected\"";}?> onclick="javascript:SumaS();">3  ó más</option>
                  </select>
                  </td>
              <td >&nbsp;</td>
            </tr>
            <tr id="montoS" style="display:<?PHP echo ($pdata['ts']==9 || $pdata['ts']==10 || $pdata['ts']==11)?"checked=\"block\"":"none";?>">
              <td height="36" class="label">Monto</td>
              <td><input id="monto_s" name="monto_s" type="text" value="<?php if($pdata['monto_s']!=""){echo $pdata['monto_s'];}else{echo "0";};?>" onchange="javascript:SumaS();" onKeyPress="return isNumberKey(event)"/>
             </td>
              <td class="txtAdvertencia">&nbsp;</td>
            </tr>
            <tr>
              <td class="txtBoldNormal">&nbsp;</td>
              <td>&nbsp;</td>
              <td class="txtAdvertencia">&nbsp;</td>
            </tr>
            <tr>
              <td height="35" class="label">Aportes Extras</td>
              <td  class="label">
                <input type="radio" name="aporte" id="aporteSi" value="1" <?php if($pdata['aporte']=="1"){ echo "checked";}?> onclick="javascript:Suma();"/>Si
                <input type="radio" name="aporte" id="aporteNo" value="0" <?php if($pdata['aporte']=="0"){ echo "checked";}?> onclick="javascript:Resta();"/>No
              </td>
              <td></td>
            </tr>
            <tr>
              <td class="txtBoldNormal">&nbsp;</td>
              <td>&nbsp;</td>
              <td class="txtAdvertencia">&nbsp;</td>
            </tr>
            <tr id="monto" style="display:<?PHP echo ($pdata['aporte']==1)?"checked=\"block\"":"none";?>">
              <td height="36" class="label">Monto Aporte</td>
              <td><input id="monto_aporte" name="monto_aporte" type="text"  value="<?php if($pdata['monto_aporte']!=""){echo $pdata['monto_aporte'];}else{echo "0";};?>" onchange="javascript:Suma();" onKeyPress="return isNumberKey(event)"/>
             </td>
              <td>&nbsp;</td>
            </tr>

            <tr>
              <td class="label">INGRESOS TOTALES (ingresos)</td>
              <td><span>
                <input name="total" type="text" id="total" value="<?php if($pdata['total']!=""){echo $pdata['total'];}else{echo "0";};?>" onchange="javascript:Suma();SumaS();" onKeyPress="return isNumberKey(event)" />
              </span></td>
              <td>&nbsp;</td>
            </tr>
          </table>

And before closing the body I call the functions in block js:

<script>
    Suma();
    SumaS();
</script>

javascript php

asked by Juanjo Medina 13.11.2017 в 22:43

source

2 answers

I have 32 dictionaries and I need to change the quotation marks of each object, since they are incorrectly placed, with a replace or something, can it? Error in gulp "throw er; // Unhandled 'error' event "

score 0 · Answer 1

[! [Thank you, my friend, if I explain myself here better, the fields amount of Scholarship and Amount of contribution are hidden div, that if I select them as this in the image they should be added to the total income: Liquid income + amount of scholarship + amount of contribution and vicevera if hidden the div subtract to the total income. ]] [My problem is that for a moment the amount of the contribution if it worked for me and now I do not obey anything.]

score 0 · Answer 2

I'm not sure what your problem is, but I think this can help you.

Your combobox is as follows:

<select name="ts" id="ts" onChange="mostrar(this.value);">
    <option value="0">--</option>
    <option value="8"  id="sSi" <?php if($pdata['ts']=="8") { echo "selected=\"selected\"";}?> onclick="javascript:RestaS();">Ninguno</option>
    <option value="9"  id="sNo" <?php if($pdata['ts']=="9") { echo "selected=\"selected\"";}?> onclick="javascript:SumaS();">1</option>
    <option value="10" id="sNo" <?php if($pdata['ts']=="10"){ echo "selected=\"selected\"";}?> onclick="javascript:SumaS();">2</option>
    <option value="11" id="sNo" <?php if($pdata['ts']=="11"){ echo "selected=\"selected\"";}?> onclick="javascript:SumaS();">3  ó más</option>
</select>

Your problem here is that you have an event onClick in each of the options, this in itself is not necessary. What you need to do is leave the job to the Combobox with the event onChange . See the following code (remove the PHP code to make it clearer) :

<select name="ts" id="ts" onChange="TienesBeca(this.value);">
    <option value="0">--</option>
    <option value="8">Ninguno</option>
    <option value="9">1</option>
    <option value="10">2</option>
    <option value="11">3  ó más</option>
</select>

In the onChange event of the combo we have added a new function, which will be as follows:

function TienesBeca(tieneBecaValor) {

    switch (tieneBecaValor) {
        case 9:
        case 10:
        case 11:
            SumaS();
            $("#montoS").show();
            break;
        case 8:
            RestaS();
        default:
            $("#montoS").hide();
            break;
    }
}

When it is 9.10 or 11, the function SumaS() is called and #montoS is shown. When the option is an 8, call the function RestaS() and hide #montoS , it will also be hidden when a value arrives outside the switch.