?
Solved

Adding Images in Form Fieldsets

Posted on 2008-10-09
5
Medium Priority
?
245 Views
Last Modified: 2010-04-21
Currently I have a order form to streamline some internal orders.

It works correctly but I want to add thumbnails of the products above the checkbox.
As of right now when I try and insert any sort of picture it messed the form up or does not show up!

Can images be placed inside fieldsets?
How can I add thumbnails of my products?
<?php
if( !empty($_POST['Name']) && !empty($_POST['Email']) && !empty($_POST['Site']) )
{
	header("Content-type: text/plain"); 
	//if you set this to false you will get "No Worries Posters". 
	//When true, you just get "Posters"
	$RemoveNoWorriesPrefix=true; 
	//list or regional managers to be cc
	$RegionalManager=array();
	$RegionalManager['A']="PersonA@company.com";
	$RegionalManager['B']="PersonB@company.com";
	$RegionalManager['C']="PersonC@company.com";
	$RegionalManager['D']="PersonD@company.com";
	$RegionalManager['E']="PersonE@company.com";
	$RegionalManager['F']="PersonF@company.com"; 
	
      $submittedData="";
	 
      $submittedData.="\nName:" . $_POST['Name'];
      $submittedData.="\nEmail:" . $_POST['Email'];
      $submittedData.="\nSite:" . $_POST['Site'];
      $submittedData.="\nRegional Manager:" . $_POST['regional_manager'];
	 
	 $fields=array('Standard_Supplies','No_Worries_Flyers','No_Worries_Posters','No_Worries_Banners','No_Worries_Postcards');
	foreach($fields as $arrName)
	{
		 if(isset($_POST[$arrName]))
		 {
		 	if($RemoveNoWorriesPrefix)
				$submittedData.="\n\n" . str_replace("No Worries ","",str_replace("_"," ",$arrName));
			else
				$submittedData.="\n\n" . str_replace("_"," ",$arrName); 
		      foreach($_POST[$arrName] as $value)
		      {
		            $k=$value."_quantity";
		            if(!empty($_POST[$k]))
		                  $submittedData .= "\n\t".str_replace("_"," ",$value) . ": " . $_POST[$k];
		      }
		 }
	}
	 $headers="";
	 if(!empty($_POST['regional_manager']))
	 	$headers="CC:". $RegionalManager[ $_POST['regional_manager'] ];
      if(!empty($submittedData))
      {
            //mail("natalie.teinert@company.com","Order details",$submittedData,$headers);
		 echo $submittedData;
            echo "\n\nThank you!";
      }
      exit;
}
?>
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
 
<html>
<head>
<title></title>
<style type="text/css">
.row1{float:left;width:24%;}
.row2{float:left;width:20%;}
fieldset{padding:5px;}
fieldset div select{display:block;}
legend{font-weight:bold;background-color:white;}
fieldset fieldset{border:0px; border-top:1px dashed black;margin-top:1em;}
</style>
 
</head>
<body>
<form id="form1" name="form1" method="post" action="<?=$_SERVER['PHP_SELF']?>">
  <label><strong>* Name:</strong></label>
  <input name="Name" type="text" id="Name" size="27">
  <br><br>
  <label><strong>* Email:</strong></label>
  <input name="Email" type="text" id="Email" size="27">
  <br><br>
<label><strong>* Site:</strong></label>
<input name="Site" type="text" id="Site" size="29">
<br>
<br>
<label>Regional Manager
<select name="regional_manager" id="regional_manager">
  <option  value="">-</option>
  <option value="A">Person A</option>
  <option value="B">Person B</option>
  <option value="C">Person C</option>
  <option value="D">Person D</option>
  <option value="E">Person E</option>
  <option value="F">Person F</option>
</select>
</label>
<br>
<br>
  <fieldset><legend>Standard Supplies</legend> 
            <div class="row1"><input type="checkbox" name="Standard_Supplies[]" value="RateSheet" />Ratesheet <select name="RateSheet_quantity"><option value="0"  >-</option>
		  <option value="500">500</option>
		  <option value="1000">1000</option>
		  <option value="1500">1500</option>
		  <option value="2000">2000</option>
            <option value="2500">2500</option>
            <option value="3000">3000</option>
            <option value="3500">3500</option>
            <option value="4000">4000</option>
            <option value="4500">4500</option>
            <option value="5000">5000</option>
            </select></div>
            <div class="row1"><input type="checkbox" name="Standard_Supplies[]" value="Table_Drape" />Table Drape <select name="Table_Drape_quantity"><option value="0"  >-</option>
                <option value="1 - 6 ft.">1 - 6 ft.</option>
                <option value="2 - 6 ft.">2 - 6 ft.</option>
                <option value="3 - 6 ft.">3 - 6 ft.</option>
                <option value="1 - 8 ft.">1 - 8 ft.</option>
                <option value="2 - 8 ft.">2 - 8 ft.</option>
                <option value="3 - 8 ft.">3 - 8 ft.</option>
            </select></div> 
            <div class="row1"><input type="checkbox" name="Standard_Supplies[]" value="Banner_Stands" />Banner Stands <select name="Banner_Stands_quantity"><option value="0" >-</option>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
            </select></div>
  <div class="row1"><input type="checkbox" name="Standard_Supplies[]" value="T_Shirts" />T-Shirts <select name="T_Shirts_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
      <option value="2500">2500</option>
      <option value="3000">3000</option>
      <option value="3500">3500</option>
      <option value="4000">4000</option>
      <option value="4500">4500</option>
      <option value="5000">5000</option>
  </select></div>
  </fieldset>
<br>
   <fieldset><legend>No Worries - Flyers</legend>
            <div class="row1"><input type="checkbox" name="No_Worries_Flyers[]" value="ClassFlyer" />Class In Ten Minutes? <select name="ClassFlyer_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
            <div class="row1"><input type="checkbox" name="No_Worries_Flyers[]" value="ApartmentFlyer" />Apartment Hunting? <select name="ApartmentFlyer_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
            <div class="row1"><input type="checkbox" name="No_Worries_Flyers[]" value="RoommateFlyer" />Roommate Hasn't Paid Up? <select name="RoommateFlyer_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
  <div class="row1"><input type="checkbox" name="No_Worries_Flyers[]" value="RentsFlyer" />'Rents Cramping Your Style? <select name="RentsFlyer_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
      <option value="2500">2500</option>
      <option value="3000">3000</option>
      <option value="3500">3500</option>
      <option value="4000">4000</option>
      <option value="4500">4500</option>
      <option value="5000">5000</option>
  </select></div>
  </fieldset>
<br>
   <fieldset><legend>No Worries - Posters</legend>
            <div class="row1"><input type="checkbox" name="No_Worries_Posters[]" value="ClassPoster" />Class In Ten Minutes? <select name="ClassPoster_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
            <div class="row1"><input type="checkbox" name="No_Worries_Posters[]" value="ApartmentPoster" />Apartment Hunting? <select name="ApartmentPoster_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
            <div class="row1"><input type="checkbox" name="No_Worries_Posters[]" value="RoommatePoster" />Roommate Hasn't Paid Up? <select name="RoommatePoster_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
  <div class="row1"><input type="checkbox" name="No_Worries_Posters[]" value="RentsPoster" />'Rents Cramping Your Style? <select name="RentsPoster_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
      <option value="2500">2500</option>
      <option value="3000">3000</option>
      <option value="3500">3500</option>
      <option value="4000">4000</option>
      <option value="4500">4500</option>
      <option value="5000">5000</option>
  </select></div>
  </fieldset>
<br>
   <fieldset><legend>No Worries - Banners</legend>
            <div class="row1"><input type="checkbox" name="No_Worries_Banners[]" value="ClassBanner" />Class In Ten Minutes? <select name="ClassBanner_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
            <div class="row1"><input type="checkbox" name="No_Worries_Banners[]" value="ApartmentBanner" />Apartment Hunting? <select name="ApartmentBanner_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
            <div class="row1"><input type="checkbox" name="No_Worries_Banners[]" value="RoommateBanner" />Roommate Hasn't Paid Up? <select name="RoommateBanner_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
  <div class="row1"><input type="checkbox" name="No_Worries_Banners[]" value="RentsBanner" />'Rents Cramping Your Style? <select name="RentsBanner_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
      <option value="2500">2500</option>
      <option value="3000">3000</option>
      <option value="3500">3500</option>
      <option value="4000">4000</option>
      <option value="4500">4500</option>
      <option value="5000">5000</option>
  </select></div>
  </fieldset>
<br>
   <fieldset><legend>No Worries - Postcards</legend>
            <div class="row2"><input type="checkbox" name="No_Worries_Postcards[]" value="ClassPostcard" />Class In Ten Minutes? <select name="ClassPostcard_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
            <div class="row2"><input type="checkbox" name="No_Worries_Postcards[]" value="ApartmentPostcard" />Apartment Hunting? <select name="ApartmentPostcard_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
            <div class="row2"><input type="checkbox" name="No_Worries_Postcards[]" value="RoommatePostcard" />Roommate Hasn't Paid Up? <select name="RoommatePostcard_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
                <option value="2500">2500</option>
                <option value="3000">3000</option>
                <option value="3500">3500</option>
                <option value="4000">4000</option>
                <option value="4500">4500</option>
                <option value="5000">5000</option>
            </select></div>
  <div class="row2"><input type="checkbox" name="No_Worries_Postcards[]" value="RentsPostcard" />'Rents Cramping Your Style? <select name="RentsBanner_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
      <option value="2500">2500</option>
      <option value="3000">3000</option>
      <option value="3500">3500</option>
      <option value="4000">4000</option>
      <option value="4500">4500</option>
      <option value="5000">5000</option>
  </select></div>
  <div class="row2"><input type="checkbox" name="No_Worries_Postcards[]" value="ForeignPostcard" />Foreign City?<select name="ForeignPostcard_quantity"><option value="0" >-</option><option value="500">500</option><option value="1000">1000</option><option value="1500">1500</option><option value="2000">2000</option>
      <option value="2500">2500</option>
      <option value="3000">3000</option>
      <option value="3500">3500</option>
      <option value="4000">4000</option>
      <option value="4500">4500</option>
      <option value="5000">5000</option>
  </select></div>
  </fieldset>
<br>
<br>
<input type="submit" name="Submit" id="Submit" value="Submit"> 
</form>
</body>
</html>

Open in new window

0
Comment
Question by:natsully
  • 3
  • 2
5 Comments
 
LVL 82

Expert Comment

by:hielo
ID: 22682427
>>Can images be placed inside fieldsets?
Yes

>>How can I add thumbnails of my products?

<div><input ...><br/>
<img src="yourimage.gif" widh="50" height="50"/><br/>
<select>...</select></div>

Open in new window

0
 
LVL 82

Accepted Solution

by:
hielo earned 2000 total points
ID: 22682440
as an example, here's the first item:
            <div class="row1">
		  	<input type="checkbox" name="Standard_Supplies[]" value="RateSheet" />Ratesheet<br/>
			<img src="http://images.experts-exchange.com/xp/images/expertTools.png" alt="" width="50" height="50"><br/> 
		  	<select name="RateSheet_quantity"><option value="0"  >-</option>
		  		<option value="500">500</option>
		  		<option value="1000">1000</option>
		  		<option value="1500">1500</option>
		  		<option value="2000">2000</option>
            		<option value="2500">2500</option>
            		<option value="3000">3000</option>
            		<option value="3500">3500</option>
            		<option value="4000">4000</option>
            		<option value="4500">4500</option>
            		<option value="5000">5000</option>
            	</select>
		  </div>

Open in new window

0
 

Author Comment

by:natsully
ID: 22682574
that's the code I was using, I guess I just didn't have it in the right spot?
Thanks again!
0
 

Author Closing Comment

by:natsully
ID: 31504832
Thanks again!
0
 
LVL 82

Expert Comment

by:hielo
ID: 22684321
you are welcome
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
This holiday season, we’re giving away the gift of knowledge—tech knowledge, that is. Keep reading to see what hacks, tips, and trends we have wrapped and waiting for you under the tree.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
This video shows how to quickly and easily deploy an email signature for all users in Office 365 and prevent it from being added to replies and forwards. (the resulting signature is applied on the server level in Exchange Online) The email signat…
Suggested Courses
Course of the Month16 days, 5 hours left to enroll

850 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question