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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jun 2011
    Location
    Texas
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post Form loading on new page byt itself when submitted

    Hello,
    I apologize if this post in is the wrong place. I am a new member and need help with a php form. I am having trouble with a form that I have inside an iframe. Every time you click on the submit button without entering the captcha the forms loads with the error message telling you that you have entered the wrong code, BUT by itself on a blank page. This is because I have added the _parent target attribute to the form tag. so that when you actually enter all the required fields including the correct code for the captcha it loads a thank you page message at the top of the page. You can find the page here if you wish to try it.

    Below is the php form being loaded inside the iframe. I might get away with loading the thank you page inside the page by having the iframe resize its hieght to the contents of the thank you message after the form submission.

    Your help is greatly appreciated!!!

    PHP Code:
    <?PHP
    /*
        Contact Form from HTML Form Guide
        This program is free software published under the
        terms of the GNU Lesser General Public License.
        See this page for more info:
        http://www.html-form-guide.com/contact-form/creating-a-contact-form.html
    */
    require_once("./include/fgcontactform.php");
    require_once(
    "./include/captcha-creator.php");

    $formproc = new FGContactForm();
    $captcha = new FGCaptchaCreator('scaptcha');

    $formproc->EnableCaptcha($captcha);

    //1. Add your email address here.
    //You can add more than one receipients.
    $formproc->AddRecipient('mail@vectoriousmedia.com'); //<<---Put your email address here


    //2. For better security. Get a random tring from this link: http://tinyurl.com/randstr
    // and put it here
    $formproc->SetFormRandomKey('CnRrspl1FyEylUj');


    if(isset(
    $_POST['submitted']))
    {
       if(
    $formproc->ProcessForm())
       {
            
    $formproc->RedirectToURL("thank-you.html");
       }
    }

    ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
    <head>
          <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
          <title>Contact us</title>
          <link rel="STYLESHEET" type="text/css" href="contact.css" />
          <script type='text/javascript' src='scripts/gen_validatorv31.js'></script>
          <script type='text/javascript' src='scripts/fg_captcha_validator.js'></script>
          
          
          <script language="javascript">
    var win = null;
    function NewWindow(mypage,myname,w,h,scroll){
    LeftPosition = (screen.width) ? (screen.width-w)/2 : 0;
    TopPosition = (screen.height) ? (screen.height-h)/2 : 0;
    settings =
    'height='+h+',width='+w+',top='+TopPosition+',left='+LeftPosition+',scrollbars='+scroll+',resizable'
    win = window.open(mypage,myname,settings)
    }

    </script>
          
    <link href="styles.css" media="screen" rel="stylesheet" type="text/css" />

    <!--[if lte IE 7]>
    <link rel="stylesheet" type="text/css" href="styles_ie.css" />
    <![endif]--> 
     
     
    <script type="text/javascript" language="javascript" src="js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" language="javascript" src="js/jquery.tools.min.js"></script>

     

    <script type="text/javascript" language="javascript" src="js/general.js"></script>

    <link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.8.4.custom.css" />
    <link rel="stylesheet" type="text/css" href="css/ui.selectmenu.css" />
    <script type="text/javascript" language="javascript" src="js/jquery-ui-1.8.4.custom.min.js"></script>
    <script type="text/javascript" language="javascript" src="js/ui.selectmenu.js"></script>
    <script type="text/javascript" language="javascript" src="js/styled.selectmenu.js"></script>
    <script type="text/javascript" src="js/custom.js"></script>
        
        
        
    </head>
    <body style="background:none;">

    <!-- Form Code Start -->

                            <div class="contact-form"  style="background:none;">
      
    <form id='contactus'  action='<?php echo $formproc->GetSelfScript(); ?>' method='post' accept-charset='UTF-8' enctype="multipart/form-data" target="_parent">
    <fieldset >
    <h2>Please fill out the form below.</h2>
    <input type='hidden' name='Tent-Cards-4X6' value='Tent-Cards-4X6'/>
    <input type='hidden' name='submitted' id='submitted' value='1'/>
    <input type='hidden' name='<?php echo $formproc->GetFormIDInputName(); ?>' value='<?php echo $formproc->GetFormIDInputValue(); ?>' size="40"/>
    <input type='text'  class='spmhidip' name='<?php echo $formproc->GetSpamTrapInputName(); ?>' />

    <div class='short_explanation'><span style="font-size:12px;">*</span> required fields</div>


    <div class="row field_text alignleft">
        <label for='name' >Your Full Name*: </label>
        <input type='text' class="inputtext input_middle" name='name' id='name' value='<?php echo $formproc->SafeDisplay('name'?>' size="40" /> <br>
        <span id='contactus_name_errorloc' class='error'></span>
    </div>

    <div class="row field_text alignleft">
        <label for='email' >Email Address*:</label>
        <input type='text' class="inputtext input_middle" name='email' id='email' value='<?php echo $formproc->SafeDisplay('email'?>' size="40" /> <br>
        <span id='contactus_email_errorloc' class='error'></span>
    </div>
    <div class="clear"></div>
    <div class="row field_text alignleft" style="margin-left: 0px">
        <label for='phone'>Phone Number:</label>
        <input type='text' class="inputtext input_middle"  name='phone' id='phone' value='<?php echo $formproc->SafeDisplay('phone'?>'   /> <br>
        <span id='contactus_phone_errorloc' class='error'></span>
    </div>
                                 
    <div class="row field_select alignleft">
    <label>Select Quantity:</label>
    <select class="select_styled" name="Table-Tent-Quantity" id="contact_select_1" onchange="document.getElementById('uploadJobForm').action.value='RELOAD';document.getElementById('uploadJobForm').reloadTrigger.value='trigQty';document.getElementById('uploadJobForm').submit();">
    <option value="OPTION_CHOOSE" selected="selected">Select</option>
                            
    <option value="QTY- 100">QTY- 100</option>
    <option value="QTY- 250">QTY- 250</option>
    <option value="QTY- 500">QTY- 500</option>
    <option value="QTY- 1,000">QTY- 1,000</option>
    <option value="QTY- 2,500">QTY- 2,500</option>
    <option value="QTY- 5,000">QTY- 5,000</option>
    <option value="QTY- 10,000">QTY- 10,000</option>
    <option value="QTY- 20,000">QTY- 20,000</option>
    <option value="QTY- 30,000">QTY- 30,000</option>
    </select>
    </div>
    <div class="clear"></div>


    <div class="row field_textarea">
        <label>Please provide the information for side 1.</label>
        <span id='contactus_message_errorloc' class='error'></span>
        <textarea rows="4" class="textarea textarea_middle required" cols="80" name='Side-1'><?php echo $formproc->SafeDisplay('message'?></textarea>
    </div>

    <div class="clear"></div>
    <div class="row field_textarea">
        <span class="row field_textarea">
            <label>Please provide the information for side 2.</label>
    <textarea rows="5" class="textarea textarea_middle required" cols="50" name='Side-2' ><?php echo $formproc->SafeDisplay('message'?></textarea>
    </span>
        <span id='contactus_message_errorloc' class='error'></span></div>

    <div class="clear"></div>
    <div class="row field_textarea">
        <label>Please provide your shipping address <br /><span style=" font-size:11px;"> ** Please note that we don't ship to P.O. boxes!</span></label>
        <span id='contactus_message_errorloc' class='error'></span>
        <textarea rows="3" class="textarea textarea_middle required" cols="30" name='Shipping-Address' style="width:250px;"><?php echo $formproc->SafeDisplay('message'?></textarea>
    </div>
    <div class="row field_textarea">
    <img src="images/Lightbrown-Photos-icon.png" alt=""  style="padding-right:20px;" align="left" />
    <label><span style="line-height:12px;">Got a photo or file you would like us to use in your design? No problem.   Send it to us!</span><br />
      <span style="font-size:10px; ">*** Please remember to zip multiple files and save the folder as your company name.</span><br />
      <a href="https://www.wetransfer.com/" onclick="NewWindow(this.href,'name','520','600','yes');return false">
      <img src="images/send_file-button.jpg" alt="Send-File" /></a>
    <br /></label>
    </div>
    <div class="clear"></div>
    <div class="row field_text alignleft">
     <img alt='Captcha image' src='show-captcha.php?rand=1' id='scaptcha_img' />
     <a href='javascript: refresh_captcha_img();'><img src="images/button-refresh-captcha.jpg" alt="" width="35" height="40" hspace="10" /></a> 

        </div>
        
        <div class="row field_text alignleft" >
        
        <input type='text' name='scaptcha' id='scaptcha' maxlength="25" style="height:20px;" /> 
        <span id='contactus_scaptcha_errorloc' class='error'></span>

       </div>
       <div class="clear"></div>
          <div class='short_explanation'>For spam security purposes please enter the code in the box. Can't read the image? Click the refresh button.
         </div>

    <div class="clear"></div>
    <div><span class='error'><?php echo $formproc->GetErrorMessage(); ?></span></div>
    <div class="row field_submit">
        <input type='submit' name='Submit' value='Place Order' class="contact-submit" /><input type="reset" name="reset" value="Reset Form" class="contact-submit" style="margin-left: 50px;">
    </div>

    </fieldset>
    </form>
    </div>












    <!-- client-side Form Validations:
    Uses the excellent form validation script from JavaScript-coder.com-->

    <script type='text/javascript'>
    // <![CDATA[

        var frmvalidator  = new Validator("contactus");
        frmvalidator.EnableOnPageErrorDisplay();
        frmvalidator.EnableMsgsTogether();
        frmvalidator.addValidation("name","req","Please provide your name");

        frmvalidator.addValidation("email","req","Please provide your email address");

        frmvalidator.addValidation("email","email","Please provide a valid email address");

        frmvalidator.addValidation("message","maxlen=2048","The message is too long!(more than 2KB!)");


        frmvalidator.addValidation("scaptcha","req","Please enter the code in the image!");

        document.forms['contactus'].scaptcha.validator
          = new FG_CaptchaValidator(document.forms['contactus'].scaptcha,
                        document.images['scaptcha_img']);

        function SCaptcha_Validate()
        {
            return document.forms['contactus'].scaptcha.validator.validate();
        }

        frmvalidator.setAddnlValidationFunction("SCaptcha_Validate");

        function refresh_captcha_img()
        {
            var img = document.images['scaptcha_img'];
            img.src = img.src.substring(0,img.src.lastIndexOf("?")) + "?rand="+Math.random()*1000;
        }

    // ]]>
    </script>
    <div id='fg_crdiv'><p><a href='http://www.html-form-guide.com/contact-form/creating-a-contact-form.html'
    >making a contact form</a></p></div>
    <!--
    Form Code End
    Visit html-form-guide.com for more info.
    -->


    </body>
    </html>
    Last edited by jorge_giovanni; 06-08-2011 at 10:26 PM.

  • #2
    Regular Coder
    Join Date
    Jul 2003
    Posts
    117
    Thanks
    0
    Thanked 17 Times in 17 Posts
    One way is to validate the captcha through ajax.
    Or
    you can just remove the target _parent and then in the response page (after successful submission) , refresh the parent

  • #3
    New to the CF scene
    Join Date
    Jun 2011
    Location
    Texas
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm not sure where to place the code below and in which page? =(

    PHP Code:
    RefreshParent(){
        
    parent.location.reload();
    }

    <
    body onload="RefreshParent();"

    This seems like the easier way to go if it works. By the way I changed the folder name where the site is located to a shorter name. HERE
    Last edited by jorge_giovanni; 06-09-2011 at 04:17 PM.


  •  

    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
    •