Forums

JS Calculated fields not saving in DB

Jmac201 14 Oct, 2014
Hi there,

I hope someone can help me solve this problem. I have a form with 3 different fields being calculated by a custom javascript. The javascript is working as it should displaying the sum of the fields. The problem is that when the form is saved to the database the sum that is calculated is saved in the database as a 0. I need it to save the numbers that it is displaying to the users. I have tried many things trying to resolve this but I am afraid it is above my coding skillset and need any help I can get. I have included the JS and Form code below and attached screenshots of the database schema and the results that are saved:

window.addEvent('domready', function () {
      $('pinicial').addEvent('change', rekenen1);
    $('pfinal').addEvent('change', rekenen1);
});

function rekenen1() {
    $('tprinted').value = parseInt($('pfinal').value) - parseInt($('pinicial').value);
}
window.addEvent('domready', function () {
    $('timpresas').readOnly = true;
    $('rinicial').addEvent('change', rekenen2);
    $('rfinal').addEvent('change', rekenen2);
});

function rekenen2() {
    $('timpresas').value = parseInt($('rinicial').value) - parseInt($('rfinal').value);
}
window.addEvent('domready', function () {
    $('subtotal').readOnly = true;
    $('timpresas').addEvent('change', rekenen3);
    $('vendidas').addEvent('change', rekenen3);
    $('mermas').addEvent('change', rekenen3);
    $('cortesias').addEvent('change', rekenen3);

});

function rekenen3() {
    $('subtotal').value = parseInt($('vendidas').value) + parseInt($('mermas').value) + parseInt($('cortesias').value);
}



</fieldset>
<fieldset class="chronoform-container" id="chronoform-container-21">
    <legend></legend>
    <div class="form-group gcore-form-row" id="form-row-multi-22">
        <div class="gcore-subinput-container" id="fitem-pinicial">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-pinicial">
                <input name="pinicial" id="pinicial" value="" placeholder="" maxlength="" size="6" class="validate['required','number'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" /><span class="help-block">Printed Incial</span>
            </div>
        </div>
        <div class="gcore-subinput-container" id="fitem-pfinal">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-pfinal">
                <input name="pfinal" id="pfinal" value="" placeholder="" maxlength="" size="6" class="validate['required','number'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" /><span class="help-block">Printed Final</span>
            </div>
        </div>
        <div class="gcore-subinput-container" id="fitem-tprinted">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-tprinted">
                <input name="tprinted" id="tprinted" value="" placeholder="" maxlength="" size="6" class="validate['custom:rekenen1'] form-control A" title="" style="" data-inputmask="" data-load-state="disabled" data-tooltip="" type="text" /><span class="help-block">Total Printed</span>
            </div>
        </div>
        <div class="gcore-subinput-container" id="fitem-rinicial">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-rinicial">
                <input name="rinicial" id="rinicial" value="" placeholder="" maxlength="" size="6" class="validate['required','number'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" /><span class="help-block">Remain Inicial</span>
            </div>
        </div>
        <div class="gcore-subinput-container" id="fitem-rfinal">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-rfinal">
                <input name="rfinal" id="rfinal" value="" placeholder="" maxlength="" size="6" class="validate['required','number'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" /><span class="help-block">Remain Final</span>
            </div>
        </div>
        <div class="gcore-subinput-container" id="fitem-timpresas">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-timpresas">
                <input name="timpresas" id="timpresas" value="" placeholder="" maxlength="" size="6" class="validate['custom:rekenen2'] form-control A" title="" style="" data-inputmask="" data-load-state="disabled" data-tooltip="" type="text" /><span class="help-block">Total Impresas</span>
            </div>
        </div>
        <div class="gcore-subinput-container" id="fitem-vendidas">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-vendidas">
                <input name="vendidas" id="vendidas" value="" placeholder="" maxlength="" size="6" class="validate['required','number'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" /><span class="help-block">Vendidas</span>
            </div>
        </div>
        <div class="gcore-subinput-container" id="fitem-mermas">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-mermas">
                <input name="mermas" id="mermas" value="" placeholder="" maxlength="" size="6" class="validate['required','number'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" /><span class="help-block">Mermas</span>
            </div>
        </div>
        <div class="gcore-subinput-container" id="fitem-cortesias">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-cortesias">
                <input name="cortesias" id="cortesias" value="" placeholder="" maxlength="" size="6" class="validate['required','number'] form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" /><span class="help-block">Cortesias</span>
            </div>
        </div>
        <div class="gcore-subinput-container" id="fitem-subtotal">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-subtotal">
                <input name="subtotal" id="subtotal" value="" placeholder="" maxlength="" size="6" class="validate['custom:rekenen3'] form-control A" title="" style="" data-inputmask="" data-load-state="disabled" data-tooltip="" type="text" /><span class="help-block">Subtotal</span>
            </div>
        </div>
        <div class="gcore-subinput-container" id="fitem-responsable">
            <div class="gcore-input pull-left gcore-sub-input gcore-display-table" id="fin-responsable">
                <input name="responsable" id="responsable" value="" placeholder="" maxlength="" size="30" class="form-control A" title="" style="" data-inputmask="" data-load-state="" data-tooltip="" type="text" /><span class="help-block">Responsable</span>
            </div>
        </div>
    </div>
</fieldset>
<div class="form-group gcore-form-row" id="form-row-button16">
    <div class="gcore-input gcore-display-table" id="fin-button16">
        <input name="button16" id="button16" type="submit" value="Submit" class="form-control A" style="" data-load-state="" />
    </div>
</div>
GreyHead 15 Oct, 2014
Hi Jmac201,

It looks as though you have the subtotal input disabled and disabled inputs do not submit any value when the form is submitted. You can either use a hidden input, or, if you want the subtotal to be visible, use a normal input but set to readonly instead of disabled. To do that put readonly=readonly in the Extra Params box

Bob
Jmac201 15 Oct, 2014
Hi there,

Thanks for your reply I have updated what you mentioned, adding the readonly in the extra params box and enabling the fields. Now as shown in the screenshot attached the form is displaying and calculating exactly as I need it to. The strange behavior that I get now is that it shows a validation error for the calculated fields. I do not have anything set in the validation section of those text fields except in the Custom JS box I am calling the script.

What can be causing this and how can I correct it?

Jeff
Jmac201 15 Oct, 2014
Sorry forgot to attach the screenshot...
GreyHead 15 Oct, 2014
Answer
Hi JMac201,

In the HTML you posted earlier there is a Custom validation on the input validate['custom:rekenen3'] it could be that this is returning the error. I guess the function needs to return a 'true' if the validation is passed?

Bob

PS If you are using that custom validation to trigger the validation it might be better to use a standard event instead.
Jmac201 15 Oct, 2014
Thanks for your help! This validation was not in the right place and should not have been there. I would have never seen that without you pointing me in the right direction. The form works beautifully now!! 😀 😀 😀
This topic is locked and no more replies can be posted.