Forum Moderators: open
i am making an image gallery where people can pick the details of the image that they want and then click a button and based on the values that are entered they will download the appropriate image
so i have this form...
with 6 radio buttons and a submit button...
O - 72 dpi
O - 150 dpi
O - 300 dpi
O - color
O - black
O - white
(Submit)
...so then the idea would be if they select a size (150 dpi) and a color (black), upon clicking submit, they would download that proper file, say image1_150_blk.jpg for example
i dont think it is too hard but yea i dont really know a whole lot of javascript so i could be wrong...but its a fun little project and i would sooo appreciate it if anyone has a script for this, or if you know what you would call this so i could search for it! i would greatly appreciate ANY advice!
thank you thank you thank you in advance!
<!doctype html public "-//w3c//dtd html 3.2//en">
<html>
<head>
<script>
var optQuality
var optColor
var formatfunction checkvalue(format)
{
quality = optQuality
color = optColor
alert ( 'You have requested ' + format+quality+color )
}
</script>
</head>
<body>
<form name="frm" >
72 dpi: <input type="radio" name="dpi" onClick="optQuality=72"><br>
150 dpi: <input type="radio" name="dpi" onClick="optQuality=150"><br>
300 dpi : <input type="radio" name="dpi" onClick="optQuality=300"><br>
color black: <input type="radio" name="colore" onClick="optColor='Black'"><br>
color white: <input type="radio" name="colore" onClick="optColor='White'"><br>
color color: <input type="radio" name="colore" onClick="optColor='Color'"><br>
</form>
<input type="submit" value="Submit" onClick = "checkvalue('jpg')">
</body>
</html>
how do i get them to download an image based on that input instead of getting an alert box? or both even...like have the alert pop up and then upon clicking ok or cancel the image would popup a save as dialog or cancel
like
if the input is: gif, 150 dpi, and black then they should download: logo-150-blk.gif
if the input is: gif, 150 dpi, and white then they should download: logo-150-wht.gif
if the input is: gif, 72 dpi, and black then they should download: logo-72-blk.gif
etc.
do i use something like..
location = "images/logo-150-blk.gif"
?
i m really unsure about this stuff but i would greatly appreciate any help! thank you thank you!
rock on!
<html>
<head>
<title></title>
<script language="JavaScript">
function img_dl() {
var full_path_to_image_dir = '/pictures/';
// get the dpi value
for (var i=0; i < document.imagedl.dpi.length; i++)
{
if (document.imagedl.dpi[i].checked)
{
var dpi = document.imagedl.dpi[i].value;
}
}
// get the color value
for (var i=0; i < document.imagedl.color.length; i++)
{
if (document.imagedl.color[i].checked)
{
var color = document.imagedl.color[i].value;
}
}
// make a file path
var file = full_path_to_image_dir + document.imagedl.imgname.value + '_' + dpi + '_' + color + '.jpg';
window.location = file;
}
</script>
</head>
<body>
<form name="imagedl">
<input type="radio" name="dpi" value="72" checked> 72<br>
<input type="radio" name="dpi" value="150"> 150<br>
<input type="radio" name="dpi" value="300"> 300<br><br>
<input type="radio" name="color" value="color" checked> Color<br>
<input type="radio" name="color" value="black"> Black<br>
<input type="radio" name="color" value="white"> White<br>
<input type="hidden" name="imgname" value="name_of_your_picture">
<input type="button" value="Download" onClick="img_dl();">
</form>
</body>
</html>
