Basicaly I took the form posted in "Optical Contact / Request Information form by laurel" and altered it to suite my needs and added some CSS styling. Hope you guys like it and can find a use for it somewhere.
<style type="text/css">
<!--
legend
{
color:#000000;
background:#6699FF;
border: 1px solid #781351;
padding: 2px 6px;
}
fieldset
{
border: 1px solid #781351;
width: 90%;
background-color:#E9FEFE
}
label2
{
width: 16em;
text-align: right;
margin-right: 0.5em;
display: block;
}
label1
{
width: 8em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block;
}
select {
width: 8em;
text-align: left;
}
input
{
color: #781351;
background: #fee3ad;
border: 1px solid #781351;
}
.submit input
{
color: #000;
background: #ffa20f;
border: 2px outset #d7b9c9;
}
-->
</style>
</head>
<body>
<fieldset>
<legend>JLS Design Details</legend><br/>
<label2 for="contact">Contact: **************</label2><br/>
<label2 for="tel">Telephone: **************</label2><br/>
<label2 for="mob">Mobile: **************</label2>
</fieldset><br/>
<fieldset>
<legend><strong>Your Details</strong></legend>
<p><label1 for="name">Your Name:</label1><input type="text" name="name" size="40"></p>
<p><label1 for="email">E-mail:</label1><input name="email" type="text" size="40">
<p><label1 for="dayphone">Day Phone:</label1><input type="text" name="day_phone" size="20"> </p>
<p><label1 for="evephone">Evening Phone:</label1><input type="text" name="night_phone" size="20"></p>
</p>
</fieldset><br />
<fieldset>
<legend><strong>When would you like this project to begin?</strong></legend>
<br/>
<label2 for="month"><strong>Month</strong>
<select NAME="month" id="ff_elem203" size="1">
<option SELECTED VALUE="none">Select Month</option>
<option VALUE="Jan">Jan</option>
<option VALUE="Feb">Feb</option>
<option VALUE="Mar">Mar</option>
<option VALUE="Apr">Apr</option>
<option VALUE="May">May</option>
<option VALUE="Jun">Jun</option>
<option VALUE="Jul">Jul</option>
<option VALUE="Aug">Aug</option>
<option VALUE="Sep">Sep</option>
<option VALUE="Oct">Oct</option>
<option VALUE="Nov">Nov</option>
<option VALUE="Dec">Dec</option>
</select></p></label2>
<br/>
<label2 for="year"><strong>Year</strong>
<select name="select" id="year" size="1">
<option value="2007" selected="selected">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
</select>
</label2>
</fieldset><br/>
<fieldset>
<legend><strong>Your Enquiry is about:</strong></legend>
<div align="left">
<table border="0" width="90%" id="table4" align="left">
<tr>
<td width="150">
<p><input TYPE="checkbox" NAME="ff_nm_Website[]" VALUE="info" id="ff_elem193">
<label id="ff_lbl193" for="ff_elem193">Website Design </label>
</p>
<p><input TYPE="checkbox" NAME="ff_nm_NewMedia[]" VALUE="info" id="ff_elem194">
<label id="ff_lbl194" for="ff_elem194">New Media </label>
Design</td>
<td width="164">
<p><input TYPE="checkbox" NAME="ff_nm_SoftwareBox[]" VALUE="info" id="ff_elem195">
<label id="ff_lbl195" for="ff_elem195">SoftwareBox</label>
Design</p>
<p><input TYPE="checkbox" NAME="ff_nm_Print[]" VALUE="info" id="ff_elem196">
<label id="ff_lbl196" for="ff_elem196">Print Design (eg Poster)</label>
</td>
<td width="304">
<p><input TYPE="checkbox" NAME="ff_nm_Logo[]" VALUE="info" id="ff_elem197">
<label id="ff_lbl197" for="ff_elem197">Logo</label>
Design</p>
<input TYPE="checkbox" NAME="ff_nm_Other[]1" VALUE="info" id="ff_elem199">
<label id="ff_lbl199" for="ff_elem199">Other Information or Questions: </label>
<p></td>
</tr>
</table>
</div>
<p></p>
<p><textarea COLS="50" NAME="other_info" id="ff_elem192" style="height: 63; width: 612" rows="4"></textarea>
</p>
</fieldset><br/>
<fieldset>
<legend><strong>The best way to contact you is</strong></legend>
<input type="checkbox" name="contact" value="phone"> By Telephone
<input type="checkbox" name="contact" value="email"> By Email </p>
</fieldset><br/>
<fieldset>
<legend><strong>Use the space below for additional questions & comments:</strong></legend>
<p><textarea COLS="50" NAME="other_info0" id="ff_elem205" style="height: 63; width: 612" rows="4"></textarea>
</p>
</fieldset><br/>
<fieldset><legend><strong>AntiSpam</strong></legend>
<div align="center">{imageverification}</div>
</fieldset>
</p>
<p align="center">
<input type="submit" value="Send to JLS Design" name="Submit" style="font-weight: bold">
<input type="reset" value="Reset (cancel form)" name="reset" style="font-size: 8pt">
</p>
Example of what this form looks like:

Hope it is ok.
Post edited by: jamesls, at: 2007/09/27 04:15<br><br>Post edited by: jamesls, at: 2007/09/27 04:16
Max

There's a way to do a refresh button in this FAQ, and in the same piece of code you'll see that you can swap around the elements of the block. Note that this will apply to all your forms though!
Bob
I am new to this form and Chrono, please help me with this form. I have modified the form Jamesls posted but was unable to make it work. I am using it to collect general information about the player, names address etc.
Any help would much appreciated. By the I don't have any javascript with the form.
thanks
John.
here is the form code:
<style type="text/css">
legend
{
color:#000000;
background:#6699FF;
border: 1px solid #781351;
padding: 2px 6px;
}
fieldset
{
border: 1px solid #781351;
width: 90%;
background-color:#E9FEFE
}
label2
{
width: 16em;
text-align: right;
margin-right: 0.5em;
display: block;
}
label1
{
width: 8em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block;
}
select {
width: 8em;
text-align: left;
}
input
{
color: #781351;
background: #fee3ad;
border: 1px solid #781351;
}
.submit input
{
color: #000;
background: #ffa20f;
border: 2px outset #d7b9c9;
}
</style>
<fieldset>
<legend><strong>Team Registration Form</strong></legend>
<p><label1 for="name">Season:</label1><input type="text" name="name" size="40"></p>
<p><label1 for="name">Team Representative:</label1><input name="text" type="text" size="40">
<p><label1 for="dayphone">Phone:</label1><input type="text" name="day_phone" size="40"> </p>
<p><label1 for="email">Team Eamil:</label1><input type="text" name="email" size="40"></p>
<p><label1 for="name">Team Name:</label1><input name="text" type="text" size="40"></p>
</fieldset><br />
<fieldset>
<legend><strong>Roster</strong></legend>
<p><label1 for="name">1</label1><input name="text" type="text" size="40">
<p><label1 for="name">2</label1><input name="text" type="text" size="40">
<p><label1 for="name">3</label1><input name="text" type="text" size="40">
<p><label1 for="name">4</label1><input name="text" type="text" size="40">
<p><label1 for="name">5</label1><input name="text" type="text" size="40">
<p><label1 for="name">6</label1><input name="text" type="text" size="40">
<p><label1 for="name">7</label1><input name="text" type="text" size="40">
<p><label1 for="name">8</label1><input name="text" type="text" size="40">
<p><label1 for="name">9</label1><input name="text" type="text" size="40">
<p><label1 for="name">10</label1><input name="text" type="text" size="40">
<p><label1 for="name">11</label1><input name="text" type="text" size="40">
<p><label1 for="name">12</label1><input name="text" type="text" size="40">
<p><label1 for="name">13</label1><input name="text" type="text" size="40">
<p><label1 for="name">14</label1><input name="text" type="text" size="40">
<p><label1 for="name">15</label1><input name="text" type="text" size="40">
<p><label1 for="name">16</label1><input name="text" type="text" size="40">
<p><label1 for="name">17</label1><input name="text" type="text" size="40">
<p><label1 for="name">18</label1><input name="text" type="text" size="40">
<p><label1 for="name">19</label1><input name="text" type="text" size="40">
<p><label1 for="name">20</label1><input name="text" type="text" size="40">
<br/>
<fieldset>
<legend><strong>The best way to contact you is</strong></legend>
<input type="checkbox" name="contact" value="phone"> By Telephone
<input type="checkbox" name="contact" value="email"> By Email </p>
</fieldset><br/>
<fieldset>
<legend><strong>Use the space below for additional questions & comments:</strong></legend>
<p><textarea COLS="50" NAME="other_info0" id="ff_elem205" style="height: 63; width: 612" rows="4"></textarea>
</p>
</fieldset><br/>
<fieldset><legend><strong>AntiSpam</strong></legend>
<div align="center">{imageverification}</div>
</fieldset>
</p>
<p align="center">
<input type="submit" value="Send to Oromia Sports" name="Submit" style="font-weight: bold">
<input type="reset" value="Reset (cancel form)" name="reset" style="font-size: 8pt">
</p>
When you say it doesn't work can you say a bit more please? What doesn't work? If you turn debug on what do you see?
Bob
Max: I can't get this to show the code!!!
When i copy this code in the html area and i go to "Save" the component dont save the full code.only a piece of it.
<fieldset> <legend><b>Bei Fragen:</b></legend><br/>
<label2 for="contact">Fahrschule Nickel</label2><br/>
<label2 for="tel">Telefon: 0282</label2><br/>
<label2 for="mob">Mobil: 0170</label2>
</fieldset><br/>
<fieldset>
<legend><strong>Persönliche Angaben</strong></legend>
<p><label1 for="name"> Name:</label1><input type="text" name="name" size="40"></p>
<p><label1 for="email">Stasse/Nr.:</label1>
<input name="street" type="text" size="40">
<p><label1 for="email">PLZ/Ort:</label1>
<input name="ort_plz" type="text" size="40">
<p><label1 for="email">Geb.Datum:</label1>
<input name="geb_datum" type="text" size="14" value="TT.MM.JJJJ">
<p><label1 for="email">E-mail:</label1><input name="email" type="text" size="40">
<p><label1 for="dayphone">Telefon:</label1><input type="text" name="day_phone" size="20"> </p>
<p><label1 for="evephone">Mobil:</label1>
<input type="text" name="mobil_phone" size="20">
</p>
</p>
</fieldset><br />
<fieldset>
<legend><strong>Welche FS-Klasse möchten Sie machen?</strong></legend>
<br/>
<label2 for="month"><strong>Klasse</strong>
<select NAME="month" id="ff_elem203" size="1">
<option SELECTED VALUE="none">Klasse waehlen</option>
<option VALUE="AD">A (d, ab 25 Jahren)</option>
<option VALUE="AB">A (b, ab 18 Jahren)</option>
<option VALUE="A1">A1 (ab 16 Jahren)</option>
<option VALUE="PKWB">B (KFZ)</option>
<option VALUE="BE">BE (KFZ mit Anhänger)</option>
<option VALUE="A_B">A+B</option>
<option VALUE="B_BE">B+BE</option>
<option VALUE="KL_M">M (50er Roller)</option>
<option VALUE="mofa">Mofa</option>
</select></label2>
<br/>
<label2 for="year"><strong>Ich moechte:</strong>
<select name="select" id="year" size="1">
<option value="2007" selected>Anmeldung</option>
<option value="2008">Nachschulung</option>
<option value="2009">Informationen</option>
</select>
</label2>
</fieldset><br/>
<fieldset>
<legend><strong>Ich moechte Informationen ueber:</strong></legend>
<div align="left">
<table border="0" width="90%" id="table4" align="left">
<tr>
<td width="150">
<p><input TYPE="checkbox" NAME="ff_nm_Website[]" VALUE="info" id="ff_elem193">
<label id="ff_lbl193" for="ff_elem193">Fuehrerschein</label> </p>
<p><input TYPE="checkbox" NAME="ff_nm_NewMedia[]" VALUE="info" id="ff_elem194">
<label id="ff_lbl194" for="ff_elem194">Fuehrerschen </label>
ab 17</td>
<td width="164">
<p><input TYPE="checkbox" NAME="ff_nm_SoftwareBox[]" VALUE="info" id="ff_elem195">
<label id="ff_lbl195" for="ff_elem195">Nachschulung</label>
.</p>
<p><input TYPE="checkbox" NAME="ff_nm_Print[]" VALUE="info" id="ff_elem196">
<label id="ff_lbl196" for="ff_elem196">Kurse</label>
</td>
<td width="304">
<p><input TYPE="checkbox" NAME="ff_nm_Logo[]" VALUE="info" id="ff_elem197">
<label id="ff_lbl197" for="ff_elem197">Preise.</label></p>
<input TYPE="checkbox" NAME="ff_nm_Other[]1" VALUE="info" id="ff_elem199">
<label id="ff_lbl199" for="ff_elem199">Sonstiges </label>
<p></td>
</tr>
</table>
</div>
<p></p>
<p><textarea COLS="50" NAME="other_info" id="ff_elem192" style="height: 63; width: 612" rows="4"></textarea>
</p>
</fieldset><br/>
<fieldset>
<legend><strong>Sie erreichen mich am besten ueber</strong></legend>
<input type="checkbox" name="contact" value="phone"> Telefon
<input type="checkbox" name="contact" value="email"> Email
</fieldset><br/>
<fieldset>
<legend><strong>Sonstiges:</strong></legend>
<p><textarea COLS="50" NAME="other_info0" id="ff_elem205" style="height: 63; width: 612" rows="4"></textarea>
</p>
</fieldset><br/>
<fieldset><legend><strong>AntiSpam</strong></legend>
<div align="center">{imageverification}</div>
</fieldset>
<p align="center">
<input type="submit" value="Senden" name="Submit" style="font-weight: bold">
<input type="reset" value="Loeschen" name="reset" style="font-size: 8pt">
</p>
That makes sense, good catch!
You should also take the <body> tag out of your form code; and I think the '<label1' tags should be just '<label'.
Bob
Thank you for getting back to me. My site is going live on May 31 and I really want this form to work so that the kids can register for summer soccer games.
What I did was:
• Created the form
• Pasted the form code into the html code section
• Created the link for it by going to menu->component link and display it on my home page using a module.
• Completed the form, clicked submit button but nothing happens – no data submitted no feedback.
I suspect I need javascript function for submitting and validation?
Thanks
John
You don't need any JavaScript for submitting (and probably not for validation).
In the ChronoForms Forms Manager, open the form and turn DeBug to ON in the General Tab (and remove any ReDirect URL temporarily).
Save the form, then click on the Link for the form to display it in a new window. Put some data in and Submit the form. You should then get a screen-ful of debug info. Please copy and post that here for starters.
Bob
I did exactly as you suggested and here is the out put
POST: Array ( [name] => test [text] => [day_phone] => 465555555 [email] => [email]test@me.com[/email] [contact] => email [other_info0] => [chrono_verification] => DifAB [Submit] => Send to Oromia Sports )
Case 1: Use table layout
E-mail: 'Yes' custom
Email not sent
E-mail message
From: Tura []
To: [email]info@oromiasports.com[/email], [email]test@me.com[/email]
Subject:
name test
text
day_phone 465555555
email [email]test@me.com[/email]
contact email
other_info0
Submit Send to Oromia Sports
reset
Submitted by 205.211.160.1
I can see something get recorded when I checked on the Saved Dataview. I have attached the screen shot. Even though I completed the form, the data is not recorded properly - no names of people registered show up.
only uploaded the output.
thanks
Thanks for that. There are two - probably separate - things going on here. First off nearly all your fields are named 'text'; what web forms do is to create a results slot for that name and write the results into it, when they find a second field with the same name the results from the first one are over-written. So all that's being returned in the $_POST array is the value of the last, empty text field. (Also 'text' is a not a good field name as it has other meanings in html.)
You need to rename your fields with either (a) different names text_1, text_2, . . .is fine, or (b) use an array name like text_result[], you can put this in all your fields and the web browser will add each result to the array instead of over-writing. This would probably be good for your roster fields.
Second, there's a problem with the email being sent. ChronoForms is sending it to Joomla and something is going wrong after that - hence the 'Email not sent' message. Please check the FAQs here and look for the one about emails not being sent as there are several possible causes.
Bob
I can't thank you enough for your help. I made the changes to name = text to name =text_1, 2 etc. Is this what you recommending me to change right? For example, see below but it didn't make any difference. please see the debug output at the bottom. By the way I didn't make changes the email yet though.
<legend><strong>Roster</strong></legend>
<p><label1 for="name">1</label1><input name="text_4" type="text" size="40">
<p><label1 for="name">2</label1><input name="text_5" type="text" size="40">
<p><label1 for="name">3</label1><input name="text_6" type="text" size="40">
<p><label1 for="name">4</label1><input name="text_7" type="text" size="40">
<p><label1 for="name">5</label1><input name="text_8" type="text" size="40">
</p><br/>
FORM DEBUG OUTPUT
_POST: Array ( [name] => 2008 [text_1] => oromia [day_phone] => 416280000 [email] => [email]zesource@yahoo.com[/email] [text] => Oromia [text_2] => John Smith [text_3] => Mary Santos [text_4] => James [text_5] => Ogali [text_6] => Hassofalt smith [text_7] => James williams [text_8] => stehpan Baani [text_9] => Roger miller [text_10] => Robert santos [text_11] => Jenny craig [text_12] => Don Willimams [text_13] => Don Willimams [text_14] => Don Willimams [text_15] => Don Willimams [text_16] => Don Willimams [text_17] => Don Willimams [text_19] => Don Willimams [text_20] => Don Willimams [text_21] => Don Willimams [text_22] => Don Willimams [text_23] => Don Willimams [contact] => email [other_info0] => test [chrono_verification] => ixD4R [Submit] => Send to Oromia Sports )
Case 2: Use template
E-mail: 'Yes' custom
Email not sent
Well the only difference that I can see is that you now have some output from your form.
But as you are using the email template and haven't changed it yet there isn't anything showing up in the email. As far as I can see that's exactly what you'd expect.
Switch back from 'email template' to 'field titles' and hopefully you'll see the data.
Bob
The ChronoForm Form manager interface is a bit intimediating. For example, in the General tab, there are a number of email fields which I still don't know how the difference.
I watched a couple of videos on how to create basic form and I understand it is hard to cover everything in video. As my profession is creating videos, I will create one (After I leared it myself). Do you know if there is manual that describe each tabs in details for this product?
thanks
John
Ye,I made the videos a long while (and many ChronoForms versions) ago. The interface is a bit intimidating but it is all logical once you get your head round the boxes.
The most important thing isto add one new thing at a time, if you add too many than you don't know what isn't working!
The email fields in the General tab are pretty much the same as in any Email programme though you probably don't see them all at once.
Email to - is the main person you are sending to
CC email - is a copy that is visible to the other recipients
BCC email - is a copy that isn't visible (that is the BCC email address doesn't show)
From email - is the one that appears as 'From' when you receive it
Return email - is the address that is used when you click 'Reply to' on the email (often the same as From but not necessarily so).
There isn't a manual that covers all the tabs, I have the beginnings of one done but it's slow progress at the moment.
Look forward to seeing the video!
Bob
It is interesting when I turned on the Debug, I see the form's out put correctly. However, when I checked the forms record in the from the back end, virtually 90% of the inputs were not recorded.
why the out put is different. Obviously I need to capture the info people send me in to the form record that I can process them.
Hmmm that maybe because you've edited the form field names after the database table was created. Assuming that you have no useful data so far The simplest thing to do is probably to make a copy form in the Form Manager, delete the old one and create a new table for the new form.
Bob
<?php
/* Subject and email variables */
$emailSubject = 'Sailing School Registration Form';
$webMaster = 'sailsmart@rogers.com';
/* Gathering data variables */
$mother_nameField = $_POST['mother_name'];
$father_nameField = $_POST['father_name'];
$home_phoneField = $_POST['home_phone'];
$home_phone2Field = $_POST['home_phone2'];
$mofficeField = $_POST['moffice'];
$fofficeField = $_POST['foffice'];
$mcellField = $_POST['mcell'];
$fcellField = $_POST['fcell'];
$mmemailField = $_POST['memail'];
$femailField = $_POST['femail'];
$emergcontactField = $_POST['emergcontact'];
$emergphoneField = $_POST['emergphone'];
$optimist_learn_to_sailField = $_POST['optimist_learn_to_sail'];
$white_sail_1Field = $_POST['white_sail_1'];
$white_sail_IIField = $_POST['white_sail_II'];
$white_sail_IIIField = $_POST['white_sail_III'];
$session_1Field = $_POST['session_1'];
$session3Field = $_POST['session3'];
$session5Field = $_POST['session5'];
$session7Field = $_POST['session7'];
$session2Field = $_POST['session2'];
$session4Field = $_POST['session4'];
$session6Field = $_POST['session6'];
$session8Field = $_POST['session8'];
$raceoptimistField = $_POST['raceoptimist'];
$bronzeIVField = $_POST['bronzeIV'];
$bronzeVField = $_POST['bronzeV'];
$session1rField = $_POST['session1r'];
$session2rField = $_POST['session2r'];
$opti2monthsField = $_POST['opti2months'];
$silversailVIField = $_POST['silversailVI'];
$goldsailVIIField = $_POST['goldsailVII'];
$month2Field = $_POST['month2'];
$earlybirdField = $_POST['earlybird'];
$latepickupField = $_POST['latepickup'];
$botheandlField = $_POST['botheandl'];
$lunchField = $_POST['lunch'];
$body = <<< EOD
<br><hr><br>
Mother's Name: $mother_nameField <br>
Father's Name: $father_nameField <br>
Home Phone: $home_phoneField <br>
Home Phone2: $home_phone2Field <br>
Mother's Office: $mofficeField <br>
Father's Office: $fofficeField <br>
Mother's Cell: $mcellField <br>
Father's Cell: $fcellField <br>
Mother's Email: $memailField <br>
Father's Email: $femailField <br>
Emergency Contact: $emergcontactField <br>
Emergency Phone: $emergphoneField <br>
Optimist Learn to Sail: $optimist_learn_to_sailField <br>
White Sail: $white_sail_1Field <br>
White Sail II: $white_sail_IIField <br>
White Sail III: $white_sail_IIIField <br>
Session I: $session_1Field <br>
Session 3: $session3Field <br>
Session 5: $session5Field <br>
Session 7: $session7Field <br>
Session 2: $session2Field <br>
Session 4: $session4Field <br>
Session 6: $session6Field <br>
Session 8: $session8Field <br>
Race Optimist : $raceoptimistField <br>
Bronze IV: $bronzeIVField <br>
Bronze V: $bronzeVField <br>
Session I Racing: $session1rField <br>
Session 2 Racing: $session2rField <br>
Optimist 2 Months: $opti2monthsField <br>
Silver Sail Racing: $silversailVIField <br>
Gold Sail Racing: $goldsailVIIField <br>
2 Months: $month2Field <br>
Earlybird: $earlybirdField <br>
Late Pick Up: $latepickupField <br>
Both Earlybird and Late Pickup: $botheandlField <br>
Lunch: $lunchField <br>
EOD;
$headers = "From: $email\r\n";
$header .= "Content-type: text/html\r\n";
$success = mail($webMaster, $emailSubject, $body, $headers,$success);
/* Results rendered as html */
$theResults = <<< EOD
<html>
<head>
<title>emailpage</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
background-color: #f1f1f1;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
font-weight: normal;
color: #666666;
text-decoration: none;
}
-->
</style>
</head>
<div>
<div align="left">Thank you for your interest! Your email will be answered very soon!</div>
</div>
</body>
</html>
EOD;
echo "$theResults";
?>
I have no idea what this is. It certainly doesn't look like nay kind of code that will work with ChronoForms (I know that it doesn't look right here - in part because of the heredocs in the middle.)
What is it supposed to be?
Bob
Now I have past the first hurdle. I will continue learning this great tool.
Thank you and have a nice weekend ( if you live in North America that is)
John
Please see this tutorial. If you still have problems with sending emails then FAQ 36 may also help but some of it applies to earlier versions of CF.
Bob