Hello All
Just thought someone may like to use my form of their website.
It’s completely accessable to level two DDA complience. It would be DDA level three if I could work out how to add a value to the input fields without corrupting the FormProcessor.
I’m trying to get this to work:
value="Enter your eMail here" onfocus="if(this.value=='Enter your eMail here')this.value=''" />
You’ll need to format it with CSS
<form name="contact" action="[~[*id*]~]" method="post">
<fieldset>
<input type="hidden" name="send_to" value="FormProcessor" />
<legend>eMail Form</legend>
<ol>
<li>
<label for="your_name">Your Name</label> [+Name-required_message+]<br />
<input type="text" id="your_name" size="27" class="[+Name-required_class+]" name="Name" value="[+Name-value+]" />
</li>
<li>
<label for="your_email">Your eMail</label> [+eMail-required_message+]<br />
<input type="text" id="your_email" size="27" class="[+eMail-required_class+]" name="eMail" value="[+eMail-value+]" />
</li>
<li>
<label for="your_message">Your Message</label> [+Message-required_message+]<br />
<textarea cols="25" rows="10" id="your_message" class="[+Message-required_class+]" name="Message">[+Message-value+]</textarea>
</li>
<li>[+How_did_you_find_us-required_message+]
How did you find this website?
</li>
<li>
<label class="radio-label" for="search_engine">Search Engine</label>
<input type="radio" id="search_engine" name="How_did_you_find_us" value="Search Engine" [+How_did_you_find_us-checked-Search_Engine+]/>
</li>
<li>
<label class="radio-label" for="another_website">Another website</label>
<input type="radio" id="another_website" name="How_did_you_find_us" value="Another website" [+How_did_you_find_us-Another_website+]/>
</li>
<li>
<label class="radio-label" for="other">Other</label>
<input type="radio" id="other" name="How_did_you_find_us" value="Other" [+How_did_you_find_us-Other+]/>
</li>
</ol>
</fieldset>
<div class="send">
<input type="hidden" name="send_to" value="FormProcessor" />
<input type="submit" class="FSF_submit" alt="submit" />
</div>
</form>
The CSS I use is:
/*
---------------------------------------
Form Formatting
---------------------------------------
*/
#page_right_col label {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #313131;
font-weight: bold;
position:absolute;
z-index:1;
padding: 0em;
}
.radio-label {
margin: 0.1em 0 0 2em;
}
#page_right_col input, #page_right_col textarea {
border: 1px solid #CCCCCC;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:1em;
padding: 0.3em;
}
#page_right_col fieldset {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:0.7em;
border: 0;
padding:0;
}
#page_right_col ol {
list-style: none;
padding:0;
margin:0;
}
#page_right_col li {
list-style: none;
padding:0;
margin:0;
}
.error {
display:block;
width:195px;
position:absolute;
z-index:2;
margin-bottom:-20px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.9em;
padding: 0.3em;
color:#fff;
font-weight:bold;
background: url(../images/form_error.jpg) repeat-y;
}
.send {
text-align:rightr;
color:#990000;
text-align:right;
background:#DADAE0;
}
Let me know if you have any questions or a solution to the value issue... contact me via my website (in the footer of this message)
), read the documentation first => it’s pretty clear and gives a good idea how to start with FormProcessor.
MODX Staff
)
☆ A M B ☆
)