Page 1 of 1

Form help

Posted: Wed Mar 14, 2012 1:02 am
by Bernster
Probably getting boring, but I'm developing a site for a friend (http://www.ututor.com.au)
I am using a PHP file (MailHandler) and a forms.JS and HTML
I am TRYING to get the select drop down menu to work, but no luck.
Basically, I want it to accept a choice of day of week and preferred time for students to book a session

HTML is:

<form id="contact-form">
<fieldset>
<div class="wrapper">
<div class="success"> Contact form submitted! <br>
<strong class="color-4">We will be in touch soon.</strong> </div>
</div>
<div class="field">
<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>
</div>
<div class="field">
<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>
</div>
<div class="field">
<label class="phone">
<input type="text" value="Phone:">
<span class="error">*This is not a valid phone number.</span> <span class="empty">*This field is required.</span> </label>
</div>
<div class="field">
<label class="subject">
<input type="text" value="Subject of study:">
<span class="error">*This is not a valid subject.</span> <span class="empty">*This field is required.</span> </label>
</div>
<div class="field">
<p>Preferred Tutoring Day</p>
<select name="days" size="1">
<option value="Option1">Monday</option>
<option value="Option2">Tuesday</option>
<option value="Option3">Wednesday</option>
<option value="Option4">Thursday</option>
<option value="Option5">Friday</option>
<option value="Option6">Saturday</option>
<option value="Option7">Sunday</option>
</select>
</div>
<div class="area">
<label class="message">
<p class="comments1">Please provide a detailed description of course topics and questions that you would like some help with. The more specific you are, the better your assigned tutor is able to prepare for your session.</p>
<textarea>Message must be a minimum of 20 characters:</textarea>
<span class="error">*The message is too short. Must be a minimum of 20 characters.</span> <span class="empty">*This field is required.</span>
</label>

PHP:

<?php
$owner_email = $_POST["owner_email"];
$headers = 'From:' . $_POST["email"];
$subject = 'A message from your site visitor ' . $_POST["name"];
$days = $POST['days'];
$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";
}
if($_POST['state']!='nope'){
$messageBody .= '<p>State: ' . $_POST['state'] . '</p>' . "\n";
$messageBody .= '<br>' . "\n";
}
if($_POST['phone']!='nope'){
$messageBody .= '<p>Phone Number: ' . $_POST['phone'] . '</p>' . "\n";
$messageBody .= '<br>' . "\n";
}
if($_POST['subject']!='nope'){
$messageBody .= '<p>Subject of study: ' . $_POST["subject"] . '</p>' . "\n";
$messageBody .= '<br>' . "\n";
}
if($_POST['days']!='nope'){
$messageBody .= '<p>Preferred day: ' . $_POST["days"] . '</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);
}

try{
if(!mail($owner_email, $subject, $messageBody, $headers)){
throw new Exception('mail failed');
}else{
echo 'mail sent';
}
}catch(Exception $e){
echo $e->getMessage() ."\n";
}
?>

JS


(function($){
$.fn.extend({
forms:function(opt){
if(opt===undefined)
opt={}
this.each(function(){
var th=$(this),
data=th.data('forms'),
_={
errorCl:'error',
emptyCl:'empty',
invalidCl:'invalid',
successCl:'success',
successShow:'4000',
mailHandlerURL:'bin/MailHandler.php',
ownerEmail:'admin@ututor.com.au',
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'},
".phone":{rx:/^\+?(\d[\d\-\+\(\) ]{5,}\d$)/,target:'input'},
".subject":{rx:/^[a-zA-Z'][a-zA-Z-' ]+[a-zA-Z']?$/,target:'input'},
".days":{rx:/^[a-zA-Z'][a-zA-Z-' ]+[a-zA-Z']?$/,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.removeClass(_.invalidCl))
})
.bind('blur',function(){
!inp.val()
?inp.val(defVal)
:(_.isValid(label)
?_.showErrorFu(label)
:_.hideErrorFu(label)),
(_.isEmpty(label)
?_.showEmptyFu(label)
:_.hideEmptyFu(label))
})
.bind('keyup',function(){
label.hasClass(_.invalidCl)
&&_.isValid(label)
?_.showErrorFu(label)
:_.hideErrorFu(label)
})
label.find('.'+_.errorCl+',.'+_.emptyCl).css({display:'block'}).hide()
})
_.success=$('.'+_.successCl,_.form).hide()
},
isValid:function(el){
var ret=true,
empt=_.isEmpty(el)
if(empt)
ret=false,
el.addClass(_.invalidCl)
else
$.each(_.rx,function(k,d){
if(el.is(k))
d.rx.test(el.find(d.target).val())
?(el.removeClass(_.invalidCl),ret=false)
:el.addClass(_.invalidCl)
})
return ret
},
isEmpty:function(el){
var tmp
return (tmp=el.find(_.targets).val())==''||tmp==el.data('defVal')
},
validateFu:function(){
_.labels.each(function(){
var th=$(this)
_.isEmpty(th)
?_.showEmptyFu(th)
:_.hideEmptyFu(th)
_.isValid(th)
?_.showErrorFu(th)
:_.hideErrorFu(th)
})
},
submitFu:function(){
_.validateFu()
if(!_.form.has('.'+_.invalidCl).length)
$.ajax({
type: "POST",
url:_.mailHandlerURL,
data:{
name:$('.name input',_.form).val()||'nope',
email:$('.email input',_.form).val()||'nope',
phone:$('.phone input',_.form).val()||'nope',
subject:$('.subject input',_.form).val()||'nope',
days:$('.days input',_.form).val()||'nope',
fax:$('.fax input',_.form).val()||'nope',
state:$('.state input',_.form).val()||'nope',
message:$('.message textarea',_.form).val()||'nope',
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=this
_.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')
}
}
if(!data)
(typeof opt=='object'?$.extend(_,opt):_).init.call(th),
th.data({cScroll:_}),
data=_
else
_=typeof opt=='object'?$.extend(data,opt):data
})
return this
}
})
})(jQuery)
$(function(){
$('#contact-form').forms({
ownerEmail:'admin@ututor.com.au'
})
})

QUESTION:
How to get the drop down menu to work in the php. I;m OK with the HTML but what is required in PHP and JS additon?

Thanks
B

Re: Form help

Posted: Wed Mar 14, 2012 1:22 am
by social_experiment
In php you can access the value of the selected dropdown value as you do the other values in the form; $_POST['days']; this is already in the code though; what happens when you submit the form?

Re: Form help

Posted: Wed Mar 14, 2012 6:22 am
by Bernster
When I submit the form I get:
Visitor: Bernie

Email Address: bernsterxxxx@hotmail.com

Phone Number: 0412xxxxxx

Subject of study: English

Preferred day:

Message: Test of day as Wednesday and subject as English

------------------------------------ >
There is no value for returned for the day selected

Re: Form help

Posted: Wed Mar 14, 2012 8:52 am
by Tiancris
$days = $POST['days']; :wink:

Re: Form help

Posted: Wed Mar 14, 2012 9:30 am
by social_experiment
Tiancris wrote:$days = $POST['days'];
You mean

Code: Select all

$days = $_POST['days'];
@OP What happens if you print the contents of $_POST

Code: Select all

<?php
 print_r($_POST);
?>

Re: Form help

Posted: Thu Mar 15, 2012 12:36 am
by Bernster
What I've done is to change the option1 to the actual day name (Monday, Tuesday...)
I've also corrected an error in the PHP from $days = $POST['days']; to $days = $_POST['days']; (THANKS)

The code CURRENTLY still fails to provide the day selected.

I'm only new to PHP > so even (<?php
print_r($_POST);
?>) >

I would need to know where to place it. Someone else has suggested that I add (<?PHP echo $_POST['SELECT_NAME']; ?> ) > but again > I have no idea where to place it.

The only other option is that I change the select to a text field where ppl can add their day manually. I was just really keen to know how select can work with PHP

Bernie

Re: Form help

Posted: Thu Mar 15, 2012 1:49 am
by social_experiment
You can put that snippet of code anywhere on the page that processes the form; it's purpose is to see which values are present in the $_POST array once the form is submitted; I tested the default form code you posted and it returned only $_POST['days'];
Bernster wrote:I was just really keen to know how select can work with PHP
The value of any $_POST field can be accessed by $_POST['fieldName'] where fieldName is the value inside the "name" attribute on your HTML form. Select elements aren't different from a textfield in terms of retrieving the information

Re: Form help

Posted: Thu Mar 15, 2012 2:11 am
by Bernster
Thanks guys.. but its doing my head in. I think I need someone just to add the content code so I can just paste it.
Over my head as far as PHP understanding.

Thanks anyway.

B