SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Guru etidd's Avatar
    Join Date
    May 2011
    Location
    atlanta, ga
    Posts
    625
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    Arrow Script Not Creating Any Sort of Change on Form Submission

    Hello everyone,

    I'm working to complete the form submission script that we were talking about over here. Now that my PHP script seems to somewhat in order, I need to decipher the proper jQuery code to add a success message into a div, with the i.d. of status. If the submission is not valid, the response from the PHP array should return a message inside the <p> element with an i.d. of errormessage.

    What seems to be wrong here?

    Code:
    	  $("#go").focus(function(){
    		if ($("#go").val() == $("#go").prop('defaultValue')){
    			$("#go").val('');
    		}
    	  });
     
    	$("#go").on('focus blur', function(e) {
    	  var v = $(this).val()
    	  if (e.type == "focus"){
    		v = (v == "your e-mail")? "" : v;
    	  } else {
    		v = (v == "")? "your e-mail" : v;
    	  }
    	  $(this).val(v);
    	});
          
          //this is the function called by the success value of the first .ajax() call
          function testFirstResults(response){
            if (response.indexOf("Submission Successful") != -1){
              $('<div>',{ id : 'blackoverlay' }).insertBefore('#submissionform');
              $("#submissionform").css("display", "block");
            } else if (response.indexOf("Invalid E-mail") != -1){
              alert("Invalid mail");
            } else if (response.indexOf("Nothing in Box") != -1){
              //do nothing
            } else {
              //do nothing
            }
          }
    	  
    	  function testSecondResults(response){
    	  	if (response['validation'] == "pass"){
    			$("#submissionform").css("display", "none");
    			$("#status p").html(response['message']);
    			$("#status").css("display", "block");
    		} else if (response['validation'] == "fail"){
    			if (response['message']){
    			}
    		}
    	  }
          
          $(document).ready(function(){
            $("#emailbox").submit(function(e){
              e.preventDefault();
              $.ajax({
                type: $(this).attr('method'),
                dataType: 'html',
                cache: false,
                url: "Scripts/emailtester.php",
                data: $(this).serialize(),
                success: function(data){
                  testFirstResults(data);
                }
              });
            });
    		
    		$("#submissionform").submit(function(e){
    			var origEmail = $('#go').val();
    			var confirmEmail = $("#confirmemail").val();
    			var name = $("#name").val();
    			var age = $("#age").val();
    			var country = $("#country").val();
    			
    			e.preventDefault();
    		
    			$.ajax({
    			  type: "POST",
    			  dataType: 'json',
    			  cache: false,
    			  url: "Scripts/confirmform.php",
    			  data: { origEmail: origEmail,
    			        confirmEmail: confirmEmail,
    					name: name,
    					age: age,
    					country: country },
    			  success: function(data){
    				  testSecondResults(data);
    			  }
    			});
    		});
          });
    confirmform.php
    PHP Code:
    <?php
        $instance 
    = new CheckForm;
        
    $instance -> checkSubmission();
        
        class 
    CheckForm
        
    {
            public function 
    checkSubmission()
            {    
                
    $response = array("validation" => " ""message" => " ");    
                if (
    $_POST['country'] != "Select Country")
                {
                    if (isset(
    $_POST['confirmEmail']) && isset($_POST['name']))
                    {
                        
    $origEmail $_POST['origEmail'];
                        
    $confirmEmail $_POST['confirmEmail'];
                        if (
    $origEmail == $confirmEmail)
                        {
                            
    $name htmlspecialchars($_POST['name']);
                            
    $ageRange $_POST['age'];
                            
    $country $_POST['country'];
                            
                            require_once(
    "categoryfinder.php");
                            
    $categoryFinder = new CategoryFinder;
                            
    $category $categoryFinder -> getCategory();
                            
                            require_once(
    'databasewriter.php');
                            
    $dbWriter = new DatabaseWriter;
                            
    $dbWriter -> writeUserToDatabase($confirmEmail$name$ageRange$country$category);
                            
    $response = array("validation" => "pass""message" => 'Thanks for joining the e-mail list, ' $name ', under the e-mail address, ' $confirmEmail '.');
                        } else {
                            
    $response = array("validation" => "fail""message" => 'E-mail addresses don\'t match.');
                            die();
                        }
                    } else {
                        if (!isset(
    $_POST['confirmemail'])){
                            
    $response = array("validation" => "fail""message" => 'Confirmation e-mail not entered.');
                        } elseif (!isset(
    $_POST['name'])) {    
                            
    $response = array("validation" => "fail""message" => 'Please enter a name.');
                        }
                    }
                } else {
                    
    $response = array("validation" => "fail""message" => 'Please select a country.');
                }
                echo 
    json_encode($response);
            }
        }
    ?>
    form:
    HTML Code:
    <div id="submissionform"> <!-- begin 2nd form markup -->
        <form name="form2" method="post" action="Scripts/confirmform.php">
        <div>
          <label for="confirmemail" class="fixedwidth">Confirm your e-mail:<span>*</span></label>
          <input type="text" name="confirmemail" id="confirmemail" value="" maxlength="60" class="inputwidth"/>
        </div>
        <div>
          <label for="name" class="fixedwidth">Enter your name:<span>*</span></label>
          <input type="text" name="name" id="name" value="" maxlength="60" class="inputwidth"/>
        </div>
        <div>
          <label for="age" class="fixedwidth">Select your age range:</label>
          <select name="age" id="age" class="inputwidth">
             <option selected="selected">18&ndash;35</option>
             <option>36&ndash;55</option>
             <option>55+</option>
             <option>17 or younger</option>
          </select>
        </div>
        <div>
          <label for="country" class="fixedwidth">Select your country:<span>*</span></label>
          <select name="country" id="country" class="inputwidth">
              <option selected="selected">Select Country</option>
              <option>United States</option>
              <option>United Kingdom</option>
              <option>Canada</option>
              <option>Australia</option>
              <option>Russia</option>
              <option>Brazil</option>
              <option>Somewhere else</option>
          </select>
         </div>
         <p id="errormessage">&nbsp;</p>
          <input type="submit" value="Sign Me Up!" class="formsubmitbutton" id="finalsubmit"/>
          <input type="button" value="Cancel" class="formsubmitbutton" onclick="backToHomePage()"/>
        </form>
      </div>
        </div>
    There aren't any errors that I've seen in the console of Firebug right now, but the page just sits there on submission.

    Website: World Review Group

  2. #2
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,183
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    Where is the form on your site as I don't see it anywhere?
    Blog/Portfolio | Evolution Xtreme | DFG Design | DFG Hosting | CSS-Tricks | Stack Overflow | Paul Irish
    Having lame problems with your code? Let us help by using a jsFiddle

  3. #3
    SitePoint Guru etidd's Avatar
    Join Date
    May 2011
    Location
    atlanta, ga
    Posts
    625
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Hi, Chris, from my other PHP thread.

    I don't have my PHP files uploaded to my site, but here is a screenshot of the second form when it pops up on valid submission of the e-mail address on the first form.
    The 2nd submission form is between lines 351-387.

  4. #4
    SitePoint Guru etidd's Avatar
    Join Date
    May 2011
    Location
    atlanta, ga
    Posts
    625
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    Lightbulb

    Well, I just uploaded the index.html file, so you should see the 2nd form markup at lines 351-387.

  5. #5
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,183
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    Is your site setup the same way on your server as it is on your local machine? I ask because on your server /Scripts/confirmform.php doesn't exist.
    Blog/Portfolio | Evolution Xtreme | DFG Design | DFG Hosting | CSS-Tricks | Stack Overflow | Paul Irish
    Having lame problems with your code? Let us help by using a jsFiddle

  6. #6
    SitePoint Guru etidd's Avatar
    Join Date
    May 2011
    Location
    atlanta, ga
    Posts
    625
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Yes, everything is set up identically. I have chosen not to upload my PHP files as I have read that it is bad practice to upload PHP files while in the middle of a project.

  7. #7
    SitePoint Guru etidd's Avatar
    Join Date
    May 2011
    Location
    atlanta, ga
    Posts
    625
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    Question What do you think?

    Should I go ahead and upload all the files that I have?


Tags for this Thread

Bookmarks

Posting Permissions

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