Developing Form

Completed Posted Jul 11, 2010 Paid on delivery
Completed Paid on delivery

I would like to get a script/code in order to make printable gift cards. There are two versions of this project:

1) One card on a page - The idea is to have a text box where people could enter their greeting. It would be one line of text.

2) There will be a choice of 4 images (radio) where the user chooses one of these images.

3) submit - once they press submit they will go to a printable page where the following would appear: first their greeting at the top then under that the image that they chose (from radio on form).

Another option would be the same as the above but the final output (i.e. the greeting card) will be in a table with about 4 or 6 copies on the same page. This would also be printable but would allow user to print 4 or 6 copies of the card on the same page.

BTW my site is on wordpress.

If it is possible and will not add too much to the cost I would like to be able to choose the color of the font and maybe add a border and choose the color of the border.

I have attached the html that I would like for the project to make it easier and to ensure that it is clear what I would like to achieve. I just need the script to make it work.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="en-us" http-equiv="Content-Language" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Select the Background Image</title>
<style type="text/css">
.auto-style1 {
color: #FFFF00;
}
.auto-style2 {
color: #0000FF;
}
.auto-style3 {
color: #FF0000;
}
.auto-style4 {
color: #00FF00;
}
.auto-style5 {
color: #800080;
}
.auto-style6 {
color: #808080;
}
.auto-style7 {
color: #F19144;
}
</style>
</head>

<body>

<form action="" method="post">
<table style="width: 100%">
<tr>
<td><strong>Select the Background Image</strong></td>
<td>&nbsp;</td>
</tr>
<tr>
<td><input checked="checked" name="Radio1" type="radio" /><img alt="add alt" height="75" longdesc="add description" src="upload/activities.jpg" width="50" /></td>
<td><input name="Radio1" type="radio" /><img alt="add alt" height="37" longdesc="add description" src="upload/summer.jpg" width="50" /></td>
</tr>
<tr>
<td><input name="Radio1" type="radio" /><img alt="add alt" height="50" longdesc="add description" src="upload/drawing.jpg" width="50" /></td>
<td><input name="Radio1" type="radio" /><img alt="add alt" height="50" longdesc="add description" src="upload/cookies.jpg" width="48" /></td>
</tr>
<tr>
<td><input name="Radio1" type="radio" /><img alt="add alt" height="50" longdesc="add description" src="upload/birthday.jpg" width="47" /></td>
<td><input name="Radio1" type="radio" /><img alt="add alt" height="50" longdesc="add description" src="upload/flowers1.jpg" width="57" /></td>
</tr>
<tr>
<td colspan="2"><input name="Radio1" type="radio" />OR add your own
image&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input name="File1" type="file" /></td>
</tr>
<tr>
<td colspan="2" style="height: 20px"><hr /></td>
</tr>
<tr>
<td><strong>Add the Title</strong></td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;<input name="Text1" type="text" /></td>
<td>&nbsp;</td>
</tr>
<tr>
<td colspan="2"><hr /></td>
</tr>
<tr>
<td><strong>Add any additional Text</strong></td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;<textarea cols="20" name="TextArea1" rows="2"></textarea></td>
<td>&nbsp;</td>
</tr>
<tr>
<td colspan="2">&nbsp;<hr /></td>
</tr>
<tr>
<td><strong>Choose Font Color</strong></td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" />Black</td>
<td>&nbsp;<span class="auto-style3"><input name="Radio1" type="radio" />Red</span></td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" /><span class="auto-style2">Blue</span></td>
<td>&nbsp;<input name="Radio1" type="radio" /><span class="auto-style4">Green</span></td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" /><span class="auto-style1">Yellow</span></td>
<td>&nbsp;<input name="Radio1" type="radio" /><span class="auto-style5">Purple</span></td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" /><span class="auto-style6">Grey</span></td>
<td>&nbsp;<input name="Radio1" type="radio" /><span class="auto-style7">Orange</span></td>
</tr>
<tr>
<td colspan="2"><hr /></td>
</tr>
<tr>
<td><strong>Choose Border Color</strong></td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" value="1" />Black</td>
<td>&nbsp;<input name="Radio1" type="radio" value="2" /><span class="auto-style3">Red</span></td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" value="3" /><span class="auto-style2">Blue</span></td>
<td>&nbsp;<input name="Radio1" type="radio" value="4" /><span class="auto-style4">Green</span></td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" value="5" /><span class="auto-style1">Yellow</span></td>
<td>&nbsp;<input name="Radio1" type="radio" value="6" /><span class="auto-style5">Purple</span></td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" value="7" /><span class="auto-style6">Grey</span></td>
<td>&nbsp;<input name="Radio1" type="radio" value="8" /><span class="auto-style7">Orange</span></td>
</tr>
<tr>
<td colspan="2"><hr /></td>
</tr>
<tr>
<td><strong>Choose Thickness of Border</strong></td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" /><img alt="alt" height="31" longdesc="description" src="icons/line1.gif" width="50" /></td>
<td>&nbsp;<input name="Radio1" type="radio" /><img alt="alt" height="31" longdesc="description" src="icons/line2.gif" width="50" /></td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" /><img alt="alt" height="30" longdesc="description" src="icons/line3.gif" width="50" /></td>
<td>&nbsp;<input name="Radio1" type="radio" /><img alt="alt" height="30" longdesc="description" src="icons/line4.gif" width="50" /></td>
</tr>
<tr>
<td colspan="2" style="height: 20px"><hr /></td>
</tr>
<tr>
<td colspan="2"><strong>How many copies would you like to appear on
one page?&nbsp;</strong></td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" />1&nbsp;
<img alt="alt" height="50" longdesc="description" src="icons/1onpage.gif" width="60" /></td>
<td>&nbsp;<input name="Radio1" type="radio" />2&nbsp;
<img alt="alt" height="50" longdesc="description" src="icons/2onpage.gif" width="60" /></td>
</tr>
<tr>
<td>&nbsp;<input name="Radio1" type="radio" />4&nbsp;
<img alt="alt" height="50" longdesc="description" src="icons/4onpage.gif" width="60" /></td>
<td>&nbsp;<input name="Radio1" type="radio" />6&nbsp;
<img alt="alt" height="50" longdesc="description" src="icons/6onpage.gif" width="60" /></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td><input name="Submit1" type="submit" value="submit" /></td>
<td><input name="Reset1" type="reset" value="reset" /></td>
</tr>
</table>
</form>

</body>

</html>

ASP IIS Java JavaScript Perl

Project ID: #735613

About the project

4 proposals Remote project Active Jul 13, 2010

Awarded to:

ElVox

Revising my original bid downwards after some consideration.

$130 USD in 5 days
(6 Reviews)
4.1

4 freelancers are bidding on average $135 for this job

mobzdesign

Please check PMB for details, Thank you

$150 USD in 4 days
(1 Review)
0.0
drax

Hi. I can make all what you requested (including color changes).

$140 USD in 3 days
(0 Reviews)
0.0