Form Conversion Help Please

**protheory** · Apr 16, 2008 10:55

I'd like to convert my form to have only a mailto: method please but I need help to edit it correctly. I've used Jotform's editor to make my form but for some reason it limits the picture upload size to 50kb and so I'm trying to edit it to just mail the contents of the form. Here's my form source:

Code:

<script src="http://jotform.com/js/form.js?v2.0.607" type="text/javascript"></script>
<style type="text/css">
html,body{height:100%; margin:0;}
.tbmain{ 
 /* Changes on the form */
 background: white !important; 
}
.left{
  /* Changes on the form */
  color: black !important; 
  font-family: Verdana !important;
  font-size: 12px !important;
}
.head{
  color:#333333;
  font-size:20px;;
  text-decoration:underline;
  font-family:"Verdana";
}
td.left {
  font-family:"Verdana";
  font-size:12px;
  color:black;
}
.pagebreak{
  font-family:"Verdana";
  font-size:12px;
  color:black;
}
.tbmain{
  height:100%;
  background:white;
}
span.required{
  font-size: 13px !important;
  color: red !important;
}

</style> 
<body>
<table width="100%" cellpadding="2" cellspacing="0" class="tbmain">
<tr><td class="topleft" width="10" height="10">&nbsp;</td>
<td class="topmid">&nbsp;</td>
<td class="topright" width="10" height="10">&nbsp;</td>
  </tr>
<tr>
<td class="midleft" width="10">&nbsp;&nbsp;&nbsp;</td>
<td class="midmid" valign="top">
<form enctype="multipart/form-data"  action="http://jotform.com/submit.php"  method="post" name="q_form_80972329298">
<input type="hidden" name="formID" value="80972329298" />
<div id="main"> 

<table width="520" cellpadding="5" cellspacing="0">
 <tr >
  <td width="150" class="left" >
   <label >Your Name</label>
  </td>
  <td class="right" >
   <input type="text" size="20" name="q2_YourName" class="text" value="" id="q2"  maxlength="100" maxsize="100" />
  </td>
 </tr>

 <tr >
  <td width="150" class="left" >
   <label >Email address:</label>
  </td>
  <td class="right" >
   <input type="text" size="20" name="q18_Emailaddress" class="text" value="" id="q18"  maxlength="100" maxsize="100" />
  </td>
 </tr>

 <tr >
  <td width="150" class="left" >
   <label >Confirm email address:</label>
  </td>
  <td class="right" >
   <input type="text" size="20" name="q16_Confirmemailaddress" class="text" value="" id="q16"  maxlength="100" maxsize="100" />
  </td>
 </tr>

 <tr >
  <td width="150" class="left" >
   <label >Contact telephone number:</label>
  </td>
  <td class="right" >
   <input type="text" size="20" name="q19_Contacttelephonenumber" class="text" value="" id="q19"  maxlength="100" maxsize="100" />
  </td>
 </tr>

 <tr >
  <td width="150" class="left" >
   <label >Country and county/state:</label>
  </td>
  <td class="right" >
   <input type="text" size="20" name="q20_Countryandcountystate" class="text" value="" id="q20"  maxlength="100" maxsize="100" />
  </td>
 </tr>

 <tr >
  <td width="150" class="left"  valign="top" >
   <label>How long do you wish to place your advert:</label>
  </td>
  <td class="right">
   <select class="other" name="q13_Howlongdoyouwishtoplaceyouradvert" id="q13" >
  <option></option>
    <option>12 months - £30.00</option>

    <option>6 months - £20.00</option>
    <option>Special Offer (discount code required</option>
   </select>
  </td>
 </tr>
 <tr >
  <td width="150" class="left"  valign="top" >
   <label>Number of studs you wish to advertise:</label>

  </td>
  <td class="right">
   <select class="other" name="q11_Numberofstudsyouwishtoadvertise" id="q11" >
  <option></option>
    <option>1</option>
    <option>2</option>
    <option>3</option>

    <option>More</option>
   </select>
  </td>
 </tr>
 <tr >
  <td width="150" class="left" >
   <label >Breed and Affix (If applicable):</label>
  </td>

  <td class="right" >
   <input type="text" size="20" name="q22_BreedandAffixIfapplicable" class="text" value="" id="q22"  maxlength="100" maxsize="100" />
  </td>
 </tr>
 <tr >
  <td width="150" class="left" >
   <label >Kennel Club name (If applicable):</label>
  </td>

  <td class="right" >
   <input type="text" size="20" name="q23_KennelClubnameIfapplicable" class="text" value="" id="q23"  maxlength="100" maxsize="100" />
  </td>
 </tr>
 <tr >
  <td width="150" class="left"  valign="top" >
   <label>How old is your dog?</label>
  </td>

  <td class="right">
   <select class="other" name="q12_Howoldisyourdog" id="q12" >
  <option></option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>3</option>

    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
    <option>Older</option>
   </select>

  </td>
 </tr>
 <tr >
  <td width="150" class="left" >
   <label >Colour:</label>
  </td>
  <td class="right" >
   <input type="text" size="20" name="q24_Colour" class="text" value="" id="q24"  maxlength="100" maxsize="100" />

  </td>
 </tr>
 <tr >
  <td width="150" class="left" >
   <label >Temperament i.e. good with children etc:</label>
  </td>
  <td class="right" >
   <input type="text" size="20" name="q25_Temperamentiegoodwithchildrenetc" class="text" value="" id="q25"  maxlength="100" maxsize="100" />

  </td>
 </tr>
 <tr >
  <td width="150" class="left" >
   <label >Any show wins or awards:</label>
  </td>
  <td class="right" >
   <input type="text" size="20" name="q26_Anyshowwinsorawards" class="text" value="" id="q26"  maxlength="100" maxsize="100" />

  </td>
 </tr>
 <tr >
  <td width="150" class="left" valign="top"  >
   <label>Health Checks i.e. Hip Score, Eye Certificate, Hearing test, Heart tested:</label>
  </td>
  <td class="right" >
   <textarea cols="30" rows="5" name="q10_HealthChecksieHipScore,EyeCertificate,Hearingtest,Hearttested" class="text" id="q10" ></textarea>

  </td>
 </tr>
 <tr >
  <td width="150" class="left" valign="top"  >
   <label>Your History with the breed:</label>
  </td>
  <td class="right" >
   <textarea cols="30" rows="2" name="q15_YourHistorywiththebreed" class="text" id="q15" ></textarea>

  </td>
 </tr>
 <tr >
  <td width="150" class="left" valign="top"  >
   <label>Details of litters previously sired:</label>
  </td>
  <td class="right" >
   <textarea cols="30" rows="2" name="q27_Detailsoflitterspreviouslysired" class="text" id="q27" ></textarea>

  </td>
 </tr>
 <tr >
  <td width="150" class="left" valign="top"  >
   <label>Requirements for visiting *****es:</label>
  </td>
  <td class="right" >
   <textarea cols="30" rows="2" name="q30_Requirementsforvisiting*****es" class="text" id="q30" ></textarea>

  </td>
 </tr>
 <tr >
  <td width="150" class="left" >
   <label >Stud Fee:</label>
  </td>
  <td class="right" >
   <input type="text" size="20" name="q21_StudFee" class="text" value="" id="q21"  maxlength="100" maxsize="100" />

  </td>
 </tr>
 <tr >
  <td width="150" class="left" valign="top"  >
   <label>Any other relevant information you wish to state:</label>
  </td>
  <td class="right" >
   <textarea cols="30" rows="2" name="q31_Anyotherrelevantinformationyouwishtostate" class="text" id="q31" ></textarea>

  </td>
 </tr>
 <tr >
  <td width="150" class="left" >
     <label>Please upload your photo here (May take a while depending on your connection speed):</label>
  </td>
  <td class="right">
     <input type="file" class="text" size="20" name="q14_PleaseuploadyourphotohereMaytakeawhiledependingonyourconnectionspeed" id="q14"   />

  </td>
 </tr>
 <tr >
  <td width="150" class="left" >&nbsp;
   
  </td>
  <td class="right">
  <input type="submit" class="btn" value="Submit" />
 </td>
 </tr>

</table>
</div>
</form>
</td>
<td class="midright" width="10">&nbsp;&nbsp;&nbsp;</td>
</tr>
<tr>
 <td class="bottomleft" width="10" height="10">&nbsp;</td>
 <td class="bottommid">&nbsp;</td>
 <td class="bottomright" width="10" height="10">&nbsp;</td>
</tr>
</table>
<script type="text/javascript">
validate("q_form_80972329298");
</script>

Do I still need the Javascript to validate it?

I've also heard that some e-mail programs send form input in a strange format and that it needs a program to fix it somehow. Ideally I'd like to replace the PHP script on Jotform's site with my own but this is another thing I'm not sure how to do.

Thanks everybody

**Stomme poes** · Apr 17, 2008 01:42

I hate the HTML part of the form, but the rest should probably be moved to the Javascript forum as this really isn't an HTML question but a scripting question. I don't see anything in the HTML that would affect filezise of uploads or anything.

Second, are the forms only being emailed to you? Emails are strange when it comes to styling, but if you just need the info presented to you and not the styling it's easier to cut that HTML by more than half and CSS the styling. You can really make that form a lot smaller if it doesn't need to look special (email programmes support CSS but erratically, so usually inline styling is the safest).

Btw, what's up with all the !importants? They are hack and can usually be avoided. What are you trying to make the form look like? Also, you might have some errors in the current code, like having an inline (the hidden input) as a direct child of the form. If using XHTML, the name on the form is invalid, and a few other things. : )

But I can't help with the scripts sorry. I'm willing to show you some other ways of writing clean forms if you're interested. I realise it's harder when you're working with a programme which does some of the writing for you, taking away some control.

User Tag List

Thread: Form Conversion Help Please

Thread Tools

Display

Form Conversion Help Please

Bookmarks

Bookmarks

Posting Permissions