Menu
Hi,
How can I check if a file added to a (<input type=”file” name=”add_image”>) form object is it really an image? I mean, for instance a ‘jpg’, ‘jpeg’ or ‘mpeg’ format.
And, Is it possible to erase the content of the (<input type=”file” name=”add_image”>) text field? I tried with ‘document.form_newOffer.add_image.value = “”;’ but it doesn’ t erase the content of the text field. Simply nothing happens.
The function that I am trying to write, will do this:
The user will click the ‘Examine’ button to add an image file, immediately after that, a little image sample of the image file added will be displayed below the form object. Then, if the user tries to add another file type, for instance a ‘.doc’ file, an alert will appear saying ‘you must add an image file’, the text field content (where the path is) will be erased, the sample image will be erased, and the previous cached image (show_Image.src) will be erased.
The code that I am trying to add is in bold, the rest of the code works fine without the part in bold:
[code]
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
<html>
<head>
<script language=”JavaScript”>
function showImg() {
[B]
if (document.form_newOffer.add_image.value = ‘an image file, jpg, jpeg or mpeg’) {[/B]
show_Image = new Image()
show_Image.src = document.form_newOffer.add_image.value
document.getElementById(“td_image”).innerHTML = “<img src='” + show_Image.src + “‘ name=’image_p’ width=’80’ height=’58’>”;
[B]
} else {
alert(“You must add an image file!”);
document.form_newOffer.add_image.value = “”; // I want to erase the text field content.
document.getElementById(“td_image”).innerHTML = “”; // I want to erase the sample image.
if (typeof show_Image != ‘undefined’) {
show_Image.src = “”; // I want to erase the previous image set in memory if it was set
}
}
[/B]
}
</script>
<title>Documento sin título</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
</head>
<body>
<form name=”form_newOffer”>
<table width=”626″ height=”114″ border=”0″ cellspacing=”0″>
<tr>
<td width=”139″>Add a product image:</td>
<td width=”273″><input type=”file” name=”add_image” onChange=”return showImg();”> </td>
<td width=”208″> </td>
</tr>
<tr>
<td> </td>
<td rowspan=”3″ id=”td_image”> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
</form>
</body>
</html>
Thank you