Forums

javascript in action CF7

matteo4481 06 Apr, 2022
hello,
how to write javascript inside action?
CF6 was custom code

Thankyou
GreyHead 07 Apr, 2022
Hi matteo4481,

Please make sure your form is in Advanced mode in the Settings, then you can add a Custom > Javascript View.

Bob
cappleby 23 Aug, 2022
Hi Bob,

I've tried that using code you gave me for CFv5 which worked beautifully. I've now tried to do the same thing with CFv7 and it doesn't work and it also appears to block event switching. I've tried with and without putting it inside a domready event and with and without the initial php code.
I've placed the javascript element just befrore the submit button.

Can you shed any light on why it doesn't work here?

<?php
JHtml::_('jquery.framework');
?>

var j = jQuery.noConflict();
j(document).ready(function(jQ)
{
jQ('#subs').change(calc);
jQ('#subs1').change(calc);
jQ('#subs2').change(calc);
jQ('#subs3').change(calc);
jQ('#subs4').change(calc);
jQ('#subs5').change(calc);
jQ('#essentials').click(calc);
jQ('#essentials1').click(calc);
jQ('#essentials2').click(calc);
jQ('#branch').change(calc);
jQ('#localbranchdonation').change(calc);
jQ('#total').click(calc);
jQ('#donation').change(calc);
j
function calc()
{
var sum, sum1, sum2, sub, don, ess, br;
br = '';
sub = 0;
ess = 0;
don = 0;
sum = 0;
sub = jQ('input[name=subs]:checked').val();
if(sub === undefined){sub = 0;}
br = jQ('#branch').find(":selected").text();
if((br === 'VICTAS') || (br === 'SA')){sub = 0;}
don = jQ('#Donation').val().replace(/\$/g, '');
if(don === ''){don = 0;}
ess = jQ('input[name=essentials]:checked').val();
if(ess === undefined){ess = 0;}
if((br !== 'VIC/TAS') && (br !== 'SA')){ess = 0;}
don2 = jQ('#localbranchdonation').val().replace(/\$/g, '');
if(don2 === ''){don2 = 0;}
sum1 = parseInt(sub);
sum2 = parseInt(ess);
sum3 = parseInt(don);
sum4 = parseInt(don2);
sum = (sum1 + sum2 + sum3 + sum4);
jQ('#Total').val(sum);
}

});

GreyHead 23 Aug, 2022
Hi cappleby,

I'm sorry but I know very little about CFv7 and how exactly it works. I can only suggest that you use your Browser Developer Tools to look and see if there are any JavaScript errors showing up as they can give a clue about where errors arise.

Bob
cappleby 24 Aug, 2022
No worries Bob,

Your suggestion of the Browser tools was helpful, thank you. The php section was one of the problems. it's no longer necessary it seems.

I've basically got it going except that the click events on the radio buttons doesn't work for some reason. Maybe because CFv7 uses a diffrent wasy of naming the various options of a radio field. the change triggers do work.

For others who may be wanting to do something siilar here is my code (including the click events that don't work!)

var j = jQuery.noConflict();
j(document).ready(function(jQ)
{
jQ("#subs").click(calc());
jQ("#subs1").click(calc);
jQ('#subs2').click(calc);
jQ('#subs3').click(calc);
jQ('#subs4').click(calc);
jQ('#subs5').click(calc);
jQ('#essentials').click(calc());
jQ('#essentials1').click(calc());
jQ('#essentials2').click(calc());
jQ('#donation').change(calc());
jQ('#localbranchdonation').change(calc);
jQ('#total').click(calc);
jQ('#donation').change(calc);

function calc()
{
var sum, sum1, sum2, sub, don, ess, br;
br = '';
sub = 0;
ess = 0;
don = 0;
sum = 0;
sub = jQ('input[name=subs]:checked').val();
if(sub === undefined){sub = 0;}
br = jQ("#branch :selected").text();
if((br === 'VIC/TAS') || (br === 'SA')){sub = 0;}
don = jQ('#donation').val().replace(/\$/g, '');
if(don === ''){don = 0;}
ess = jQ('input[name=essentials]:checked').val();
if(ess === undefined){ess = 0;}
if((br !== 'VIC/TAS') && (br !== 'SA')){ess = 0;}
don2 = jQ('#localbranchdonation').val().replace(/\$/g, '');
if(don2 === ''){don2 = 0;}
sum1 = parseInt(sub);
sum2 = parseInt(ess);
sum3 = parseInt(don);
sum4 = parseInt(don2);
sum = (sum1 + sum2 + sum3 + sum4);
jQ('#total').val(sum);
}

});


Thanks,

Chris A
You need to login to be able to post a reply.