Page 1 of 1

php layout issues

Posted: Fri Feb 23, 2007 3:16 am
by onead
Hi,

I am developing a website for a car dealership based on script i discovered on the internet.

When the user slects the options to list all the vehicles in stock the current layout is set to display in a table of width 100% one after the other in rows like this:

1
2
3
etc...

what i want to do is display the results in 2 tables of width 50% next to each other on one row and then display on the next row like this:

1 2
3 4
5 etc...

The layout is displayed in a template like this:



Code: Select all

<!--S:ListGroup-->
	<table width="700" >
		{DATA}
	</table>

	{PAGING}
<!--E:ListGroup-->

<!--S:ListEmpty-->
	<tr>
		<td colspan="2" align=center><strong>Sorry, no cars were found matching your criteria. Please search again.</strong></td>
	</tr>
<!--E:ListEmpty-->

<!--S:ListElement-->
<table width="700" border="0" id="car_details">
  <tr>
    <td width="350"><table id="details_table" width="350" height="100%">
      <tr {alternance}>
        <td align="left" valign="top" id="make_model"><a href="details.php?id={CAR_ID}"> {CAR_MAKE} {CAR_MODEL}</a></td>
      </tr>
      <tr {alternance}>
        <td width="225" rowspan="9" align="left" valign="top"><a href="details.php?id={CAR_ID}">{TN_IMAGE}</a> </td>
        <td class="header">Registered<br/>
            <span class="details">{CAR_YEAR}</span></td>
      </tr>
      <tr {alternance}>
        <td class="header">Mileage<br/>
            <span class="details">{CAR_MILEAGE}</span></td>
      </tr>
      <tr {alternance}>
        <td class="header">Transmission<br/>
            <span class="details">{CAR_TRACK}</span></td>
      </tr>
      <tr {alternace}>
        <td class="header">Price<br/>
            <span class="details">&pound;{CAR_PRICE}</span></td>
      </tr>
      <tr {alternance} >
        <td height="34"><a href="details.php?id={CAR_ID}"><img src="images/btn_moredetails.jpg" alt="show more details of this car" border="0" class="more_details" /></a></td>
      </tr>
    </table></td>
  </tr>
</table>
<br/>



<!--E:ListElement-->

<!--S:Alternance1-->
		bgcolor="#302867"
<!--E:Alternance1-->

<!--S:Alternance-->
		bgcolor="#ff0000"
<!--E:Alternance-->


<!--S:Image-->
<img src="{SOURCE}" width="225" />
<!--E:Image-->

while the php file is like this:

Code: Select all

<?php
function DoEvents($that) {
	global $_CONF, $_PAGE, $_TSM , $base;

	$jpp = (int)$that->vars->data["ipp"];

	$_models = $that->db->QFetchRowArray("SELECT * FROM {$that->tables[make]}");
	if (is_array($_models)) {
		foreach ($_models as $key => $var) {
			$models[$var["make_id"]] = $var["make_name"];
		}		
	}
	

	switch ($_GET["sub"]) {

		case "error":
			return $that->templates["error"]->output;
		break;

		case "search":
			$data = $_GET;
			
			if (is_array($_models)) {
				foreach ($_models as $key => $val) {
					if ($val["make_parent"] == 0) {
						$make[$val["make_id"]] = $val["make_name"];

						$js .= "models[{$val[make_id]}] = new Array();\n";
						$i = 1;
						$js .= "models[{$val[make_id]}][" . $i++ ."] = new Option(\"[ select ]\" , \"\"); \n";
						foreach ($_models as $k => $v) {
							if ($v["make_parent"] == $val["make_id"]) {
								$js .= "models[{$val[make_id]}][" . $i++ ."] = new Option(\"{$v[make_name]}\" , \"{$v[make_id]}\"); \n";
							}							
						}						
					}					
				}
			}

			$data["make"] = $base->html->FormSelect("make" , $make, $that->templates["search"] , "Select" , "" , "" , array("ONCHANGE" => "Model(this.value)"));
			$data["script"] = $js;

			$data["model"] = $base->html->FormSelect("model" , $schools, $that->templates["search"] , "Select" , "");
 			

			$that->templates["search"]->blocks["Search"]->Replace($data , false);
			$form = $that->templates["search"]->blocks["Search"]->EmptyVars();


			//check if there was tried a search
			if ($_GET["model"] || $_GET["pf"] || $_GET["pt"] || $_GET["yf"] || $_GET["yt"] || $_GET["make"]) {
				//ok, this was a search

				$query[] =  " car_make= " . (int) $_GET["make"] . " " . ( $_GET["model"] ? " AND car_model = '{$_GET[model]}' " : "" ) ;
				
				if ($_GET["pf"] || $_GET["pt"])
					$query[] = " (car_price >= " . (int) $_GET["pf"] . "" . ($_GET["pt"] ? " AND car_price <= "  . (int) $_GET["pt"] . "" : "")  . ") ";

				if ($_GET["yf"] || $_GET["yt"])
					$query[] = " (car_year >= " . (int) $_GET["yf"] . "" . ($_GET["yt"] ? " AND car_year <= "  . (int) $_GET["yt"] . "" : "")  . ") ";
				
				if (is_array($query)) {
					$page = $_GET["page"] ? ($_GET["page"] - 1) * $jpp : 0;
					$cars = $that->db->QFetchRowArray("SELECT * FROM {$that->tables[cars]} WHERE" . implode(" AND " , $query) . " ORDER BY car_year desc LIMIT $page,$jpp");
					$count = $that->db->RowCount($that->tables["cars"] , "WHERE " . implode(" AND " , $query) . " ");
				} else
					return $form;
			} else 
				return $form;
		break;

		case "details":
			$car = $that->db->QFetchArray("SELECT * FROM {$that->tables[cars]} WHERE car_id='{$_GET[id]}'");
			if (is_array($car)) {
				$car["car_make"] = $models[$car["car_make"]];
				$car["car_model"] = $models[$car["car_model"]];
				$car["car_price"] = number_format($car["car_price"] , 2);
				$car["referer"] = $_SERVER["HTTP_REFERER"] ? $_SERVER["HTTP_REFERER"]  : "list.php";
				$car["name"] = $car["address"] = $car["msg"] = $car["error"] = "";
				$car["id"] = $car["car_id"];

				if ($car["car_tn_image"]) {
					$car["image"] = $that->templates["details"]->blocks["Image"]->Replace(array(
																										"SOURCE" => "upload/car_" . $car["car_id"] . ".jpg",
																										"SOURCE2" => $car["car_image"] ? "href=\"upload/bcar_" . $car["car_id"] . ".jpg\"" : "",
																										"TARGET" => $car["car_image"] ? " target=\"_new\" " : ""
					
																									));				
				} else {
					$car["image"] = "";
				}			

				$car["contact_form"] = $that->templates["details"]->blocks["Contact"]->Replace($car);

				//read the images if are any to read
				$images = $that->db->QFetchRowArray("SELECT * FROM {$that->tables[photos]} WHERE car='{$_GET[id]}'");
				if (is_array($images)) {
					foreach ($images as $key => $image) {
						$images["$key"]["source"] = $image["image"] ? "upload/photo_" . $image["id"] . ".jpg" : "upload/tn_photo_" . $image["id"] . ".jpg";
						$images["$key"]["source1"] = $image["tn"] ? "upload/tn_photo_" . $image["id"] . ".jpg" : "upload/photo_" . $image["id"] . ".jpg";
					}
					
					$images = $base->html->Table($that->templates["details"],"List",$images);			
				} else 
					$images = "";
				

				return $that->templates["details"]->blocks["Main"]->Replace($car) .  $images;	
			} else {
				header("Location: error.php");
				exit;
			}					
		break;

		case "send":

		if ($_SERVER["REQUEST_METHOD"] == "POST") {
				if ($_POST["name"] && $_POST["address"] && $_POST["msg"]) {

				$car = $that->db->QFetchArray("SELECT * FROM {$that->tables[cars]} WHERE car_id='{$_POST[id]}'");
				$car["car_make"] = $models[$car["car_make"]];
				$car["car_model"] = $models[$car["car_model"]];
				$car["car_price"] = number_format($car["car_price"] , 2);

					$msg = $_POST["msg"] . "\n" . 
							"\n\nPersonal Details:\n"	.
							"	Name: {$_POST[name]}\n" . 
							"	Email: {$_POST[address]}\n" .
							"   Telephone Number: {$_POST[telephone]}\n" . 							
							"\n\nCar Details:\n" .
							"	Make & Model: {$car[car_make]} {$car[car_model]} \n" . 
							"	Year: {$car[car_year]} \n" . 
							"	Price: £{$car[car_price]} \n" . 
							"	Mileage: {$car[car_mileage]} \n" . 
							"	Transmission: {$car[car_track]} \n" .
							($that->vars->data["mail_link"] ? "	Original Link to car on Alexanders website: http://" . $_SERVER["SERVER_NAME"] . dirname($_SERVER["SCRIPT_NAME"]) . "/details.php?id={$_POST[id]}" : "");

					$headers  = "MIME-Version: 1.0\n"; 
					$headers .= "Content-type: text/plain\n"; 
					$headers .= "From: $_POST[name] <{$_POST[address]}>\n"; 
					$headers .= "Reply-to: $_POST[name] <{$_POST[address]}>\n"; 
					//mailing the email
					
					@mail( $that->vars->data["mail_address"] , $that->vars->data["mail_title"], $msg, $headers);

					return $that->templates["details"]->blocks["Thanks"]->Replace($_POST);


				} else {
					$_POST["error"] = "Please fill in all the fields!";
					$_POST["car_id"] = $_POST["id"];
					return $that->templates["details"]->blocks["Contact"]->Replace($_POST);
				}				
				
			} else {
				header("Location: error.php");
				exit;
			}
			
		break;

		default:
			$page = $_GET["page"] ? ($_GET["page"] - 1) * $jpp : 0;
			$cars = $that->db->QFetchRowArray("SELECT * FROM {$that->tables[cars]} ORDER BY car_id desc LIMIT $page , $jpp ");
			$count = $that->db->RowCount($that->tables["cars"] , "");
		break;		
	}
	
	$alternance = 1;

	if (is_array($cars)) {

		foreach ($cars as $key => $val) {

			$cars[$key]["car_make"] = $models[$val["car_make"]];
			$cars[$key]["car_model"] = $models[$val["car_model"]];
			$cars[$key]["car_price"] = number_format($val["car_price"] , 2);

			//also add the alternance template
			$cars[$key]["alternance"] = $that->templates["list"]->blocks["Alternance" . $alternance]->output;

			if ($val["car_tn_image"]) {
				$cars[$key]["tn_image"] = $that->templates["list"]->blocks["Image"]->Replace(array(
																									"SOURCE" => "upload/car_" . $val["car_id"] . ".jpg",
																									"SOURCE2" => $val["car_image"] ? "href=\"upload/bcar_" . $val["car_id"] . ".jpg\"" : "",
																									"TARGET" => $val["car_image"] ? " target=\"_new\" " : ""
				
																								));				
			} else {
				$cars[$key]["tn_image"] = "";
			}			
			//switch
			$alternance = !$alternance;
		}		
	}

	if (is_array($_GET)) {
		foreach ($_GET as $key => $val) {
			if ($key != "page") 
				$out[] = "$key=" . urlencode($val);
		}
		$extra = is_array($out) ? implode("&" , $out) . "&" : "";
	}
	

	return $form . $base->html->Table($that->templates["list"],"List",$cars,true,$count,$jpp,$_GET["page"],$that->templates["paging"],array(
																																		"base" => in_array($_GET["sub"] , array ("search")) ? $_GET["sub"] . ".php" : "list.php" ,
																																		"extra" => $extra,
																																		"what" => $_GET["what"] ? "what=" . $_GET["what"] . "&" : ""
																																	));
 
}
?>
any help would be very musch appreciated as i have tried various methods which have not resulted in the layout i require

many thanks in advance

Posted: Fri Feb 23, 2007 3:44 am
by onion2k
I'd do this using 50% width floating divs ... eg

Code: Select all

<style>.item { float: left; width: 50%; margin-right: -1px; } </style>
<div class="item">This is an item!</div>
<div class="item">This is an item!</div>
<div class="item">This is an item!</div>
<div class="item">This is an item!</div>
<div class="item">This is an item!</div>
<div class="item">This is an item!</div>
<div class="item">This is an item!</div>
Technically you only need apply the margin-right bit to every other item, and only in IE6, but it's much simpler to apply it to everything.

Posted: Fri Feb 23, 2007 3:49 am
by onead
Thank you for the reply, but the problem i am having is getting the php to display 2 results per row then drop down to the next row.

how or where abouts would i apply the margin right bit to every other item

sorry if i'm being a bit stupid but i'm fairly new to php!

thanks

Posted: Fri Feb 23, 2007 5:15 am
by onion2k
onead wrote:Thank you for the reply, but the problem i am having is getting the php to display 2 results per row then drop down to the next row.
Try the code I posted. It does that.
onead wrote:how or where abouts would i apply the margin right bit to every other item
You really don't need to.

Posted: Fri Feb 23, 2007 5:49 am
by pips
I've taken the code, and added a background colour into the div so that I could see how the right hand margin worked.

If you then apply a <span> tag and specify a width in there, it should give you two colums etc. :-

Code: Select all

<style>.item { float: left; width: 150px; margin-right: 10px; background-color:yellow; } </style> 
<span style="width:320px;">
<div class="item">1</div> 
<div class="item">2</div> 
<div class="item">3</div> 
<div class="item">4</div> 
<div class="item">5</div> 
<div class="item">6</div> 
<div class="item">7</div> 
<div class="item">8</div> 
<div class="item">9</div> 
<div class="item">10</div> 
</span>
The overall width was calculated by (width + right margin) multiplied by the number of columns required.

Hope this helps,
Phil.

Posted: Fri Feb 23, 2007 6:53 am
by onead
Thanks Phil i'll give that a try

Posted: Fri Feb 23, 2007 7:11 am
by Begby
You can also split the results into two arrays, one odd items, the other even, the loop through them like

Code: Select all

for( $i=1; $i<count($odd); $i++)
{
   echo $odd[$i]. ' '.$even[$i].'<br />' ;
}