Display image from database

[chabbs]

Hi,

I have my form with some combo box and radio button.

And i need to display an image based on the selections.

I need to display dynamically the image when the selections are made without any submit button.

The image comes from a table where it needs to be retrieved from the selection criteria.

I have my form but i am not able to get the data from the form to display the image.

Can anyone help??

Thanking you.

My page with radio button and combo box

e.g to display maps, selection is 1
My main page.php

<tr id="displayType1" class=hide>
<td><font color="#FFFFFF">
<form name="displayType">
<Input type = 'Radio'
Name ='display' 
value= '1'
onclick="displayMaps();"
id='idMaps'>
Maps
<Input type = 'Radio' 
Name ='display' 
value= '2'
id='idSections'
checked
onclick="displaySection();">
Sections<br>                
<Input type = 'Radio' 
Name ='display' 
value= '3' 
id='idAnimation'
onclick="displayAnimation();">
Animations
</form>
</font>
</td>
<!--the image is displayed in the corresponding td-->
<td>
<img src="bulletinImage.php?id=<php echo $id ?>">
</td>
</tr>

My bulletinImage.php - for the display of the image

<?php
 
$con = mysql_connect("localhost","root","");
if(!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("ocean",$con);
 
//This query is static, its here that i shall put the select query from the data selected on the previous page main.php
 
$query = "SELECT outputMap FROM globalStructure WHERE id = 1";
$result = mysql_query($query) or die('Error, query failed');
//$result = mysql_query($_POST['ScreenResolution']) or die('Error, query failed');
$content=mysql_result($result,0,"outputMap");
//send pdf to requesting page
header("Content-type: outputMap/jpg");
echo $content;
?>

Waiting for your reply
Thanking you.

[Banfa]

Line 17 of My bulletinImage.php, shouldn't that be

header("Content-type: image/jpg");

?

[chabbs]

@Banfa
Ok thank you.

And any idea for the other part of the query?

[chabbs]

I did make some changes in my codes for the display of the image.

Now am getting the image with the selection criteria from the database correctly. But my problem is, i need to have a submit button for the image to be shown. And in my requirement, i shall not have any submit button, upon selection of the e.g region as shown on the image, i shall have the corresponding image from the database to my screen.

Anybody know how to send these data to the php script without the submit button?

Find below the codes that i have for all pages an using.

- My main.php (page with combo box)

<!-- table row of combo box-->
<tr>
<td><font color="#FFFFFF"><b>Region:</b></font><br>
<form name="region">
<select name="names1" id="names">
<?php
while($fetch = mysql_fetch_assoc($query)){
echo "<option value=".$fetch['id'].">".$fetch['regionName']."</optgroup>";
}
?>
</select>
</form>
</td>
</tr>
.
.
.
.
.
<!--My table data to place image -->
<tr>
<td></td>
<td rowspan='2'>
<?php
echo "<form name=\"formImage\" method=\"post\" >
<input name=\"imageResolution\" id=\"idImageQuery\" type=\"hidden\"/>
<input name=\"ScreenResolution1\" type=\"submit\" value=\"Submit\" onclick=\"imageDetails()\"/>
</form>";
$dataQuery = $_POST['imageResolution'];
$dataQuery = $_POST['imageResolution'];
echo $dataQuery;*/
echo "<img src=\"bulletinImage.php?img={$dataQuery}\">";
?>
</td>
</tr>
 

-Javascript function imageDetails() used in the submit button

function imageDetails() {
//var finalConcat = 'SELECT * FROM globalstructure WHERE';
var region = document.region.names1.value;//id of region e.g = 1
var finalConcat = region+",";
//finalConcat += ' regionId = '+region;
var analysisDate = document.analysisDate.analysisDate1.value;//id of date e.g = 1            
finalConcat += analysisDate+",";
.
.
.
.
return document.formImage.imageResolution.value = finalConcat;
}
 

- My page to get the image from database bulletinImage.php

<?php
$con = mysql_connect("localhost","root","");
if(!$con)
{
die('Could not connect: ' . mysql_error());
}
 
$img = $_REQUEST["img"];
list($region, $date, $displayType, $analysis, $parameter, $depth) = split('[,]', $img);
mysql_select_db("ocean",$con);
 
$query = "SELECT outputMap FROM globalStructure WHERE regionId = ".$region .
" AND analysisDateId = ".$date.
" AND displayStructure = ".$displayType.
" AND analysisType = ".$analysis.
" AND parameter = ".$parameter.
" AND depth = ".$depth.
"";
 
 
//$query = @mysql_query("SELECT * FROM globalStructure WHERE id=" . $img . "");
$result = mysql_query($query) or die('Error, query failed');
//$result = mysql_query($_POST['ScreenResolution']) or die('Error, query failed');
$content=mysql_result($result,0,"outputMap");
//send pdf to requesting page
header("Content-type: image/jpg");
echo $content;
?>        
 

My image is displayed, but only after i click the submit button. And i need to have the image just after i select a region without any button click.

Anybody?? Its urgent. Shall have ended this today.

[anfetienne]

add an onchange="" to the selection boxes...


i've just quickly had a look at it but if you want to do it on selection then use the below on the form fields instead of onclick on a submit button

onchange=\"imageDetails()\"
 

[chabbs]

Hi

Can you please give me the full codes of how to put that onchange in the select section??

<select name="names1" id="names"> 
<?php 
while($fetch = mysql_fetch_assoc($query)){ 
echo "<option value=".$fetch['id'].">".$fetch['regionName']."</optgroup>"; 
} 
?> 
</select>
 

[Banfa]

<select name="names1" id="names" onchange="imageDetails()">
...
</select>
 

[johny10151981]

you can try this
onchange call a the function that would send your selected data to a certain php page. Send data as post method or get method. and the php page will process all the data and return a formatted message that will describe
1. return the successful message and also return the name of the required file name querying from database
or
2. failure message.

after getting successful message simply assign the img src with the returned image name with qualified path.
do it all using AJAX. its simple

[anfetienne]

he already has his function that works and only needs to use it in a onchange... there is no need for him to write an ajax code

[chabbs]

How can i post my data in another php page if i didnot use the submit button below?

[code]
<?php
echo "<form name=\"formImage\" method=\"post\" >
<input name=\"imageResolution\" id=\"idImageQuery\" type=\"hidden\"/>
<input name=\"ScreenResolution1\" type=\"submit\" value=\"Submit\" onclick=\"imageDetails()\"/>
</form>";
$dataQuery = $_POST['imageResolution'];
echo "<img src=\"bulletinImage.php?img={$dataQuery}\">";
?>
[code]