Solved

Adding Images in Form Fieldsets

Posted on 2008-10-09
5
222 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 500 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

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
This article discusses how to create an extensible mechanism for linked drop downs.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
The viewer will learn how to count occurrences of each item in an array.

912 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

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now