Display Different Rows

[searls03]

I have forms that are created using a php loop. What I need to know how to do is form the loop so that after the 80% of the width of the scree is filled with this form:

<form class="responseForm<?php echo $id; ?>" action="javascript:parseResponse<?php echo $id; ?>()" name="responseForm<?php echo $id; ?>"> 

       <input type="hidden" name="hiddenField" id="hiddenField" value="<?php echo $product; ?>" />
       <input type="hidden" name="hiddenField2<?php echo $id; ?>" id="hiddenField2<?php echo $id; ?>" class="hiddenField2<?php echo $id; ?>" value="<?php echo $id; ?>" />
       <input type="hidden" name="hiddenField1" id="hiddenField1" value="<?php echo $price; ?>" />
     <input type="submit" name="submit" class="submit" value="<?php echo $final1; ?>" style="left: 0px; background-color:lightgreen; height:70px; width:100px;">   </form>  

it will then line break and move to the next line, but I need the buttons being placed all the way together.

 

-----------------------------------------------------------------

form1form2form3form4form5form6 |

form7form8form9form10form11form12 |

form13form14form15form16form17form18 |

-----------------------------------------------------------------

 

something kindof like that. any help?

[Barand]

Use your CSS to set form widths to approx 12% and float:left

[searls03]

is there any specific loop I need to use? while? or any other?

[Barand]

you are already using a loop, aren't you?

 

You may want to enclose all the forms in a DIV with width 80% to constrain them. Otherwise you will need to maintain a count and force a new row every 6 forms.

Edited November 18, 2012 by Barand

[searls03]

ok, ill give it a try

[searls03]

so I got the width correct, but now I can't seem to get them to display so that there is no space between rows:

<style>
#uno {
width:80%; 
}
.responseForm{
width:10%;
float:left;
}

</style>

<div id="uno"> 
   <?php
$sql = mysql_query("SELECT * FROM products where category='retail' and subcategory='Main Retail' and city='$city'");


       while($row = mysql_fetch_assoc($sql)){
$product = $row["product"];
$id =$row["id"];
$price =$row["price"];
$text = $product;
$newtext = wordwrap($text, 14);
$final1 ="".$newtext."
$".$price."";    
if ($count % 5 == 0)
?><form class="responseForm"  action="javascript:parseResponse<?php echo $id; ?>()" id="responseForm<?php echo $id; ?>"> 

       <input type="hidden" name="hiddenField<?php echo $id; ?>" id="hiddenField" value="<?php echo $product; ?>" />
       <input type="hidden" name="hiddenField2<?php echo $id; ?>" id="hiddenField2<?php echo $id; ?>" class="hiddenField2<?php echo $id; ?>" value="<?php echo $id; ?>" />
       <input type="hidden" name="hiddenField1<?php echo $id; ?>" id="hiddenField1" value="<?php echo $price; ?>" />
     <input type="submit" name="submit" class="submit" value="<?php echo $final1; ?>" style="left: 0px; background-color:lightgreen; height:70px; width:100px;"></form>  
<?php
   }
   ?>
</div>

[searls03]

ok, I decided to use this because of some issues the other was having. this is still displaying a blank line between buttons. how can I remove it?

<?php
$sql = mysql_query("SELECT * FROM products where category='retail' and subcategory='Main Retail' and city='$city'");
   $i = 0;
   echo "
   <table width='50%' cellpadding='0px' cellspacing='0px'><tr>";

       while($row = mysql_fetch_assoc($sql)){
$product = $row["product"];
$id =$row["id"];
$price =$row["price"];
$text = $product;
$newtext = wordwrap($text, 14);
$final1 ="".$newtext."
$".$price."";   
echo "<td>";

?>
<form class="responseForm"  action="javascript:parseResponse<?php echo $id; ?>()" id="responseForm<?php echo $id; ?>"> 

       <input type="hidden" name="hiddenField<?php echo $id; ?>" id="hiddenField" value="<?php echo $product; ?>" />
       <input type="hidden" name="hiddenField2<?php echo $id; ?>" id="hiddenField2<?php echo $id; ?>" class="hiddenField2<?php echo $id; ?>" value="<?php echo $id; ?>" />
       <input type="hidden" name="hiddenField1<?php echo $id; ?>" id="hiddenField1" value="<?php echo $price; ?>" />
     <input type="submit" name="submit" class="submit" value="<?php echo $final1; ?>" style="left: 0px; background-color:lightgreen; height:70px; width:100px;"></form>  
<?php
echo "</td>";
if ($i && $i%10 ==9) echo '</tr><tr>';
     $i++;
   }

   echo "</table> ";
   ?>

[Barand]

I didn't have your db data so I just used a for loop. Is this close?

 

<style>
#uno {
width:80%; 
}
.responseForm{
width:15%;
float:left;
margin:0;
padding:0
}

</style>

<div id="uno"> 
<?php
for ($i=0; $i<20; $i++) {
$product = "gfcc cfcufjg jgfjgfcgfc";
$id =1;
$price =1.99;
$text = $product;
$newtext = wordwrap($text, 14);
$final1 ="$newtext\n\$$price";   

echo <<< FRM
<form class="responseForm"  action="javascript:parseResponse($id)" id="responseForm$id"> 
<input type="hidden" name="hiddenField$id" id="hiddenField$id" value="$product" />
<input type="hidden" name="hiddenField2$id" id="hiddenField2$id" value="$id" />
<input type="hidden" name="hiddenField1$id" id="hiddenField1$id" value="$price" />
<input type="submit" name="submit" class="submit" value="$final1" style="background-color:lightgreen; height:70px; width:100%;">
</form>
FRM;
}
?>
</div>

[searls03]

I need to actually use a table now because my code is set inside a spry tabbed pannels. and using the div option was causing troubles for me. is there anyway to get the second code I posted to work?