Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Passing radiobutton value to an event tracker

    Need help please...new to JS

    On Form submission, I am trying to pass a variable (var radioValue, which is the RadioButton selection) as Opt Label in the _gaq.push event tracker (google analytics)as follows

    onclick="_gaq.push(['_trackEvent', 'Visitor', 'Submit', radioValue]);"

    However radioValue value is not getting passed

    Code snippets are attached below. Not sure whether the problem is in the JS function or whether i am calling the var incorrectly in the _gaq.push script...Thank you

    The radioValue is captured in the overall form validation function as below.

    Hari
    -------------------------------------------------------------
    (in HTML head)

    /////other overall form functions
    var radio_choice = false;
    for (counter = 0; counter < document.form.RadioGroup.length; counter++)
    {
    if (document.form.RadioGroup[counter].checked == true){
    radio_choice = true;
    radioValue=(document.form.RadioGroup[counter].value);
    }

    }

    if (!radio_choice)
    {
    alert("Please select again.");
    return (false);
    }

    /////other overall form functions

    ------------------------------------------------------------

    RadioButton Input script (in HTML body)

    <input name="RadioGroup" value="abc1" type="radio" />abc1</td><td>&nbsp;</td></tr>
    <input name="RadioGroup" value="abc2" type="radio" />abc1</td><td>&nbsp;</td></tr>
    <input name="RadioGroup" value="abc3" type="radio" />abc1</td><td>&nbsp;</td></tr>

  • #2
    New Coder
    Join Date
    Feb 2008
    Posts
    29
    Thanks
    4
    Thanked 3 Times in 3 Posts
    can you post the rest of your code? it might be a variable scope issue, but i don't know where everything is declared or how the value is getting passed around.
    i tested the above code and 'radioValue' is fine, but i'm not sure the value is available to whatever element you've got that 'onclick' function attached to. would also probably be better if you took the click behavior out from the inline code and scripted the event attachment...
    Last edited by ereignis; 07-13-2011 at 10:38 AM.

  • #3
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post

    ereignis,

    attached is the entire code....the ones in blue font are the relevant snippets for the radio button parts. Have declared var radioValue as global right at the beginning of the overall function.

    the onsubmit _gaq event tracker is a google analytics async tracking function (right at the bottom in the input submit button - inline).

    thanks

    ========================================================


    <title>Submission Form</title>
    <link type="text/css" rel="stylesheet" href="css/styles.css" />
    <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
    <script type="text/javascript">
    // tracking scripts
    </script>
    <style type="text/css"><!--
    .style1 {color: #96730B}
    --></style>
    <script type="text/JavaScript">
    <!--
    function MM_jumpMenu(targ,selObj,restore){ //v3.0
    eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
    if (restore) selObj.selectedIndex=0;
    }

    Code:
    var radioValue;
    function validate_form(){
    var frmValue;
    frmValue="";

    frmValue=(document.frm.Name.value);
    if (!frmValue)
    {
    alert("Please enter your Name");
    frmStep1.Name.focus();
    return(false);
    }

    if (frmValue.length>40)
    {
    alert("Name field shouldnot exceed 40 character");
    frmStep1.Name.focus();
    return(false);
    }

    frmValue=(document.frm.Email.value);
    if (!frmValue)
    {
    alert("Please enter your Email");
    frm.Email.focus();
    return(false);
    }

    if (frmValue.length>40)
    {
    alert("Email field should not exceed 40 character");
    frm.Email.focus();
    return(false);
    }
    var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;

    if(reg.test(frmValue) == false) {
    alert('Invalid Email Address');
    frm.Email.focus();
    return false;
    }


    frmValue ="";
    frmValue=(document.frm.Phone.value);
    if (!frmValue)
    {
    alert("Please enter your Phone");
    frmStep1.Phone.focus();
    return(false);
    }
    if(!checkPhone(frmValue )){
    alert("Please enter a valid Phone number");
    frm.Phone.focus();
    return(false);
    }
    frmValue ="";
    frmValue=(document.frm.Designation.value);
    if (!frmValue)
    {
    alert("Please enter your Designation");
    frm.Designation.focus();
    return(false);
    }
    frmValue ="";
    frmValue=(document.frm.Organisation.value);
    if (!frmValue)
    {
    alert("Please enter your Organisation");
    frm.Organisation.focus();
    return(false);
    }
    if (frmValue.length>40)
    {
    alert("Organisation field shouldnot exceed 40 character");
    frm.Organisation.focus();
    return(false);
    }

    Code:
    var radio_choice = false;
    radioValue ="";
    for (var counter = 0; counter < document.form.RadioGroup.length; counter++)
    {
    if (document.form.RadioGroup[counter].checked == true){
    radio_choice = true;
    radioValue=(document.form.RadioGroup[counter].value);
    }
    
    }
    
    if (!radio_choice)
    {
    alert("Please select again.");
    return (false);
    }
    }

    function checkPhone(str){
    var digitCheck = /^\d+$/;
    if(digitCheck.test(str)){
    return true;
    } else {
    return false;
    }

    }

    //-->
    </script>
    </head>
    <body>

    Code:
    <p class="heading">Submission Form </p><label></label>
    <form method="POST" action="Submission.php" name="frm" onsubmit="return validate_form();">
    
    
    <td valign="middle" align="left"><strong>Select a Test:</strong></td>
    
    <td valign="middle" align="left"><label><input name="RadioGroup" value="abc1" type="radio" />abc1<br />
    </label></td>
    <td>&nbsp;</td></tr>
    <tr>
    <td valign="middle" align="left">&nbsp;</td>
    <td valign="middle" align="left">&nbsp;</td>
    <td>&nbsp;</td></tr>
    <tr>
    <td valign="middle" align="left">&nbsp;</td>
    <td valign="middle" align="left"><label><input name="RadioGroup" value="abc2" type="radio" />abc2</label></td>
    <td>&nbsp;</td></tr>
    <tr>
    <td valign="middle" align="left">&nbsp;</td>
    <td valign="middle" align="left">&nbsp;</td>
    <td>&nbsp;</td></tr>
    
    <tr>
    <td valign="middle" align="left">&nbsp;</td>
    <td valign="middle" align="left"><label><input name="RadioGroup" value="abc3" type="radio" />abc3</label></td>
    <td>&nbsp;</td></tr>
    <tr>
    <td valign="middle" align="left">&nbsp;</td>
    <td valign="middle" align="left">&nbsp;</td>
    <td>&nbsp;</td></tr>
    <tr>
    <td valign="middle" align="left">&nbsp;</td>
    <td valign="middle" align="left"><input name="RadioGroup" value="abc4" type="radio" />abc4</label></td>
    <td>&nbsp;</td></tr>
    <tr>
    <td valign="middle" align="left">&nbsp;</td>
    <td valign="middle" align="left">&nbsp;</td>
    
    <td>&nbsp;</td></tr>
    <tr>
    <td valign="middle" align="left">&nbsp;</td>
    <td valign="middle" align="left"><input name="RadioGroup" value="abc5" type="radio" />abc5</label></td>
    
    <td valign="middle" align="left"><label><input name="Submit" value="Take a Test Now" type="submit" onsubmit="_gaq.push(['_trackEvent', 'Visitor', 'Submit', radioValue]);"/><input name="Submit2" value="Clear" type="reset" /></label></td>
    Last edited by harik; 07-14-2011 at 04:20 PM. Reason: readability

  • #4
    New Coder
    Join Date
    Feb 2008
    Posts
    29
    Thanks
    4
    Thanked 3 Times in 3 Posts
    wow that's a mess.
    first - there is no "onsubmit" handler for a submit button. the form-level onsubmit (the validation script) is immediately called when you click it since the push code is attached to an invalid event.
    depending on the order, you want the button to call the validation routine, and if it passes validation, then push radioValue and the other vars to the google array...

  • #5
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ereignis

    tried using onclick handler at button submission and onsubmit handler at Form definition....still does not work.

    the problem could still be the way i am trying to capture the radoValue and pass it in the event handler....any suggestions there?


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •