Contact form processor not getting value

I generally use a self submitting form and processor all in one to keep things clean, but the project I'm working on uses an HTML form that POSTS to a separate PHP script that handles the mailing.

The email will go to different users based on the query string in the URL like:

index.php?page=contact&user=User%20One
Will go to to User One's email address

In the form I have a hidden field that grabs the user from the URL

Code:

---

<input type="hidden" name="user" value="User One">

---

In the processing script I have

PHP Code:

---

switch ($_POST['user']) {
case "user%20One":
$owner_email = "user_one@domain.com";
break;

case "user%20Two":
$owner_email = "user_two@domain.com";
break;

default:
$owner_email = "default@domain.com"; 
break;
}
mail($owner_email, $subject, ...rest of mail function... 


---

My issue is getting the specific "user" value to the processing form to be able to email the correct user. Any help would be appreciated, thank you.

If:

Code:

---

<input type="hidden" name="user" value="User One">

---

is on an HTML page, then it's hard coded and will always be "User One".

So unless you make that page a PHP page or use javascript (not recommended) to set that value, I see no way to achieve what you're asking.

If I've misunderstood the question, please be more specific.

My apologies for not clarifying. The form has PHP coding in it, and the input is

PHP Code:

---

<input type="hidden" name="user" value="<? echo "$getuser"; ?>">

---

and

PHP Code:

---

<?php $getuser = $_GET['user']; ?>

---

get's the user from the URL like - User One - User Two etc.

All the other form fields POST to the processing page so figured I could set it up as a hidden field and POST it to the processing page.

It seems to work, but fails when it tries to determine the correct email to associate with the user because my switch statement isn't getting the correct user. Last night I tried passing this through $_SESSION and I didn't have any luck.

I basically need the form to read John Doe in the URL index.php?page=contact&user=John%20Doe and mail that email address or user=Jane%20Doe email Jane etc. Thank you.

But is the form on a page with the .php extension? I thought you said it was HTML.

But, if that's not an issue, even if it is, this is a problem:

Quote:

---

index.php?page=contact&user=User%20One

---

It should be:

index.php?page=contact&user=User+One

Yes, I was thinking the interpretation of the space could be problem too.

Just a small suggestion - ignoring the switch for the time being, can you echo what's being posted onto the page to see how the hidden field and/or the query string is being formatted/interpretted? Once you know that, it might be easier to match it in your php switch code.

@jscheuer1 - Yes, the form does have a .php extension and I used PHP to extract the user variable from the URL to insert it into the hidden field. Using the + certainly does help. To make it easier I can use only first names since there will only be 4 users, but I added the last name so it displays above the contact form without additional coding so the user know who they're contacting.

@Beverleyh - I coded the processing form to redirect to the form if accessed directly, and I tried the echo but it returns the results to the form rather quickly.

FORM (has linked jquery file that does the validation) - JQUERY file validates and redirects to FORM PROCESSOR which returns the mail sent message directly to the form without leaving the contact form page.

A + sign in a query string value means a space, so using it instead of %20 is the only valid way to go. In the value of the hidden input, it should be a literal space though. Like:

Code:

---

<input type="hidden" name="user" value="User One">

---

is correct. When that's submitted it will be:

user=User+One

But if you're submitting via jQuery.ajax(); unless you're serializing the whole form, you probably have to convert spaces in values to + signs before assigning them as part of the data for the request in order to get the correct result.

See:

http://api.jquery.com/serialize/

for info on how serialize works. It will make the conversion of space to + for you.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

After plugging in index.php?page=contact&user=User+One into the address bar I can view the source and "User One" is set as the value like

Code:

---

<input type="hidden" name="user" value="User One">

---

This might be easier than digging through code from a link.

Form

PHP Code:

---

<?php 
session_start(); 
$_SESSION['user'] = (isset($_GET['user']) ? $_GET['user'] : ''); 
$user = $_GET['user'];?>     
            <?php if (isset($user)) { echo "Get In Touch With $user"; } else { echo "Get In Touch"; } ?></h2> 
                <form id="contact-form"> 
                <input type="hidden" name="user" value="<? echo "$user"; ?>"> 
                    <div class="success">Contact form submitted!<br> 
                        <strong>We will be in touch soon.</strong> 
                    </div> 
                    <fieldset> 
                      <label class="name"> 
                        <input type="text" value="Name:"> 
                          <span class="error">*This is not a valid name.</span> <span class="empty">*This field is required.</span> 
                      </label> 
                      <label class="email"> 
                        <input type="text" value="E-mail:"> 
                          <span class="error">*This is not a valid email address.</span> <span class="empty">*This field is required.</span> 
                      </label> 
                      <label class="message"> 
                        <textarea>Message:</textarea> 
                          <span class="error">*The message is too short.</span> <span class="empty">*This field is required.</span> 
                      </label> 
                      <? $a = rand() % 2; $b = rand() % 3; $c = $a + $b; ?> 
                      <label class="security"> 
                        <input type="text" value="<?php echo "Security question: $a + $b =";?>"> 
                          <span class="error">*This is not a valid response.</span> <span class="empty">*This field is required.</span> 
                      </label> 
                      <div class="buttons2"> 
                          <a href="#" data-type="reset" class="button1">Clear</a> 
                          <a href="#" data-type="submit" class="button1">Submit</a> 
                      </div> 
                    </fieldset> 
                </form>

---

Jquery to validate form (where I don't think I would have to define "user" since this only validates the required fields in the form and sends it to the processor.

Code:

---

//forms
;(function($){
        $.fn.forms=function(o){
                return this.each(function(){
                        var th=$(this)
                                ,_=th.data('forms')||{
                                        errorCl:'error',
                                        emptyCl:'empty',
                                        invalidCl:'invalid',
                                        notRequiredCl:'notRequired',
                                        successCl:'success',
                                        successShow:'4000',
                                        mailHandlerURL:'bat/MailHandler.php',
                                        ownerEmail:'#',
                                        stripHTML:true,
                                        smtpMailServer:'localhost',
                                        targets:'input,textarea',
                                        controls:'a[data-type=reset],a[data-type=submit]',
                                        validate:true,
                                        rx:{
                                                ".name":{rx:/^[a-zA-Z'][a-zA-Z-' ]+[a-zA-Z']?$/,target:'input'},
                                                ".state":{rx:/^[a-zA-Z'][a-zA-Z-' ]+[a-zA-Z']?$/,target:'input'},
                                                ".email":{rx:/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i,target:'input'},
                                                ".security":{rx:/^\+?(\b0*[0-5]\b)/,target:'input'},
                                                ".fax":{rx:/^\+?(\d[\d\-\+\(\) ]{5,}\d$)/,target:'input'},
                                                ".message":{rx:/.{20}/,target:'textarea'}
                                        },
                                        preFu:function(){
                                                _.labels.each(function(){
                                                        var label=$(this),
                                                                inp=$(_.targets,this),
                                                                defVal=inp.val(),
                                                                trueVal=(function(){
                                                                                        var tmp=inp.is('input')?(tmp=label.html().match(/value=['"](.+?)['"].+/),!!tmp&&!!tmp[1]&&tmp[1]):inp.html()
                                                                                        return defVal==''?defVal:tmp
                                                                                })()
                                                        trueVal!=defVal
                                                                &&inp.val(defVal=trueVal||defVal)
                                                        label.data({defVal:defVal})                                                               
                                                        inp
                                                                .bind('focus',function(){
                                                                        inp.val()==defVal
                                                                                &&(inp.val(''),_.hideEmptyFu(label),label.removeClas  s(_.invalidCl))
                                                                })
                                                                .bind('blur',function(){
                                                                        _.validateFu(label)
                                                                        if(_.isEmpty(label))
                                                                                inp.val(defVal)
                                                                                ,_.hideErrorFu(label.removeClass(_.invalidCl))                                                                                       
                                                                })
                                                                .bind('keyup',function(){
                                                                        label.hasClass(_.invalidCl)
                                                                                &&_.validateFu(label)
                                                                })
                                                        label.find('.'+_.errorCl+',.'+_.emptyCl).css({disp  lay:'block'}).hide()
                                                })
                                                _.success=$('.'+_.successCl,_.form).hide()
                                        },
                                        isRequired:function(el){                                                       
                                                return !el.hasClass(_.notRequiredCl)
                                        },
                                        isValid:function(el){                                                       
                                                var ret=true
                                                $.each(_.rx,function(k,d){
                                                        if(el.is(k))
                                                                ret=d.rx.test(el.find(d.target).val())                                                                               
                                                })
                                                return ret                                                       
                                        },
                                        isEmpty:function(el){
                                                var tmp
                                                return (tmp=el.find(_.targets).val())==''||tmp==el.data('  defVal')
                                        },
                                        validateFu:function(el){                                                       
                                                el.each(function(){
                                                        var th=$(this)
                                                                ,req=_.isRequired(th)
                                                                ,empty=_.isEmpty(th)
                                                                ,valid=_.isValid(th)                                                               
                                                       
                                                        if(empty&&req)
                                                                _.showEmptyFu(th.addClass(_.invalidCl))
                                                        else
                                                                _.hideEmptyFu(th.removeClass(_.invalidCl))
                                                       
                                                        if(!empty)
                                                                if(valid)
                                                                        _.hideErrorFu(th.removeClass(_.invalidCl))
                                                                else
                                                                        _.showErrorFu(th.addClass(_.invalidCl))                                                               
                                                })
                                        },
                                        getValFromLabel:function(label){
                                                var val=$('input,textarea',label).val()
                                                        ,defVal=label.data('defVal')                                                               
                                                return label.length?val==defVal?'nope':val:'nope'
                                        }
                                        ,submitFu:function(){
                                                _.validateFu(_.labels)                                                       
                                                if(!_.form.has('.'+_.invalidCl).length)
                                                        $.ajax({
                                                                type: "POST",
                                                                url:_.mailHandlerURL,
                                                                data:{
                                                                        name:_.getValFromLabel($('.name',_.form)),
                                                                        email:_.getValFromLabel($('.email',_.form)),
                                                                        //phone:_.getValFromLabel($('.phone',_.form)),
                                                                        fax:_.getValFromLabel($('.fax',_.form)),
                                                                        state:_.getValFromLabel($('.state',_.form)),
                                                                        message:_.getValFromLabel($('.message',_.form)),
                                                                        owner_email:_.ownerEmail,
                                                                        stripHTML:_.stripHTML
                                                                },
                                                                success: function(){
                                                                        _.showFu()
                                                                }
                                                        })                       
                                        },
                                        showFu:function(){
                                                _.success.slideDown(function(){
                                                        setTimeout(function(){
                                                                _.success.slideUp()
                                                                _.form.trigger('reset')
                                                        },_.successShow)
                                                })
                                        },
                                        controlsFu:function(){
                                                $(_.controls,_.form).each(function(){
                                                        var th=$(this)
                                                        th
                                                                .bind('click',function(){
                                                                        _.form.trigger(th.data('type'))
                                                                        return false
                                                                })
                                                })
                                        },
                                        showErrorFu:function(label){
                                                label.find('.'+_.errorCl).slideDown()
                                        },
                                        hideErrorFu:function(label){
                                                label.find('.'+_.errorCl).slideUp()
                                        },
                                        showEmptyFu:function(label){
                                                label.find('.'+_.emptyCl).slideDown()
                                                _.hideErrorFu(label)
                                        },
                                        hideEmptyFu:function(label){
                                                label.find('.'+_.emptyCl).slideUp()
                                        },
                                        init:function(){
                                                _.form=_.me                                               
                                                _.labels=$('label',_.form)

                                                _.preFu()
                                               
                                                _.controlsFu()
                                                                                                               
                                                _.form
                                                        .bind('submit',function(){
                                                                if(_.validate)
                                                                        _.submitFu()
                                                                else
                                                                        _.form[0].submit()
                                                                return false
                                                        })
                                                        .bind('reset',function(){
                                                                _.labels.removeClass(_.invalidCl)                                                                       
                                                                _.labels.each(function(){
                                                                        var th=$(this)
                                                                        _.hideErrorFu(th)
                                                                        _.hideEmptyFu(th)
                                                                })
                                                        })
                                                _.form.trigger('reset')
                                        }
                                }
                        _.me||_.init(_.me=th.data({forms:_}))
                        typeof o=='object'
                                &&$.extend(_,o)
                })
        }
})(jQuery)
$(window).load(function(){
        $('#contact-form').forms({
                ownerEmail:'#'
        })
})

---

MailHandler.php (this is where I'm only getting the mail to the default email address)

PHP Code:

---

<?php session_start(); 
echo $_SESSION['user']; echo "$user"; 

    // redirect back to contact form if accessed directly 
    if ($_SERVER['REQUEST_METHOD'] != 'POST'){  
    header("Location: /index.php?page=contact"); 
    die;  
    } 
    $headers = "From: ". $_POST["name"] . " <" . $_POST["email"] . ">"; 
    $subject = 'A message from your site visitor ' . $_POST["name"]; 
    $messageBody = ""; 

    if($_POST['name']!='nope'){ 
        $messageBody .= '<p>Visitor: ' . $_POST["name"] . '</p>' . "\n"; 
        $messageBody .= '<br>' . "\n"; 
    } 
    if($_POST['email']!='nope'){ 
        $messageBody .= '<p>Email Address: ' . $_POST['email'] . '</p>' . "\n"; 
        $messageBody .= '<br>' . "\n"; 
    }else{ 
        $headers = ''; 
    } 
    if($_POST['state']!='nope'){         
        $messageBody .= '<p>State: ' . $_POST['state'] . '</p>' . "\n"; 
        $messageBody .= '<br>' . "\n"; 
    } 
    if($_POST['fax']!='nope'){         
        $messageBody .= '<p>Fax Number: ' . $_POST['fax'] . '</p>' . "\n"; 
        $messageBody .= '<br>' . "\n"; 
    } 
    if($_POST['message']!='nope'){ 
        $messageBody .= '<p>Message: ' . $_POST['message'] . '</p>' . "\n"; 
    } 

    if($_POST["stripHTML"] == 'true'){ 
        $messageBody = strip_tags($messageBody); 
    } 

switch ($_SESSION['user']) { 
case "User+One": 
$owner_email = "user_one@domain.com"; 
break; 

case "User+Two": 
$owner_email = "user_two@domain.com"; 
break; 

default: 
$owner_email = "default@domain.com"; //... this can be info@ or whatever general email address 
break; 
} 
##################################################  ############################## 
    try{ 
        if(!mail($owner_email, $subject, $messageBody, $headers)){ 
            throw new Exception('mail failed'); 
        }else{ 
            echo 'mail sent'; 
        } 
    }catch(Exception $e){ 
        echo $e->getMessage() ."\n"; 
    } 
?>

---

Unless you setup the form like a normal form, with names for each of the fields that reflect POST data you want from them, you cannot serialize. I would recommend rethinking the form so that it could do that. But working from what you do have:

Code:

---

$.ajax({
        type: "POST",
        url:_.mailHandlerURL,
        data:{
                name:_.getValFromLabel($('.name',_.form)),
                email:_.getValFromLabel($('.email',_.form)),
                //phone:_.getValFromLabel($('.phone',_.form)),
                fax:_.getValFromLabel($('.fax',_.form)),
                state:_.getValFromLabel($('.state',_.form)),
                message:_.getValFromLabel($('.message',_.form)),
                owner_email:_.ownerEmail,
                stripHTML:_.stripHTML
        },
        success: function(){
                _.showFu()
        }
})

---

You can add the user field so it will be the same as it would be submitting normally (I also added cache: false, to prevent the MailHandler from getting cached):

Code:

---

$.ajax({
        type: "POST",
        url:_.mailHandlerURL,
        cache: false,
        data:{
                name:_.getValFromLabel($('.name',_.form)),
                email:_.getValFromLabel($('.email',_.form)),
                //phone:_.getValFromLabel($('.phone',_.form)),
                fax:_.getValFromLabel($('.fax',_.form)),
                state:_.getValFromLabel($('.state',_.form)),
                message:_.getValFromLabel($('.message',_.form)),
                user:$('[name="user"]',_.form).val(),
                owner_email:_.ownerEmail,
                stripHTML:_.stripHTML
        },
        success: function(){
                _.showFu()
        }
})

---

OK, once we add user to the data to send via $.ajax() POST, we no longer need to set or get $_SESSION['user'] anywhere, rather we are able to retrieve $_POST['user'] in the normal way, here:

PHP Code:

---

switch ($_SESSION['user']) { 
case "User+One": 
$owner_email = "user_one@domain.com"; 
break; 

case "User+Two": 
$owner_email = "user_two@domain.com"; 
break; 

default: 
$owner_email = "default@domain.com"; //... this can be info@ or whatever general email address 
break; 
} 


---

Like so:

PHP Code:

---

$user = isset($_POST['user'])? $_POST['user'] : '';
switch ($user) { 
case "User One": 
$owner_email = "user_one@domain.com"; 
break; 

case "User Two": 
$owner_email = "user_two@domain.com"; 
break; 

default: 
$owner_email = "default@domain.com"; //... this can be info@ or whatever general email address 
break; 
} 
echo $owner_email; //this line for diagnostics, should be removed for production 


---

The browser cache may need to be cleared and/or the page refreshed to see changes.

Demo: Attachment 5175

Notes:

As I don't believe you specified which jQuery version you are using, I picked 1.8.3 - results may vary with other versions. Probably not with most other recent versions at least.

In the demo (user.zip) and above code I've added diagnostics, such that the mail to address ($owner_email) will appear in the browser console if it has a console. Any PHP error message from the MailHandler.php will appear there as well:

Code:

---

$.ajax({
        type: "POST",
        url:_.mailHandlerURL,
        cache: false,
        data:{
                name:_.getValFromLabel($('.name',_.form)),
                email:_.getValFromLabel($('.email',_.form)),
                //phone:_.getValFromLabel($('.phone',_.form)),
                fax:_.getValFromLabel($('.fax',_.form)),
                state:_.getValFromLabel($('.state',_.form)),
                message:_.getValFromLabel($('.message',_.form)),
                user:$('[name="user"]',_.form).val(),
                owner_email:_.ownerEmail,
                stripHTML:_.stripHTML
        },
        success: function(data){
                window.console && console.log(data); //this line for diagnostics, should be removed in production
                _.showFu();
        }
});

---

You can remove or comment out the window.console && console.log(data); line to prevent diagnostics appearing for visitors in their browser's consoles once everything is working to your satisfaction.

On index.php (the form in your post) I replaced:

PHP Code:

---

<?php  
session_start();  
$_SESSION['user'] = (isset($_GET['user']) ? $_GET['user'] : '');  
$user = $_GET['user'];?>      
            <?php if (isset($user)) { echo "Get In Touch With $user"; } else { echo "Get In Touch"; } ?></h2>  
                <form id="contact-form">  
                <input type="hidden" name="user" value="<? echo "$user"; ?>">  
                    <div class="success">Contact form submitted!<br>  
                        <strong>We will be in touch soon.</strong>  
                    </div>

---

with:

PHP Code:

---

<?php  
$user = isset($_GET['user'])? $_GET['user'] : null;?>      
            <h2>Get In Touch<?php echo $user? " With $user" : "";?></h2>  
                <form id="contact-form">  
                <input type="hidden" name="user" value="<?php echo "$user"; ?>">  
                    <div class="success">Contact form submitted<?php echo $user? " to $user" : "";?>!<br>  
                        <strong>We will be in touch soon.</strong>  
                    </div>

---

On MailHandler.php, I got rid of:

PHP Code:

---

session_start(); 
echo $_SESSION['user']; echo "$user"; 


---

and made the not POST path back to index.php relative so it could work in a sub folder:

Code:

---

    // redirect back to contact form if accessed directly
    if ($_SERVER['REQUEST_METHOD'] != 'POST'){ 
    header("Location: ../index.php?page=contact");
    die; 
    }

---

That will work fine even if the index file is in the root, as long as the MailHandler.php file is where indicated in the javascript code (bat/MailHandler). But you can change it back (remove the two red dots) if you like.

There are three typos in the javascript as pasted into your post (these may or may not be in the script you're actually using):

Code:

---

&&(inp.val(''),_.hideEmptyFu(label),label.removeClas  s(_.invalidCl))

---

and:

Code:

---

label.find('.'+_.errorCl+',.'+_.emptyCl).css({disp  lay:'block'}).hide()

---

and:

Code:

---

return (tmp=el.find(_.targets).val())==''||tmp==el.data('  defVal')

---

In all three cases the gaps should be removed (and I did so in my demo attached above):

Code:

---

&&(inp.val(''),_.hideEmptyFu(label),label.removeClass(_.invalidCl))

---

and:

Code:

---

label.find('.'+_.errorCl+',.'+_.emptyCl).css({display:'block'}).hide()

---

and:

Code:

---

return (tmp=el.find(_.targets).val())==''||tmp==el.data('defVal')

---

Again:

The browser cache may need to be cleared and/or the page refreshed to see changes.

Goign back to your original post...

Quote:

---

Originally Posted by ?foru

The email will go to different users based on the query string in the URL like:

index.php?page=contact&user=User%20One

---

Quote:

---

Originally Posted by ?foru

Code:

---

<input type="hidden" name="user" value="User One">

---

PHP Code:

---

switch ($_POST['user']) {
case "user%20One":
$owner_email = "user_one@domain.com";
break; 


---

---

These are not the same thing. $_POST will contain the values from the form field if the POST method was used to submit the form. $_GET will contain those values if the GET method was used.

In either case, PHP url-decodes the values before you run your script: You should simply match against user One (etc.).

Unless I'm missing something.

I think we're way beyond that now. We abandoned that %20 part early on for instance. For another, jQuery ajax() is being used to submit the form. Please see my previous post in this thread for a working solution, fully tested.

Thank you very much for your help jscheuer1! I was almost there with the concept of the code on the form and handler, but I knew I wasn't making the link in the ajax.

It isn't a big deal, but do you or anyone else have a suggestion on how I can exactly match the security code? This is generated by the following...

PHP Code:

---

<? $a = rand() % 2; $b = rand() % 3; $c = $a + $b; ?> 
<label class="security"> 
<input type="text" value="<?php echo "Security question: $a + $b =";?>">

---

I setup a basic validation for that field that didn't allow letters and ranged from 0 to 5

Code:

---

".security":{rx:/^\+?(\b0*[0-5]\b)/,target:'input'},

---

to force some type of human interaction, but it would be better if it didn't validate if you entered in the incorrect response.

From the research I've done on regex, I believe it's going to have to be something in the ajax code to check this rather than in the validation section. Thank you.

In the form (addition highlighted):

Code:

---

                      <?php $a = rand() % 2; $b = rand() % 3; $c = $a + $b; ?> 
                      <input type="hidden" name="security" value="<?php echo "$c"; ?>">
                      <label class="security"> 
                        <input type="text" value="<?php echo "Security question: $a + $b =";?>"> 
                          <span class="error">*This is not a valid response.</span> <span class="empty">*This field is required.</span> 
                      </label>

---

In the script, change highlighted:

Code:

---

                                        rx:{
                                                ".name":{rx:/^[a-zA-Z'][a-zA-Z-' ]+[a-zA-Z']?$/,target:'input'},
                                                ".state":{rx:/^[a-zA-Z'][a-zA-Z-' ]+[a-zA-Z']?$/,target:'input'},
                                                ".email":{rx:/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i,target:'input'},
                                                ".security":{rx:new RegExp('^' + $('[name="security"]',th).val() + '$'),target:'input'},
                                                ".fax":{rx:/^\+?(\d[\d\-\+\(\) ]{5,}\d$)/,target:'input'},
                                                ".message":{rx:/.{20}/,target:'textarea'}
                                        },

---

This will require the response to be the correct response and only the correct response.

I think it would be nice, if the incorrect response is given, that the original content (in this case the math problem) should be shown again on focus or even right away. But I'm not sure how to do either of those . . . yet.

OK, I figured that one out. You cannot show the original content (the security question) on focus because the field needs to empty for input, but you can show it on error. But that got complicated because then you have to blur it or it empties out anyway, which leads to other things happening, unless you change the blur function slightly for cases where you don't want those other to happen.

Anyways, by doing all that and adding an optional reset class for fields that you want to do this (only the security one seems to need it now) I got that to happen. I also changed the hidden filed to obfuscate the answer if someone or a bot used view source to try to outwit the check, converting it to an ASCII character and then back to the number in the validation RegExp.

I also added a check in MailHandler:

Code:

---

    if ($_SERVER['REQUEST_METHOD'] != 'POST' || isset($_SERVER['REFERER'])){ 
    header("Location: ../index.php?page=contact");
    die; 
    }

---

Because, if a hacker were to make a form and POST it to MailHandler, they could stuff your mailboxes with spam. But that form would have a referer, so would be redirected to the real form, which requires human interaction. The jQuery ajax() submission has no referer and a hacker cannot cross site submit via AJAX. They could set their page not to have one, but it's an extra step and they would have to guess that was the problem, they cannot see your PHP code.

I added a callback for when the security question answer is wrong, to show the wrong answer so that slow humans will have a better chance the second time. I doubt this would be of any use to a bot. In fact, since most bots are not javascript enabled, they might not even see the form, as I've set it to display: none; and added code to the user.js to make it display (a better strategy for that purpose - hiding from bots, would be to have javascript make the form). The main reason for how I'm doing it now though is for real people without javascript, so they won't see the form, which is useless without javascript, and be shown instead:

Quote:

---

Get In Touch With User One

(requires javascript enabled)

---

Here's the new demo:

Attachment 5180

The hidden value "security" in the form and

Code:

---

".security":{rx:new RegExp('^' + $('[name="security"]',th).val() + '$'),target:'input'},

---

worked great to only accept the correct answer as you mentioned, thank you!

After you mentioned displaying the question again I started thinking of all different types of scenarios but didn't know if one was possible for the reasons you mentioned in your last post (tricky situation). I'll definitely check out the last zip file you included with the latest round of modifications, because it sounds like you've covered all bases regarding bots and all! I was also thinking that after form submission I might add a meta refresh to redirect away from the form because several testing it said that they didn't see the success message and continued to hit submit which led to multiple emails being sent. I read about some ajax calls not working properly in windows 8, but these were windows 7 machines so my guess is that they scrolled down and didn't see the message. This form alone has helped me learn, and I appreciate all your help.

The problem with multiple submissions isn't due to the person not seeing (missing) the success message. It's that they haven't seen it yet and/or that even when the submission is successful, the form doesn't reset until after the success message is hidden. We can disable the submission process until the AJAX call completes and the success message begins to slide up, at which point the form resets, so hitting submit again then would only result in each field displaying its '*This field is required.' message.

To do that, add the highlighted to my latest index.php:

Code:

---

<style type="text/css">
#contact-form fieldset {
        width: 250px;
}
.error span {
        color: red;
}
#contact-form fieldset label input, #contact-form fieldset label textarea {
        margin: 2px;
        padding: 1px 0;
}
.security input {
        width: 12em;
}
.button1.disabled {
        color: gray;
        opacity: 0.5;
}
</style>
<!--[if lt IE 9]>
<style type="text/css">
.button1.disabled {
        filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
        display: inline-block;
        zoom: 1;
}
</style>
<![endif]-->
</head>

---

And use this updated version of the script:

Attachment 5181

Viola! No need to redirect the page.

It's true though that sometimes the AJAX call will fail. So we should probably add an error function to it to display a message like:

Quote:

---

Submission Failed! Please try again later.

---

When I get more time I will whip that up. I seriously doubt that Windows 8 will not do AJAX, though it's certainly possible, or that it might need a different syntax and/or later version of jQuery. I don't have Windows 8 to test on, so I would want more information on that. Where did you see/hear about this idea?

I found some were having issues with ajax Get in IE10, and there were mentions of Windows 8 but it seemed to be regarding specific calls and not ajax itself.