?
Solved

See the code here

Posted on 2001-07-11
12
Medium Priority
?
649 Views
Last Modified: 2011-10-03
I am trying to submit the form to the particular asp page. If the customer uploads image that ends in .jpg, it should take to newphoto.asp
<form method="POST" action="newphoto.asp" enctype="multipart/form-data" id=form1 name=form1>
. Otherwise, the customer gets the error.

The below code is fine. But, when I tested upload an image that ends in .gif, I clicked on the 'Upload a Photo' button. It's nothing and does not take me to the asp page..

How to fix it? I have only 5 points right now. But, I promise you that you will get 50 or more points for solving this.


<SCRIPT language="JavaScript">
<!-- Hide script from older browsers

extArray = new Array(".gif", ".jpg", ".png");

function LimitAttach(form, file) {
allowSubmit = false;
if (!file) return;
while (file.indexOf("\\") != -1)
file = file.slice(file.indexOf("\\") + 1);
ext = file.slice(file.indexOf(".")).toLowerCase();
for (var i = 0; i < extArray.length; i++) {
if (extArray[i] == ext) { allowSubmit = true; break; }
}
if (allowSubmit) form.submit();
else
alert("Please only upload files that end in types:  "
+ (extArray.join("  ")) + "\nPlease select a new "
+ "file to upload and submit again.");
}
//  End -->
</script>

<body>


   Click "Browse" to choose the photo from your computer.<BR>
   Please upload only images that end in:  
   <script> document.write(extArray.join("  "));
   </script><BR>
   Then click "Upload Your Photo" to upload it


<form method="POST" action="newphoto.asp" enctype="multipart/form-data" id=form1 name=form1>
<input type="file" name="UploadForm" size="30"><BR><BR>
<input type="button" name="submit" value="Upload Your Photo!" onclick="LimitAttach(this.form, this.form.UploadForm.value)">

0
Comment
Question by:computer1000
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 6
12 Comments
 

Author Comment

by:computer1000
ID: 6274209
I will go to the Community Support to ask for deleting a few questions that I have solved.
0
 
LVL 8

Expert Comment

by:bebonham
ID: 6274400
fixed problems:

1.
submit cannot be the name of an element on your form if you want to use the submit() method of the form.

javascript will always think you are talking about the button, and not the action of submitting the form (thanks CJS)

2.

let's use lastIndexOf, that's what it is there for :)



<HTML>
  <HEAD><SCRIPT LANGUAGE="JavaScript">
<!-- Hide script from older browsers

extArray = new Array(".gif", ".jpg", ".png");


function LimitAttach(form, file) {
allowSubmit = false;
if (!file) return;
filename=file.substring(file.lastIndexOf('\\')+1,file.length-4)
ext=(file.substr(file.length-4,4))
for(i=0;i<extArray.length;i++){
if (extArray[i] == ext) { allowSubmit=true}
}
if (allowSubmit) form.submit()
else
alert("Please only upload files that end in types:  "
+ (extArray.join("  ")) + "\nPlease select a new "
+ "file to upload and submit again.");
}
//  End -->
</SCRIPT>
      <TITLE></TITLE>
  </HEAD>
  <BODY>
      <P>Click "Browse" to choose the photo from your computer.<BR> Please upload
          only images that end in: <SCRIPT> document.write(extArray.join("  "));
  </SCRIPT><BR> Then click "Upload Your Photo" to upload
          it </P>
      <FORM METHOD="POST" ACTION="newphoto.asp" ENCTYPE="multipart/form-data"
       ID="form1" NAME="form1"> <INPUT TYPE="file" NAME="UploadForm"
          SIZE="30"><BR><BR>
          <INPUT TYPE="button" NAME="submit1" VALUE="Upload Your Photo!"
           ONCLICK="LimitAttach(this.form, this.form.UploadForm.value)"> </FORM></BODY>
</HTML>


Bob
0
 

Author Comment

by:computer1000
ID: 6274450
Bebonham: In the first part of your comments, show me the code. How can I submit the form?
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 8

Expert Comment

by:bebonham
ID: 6274545
you had it right...

but you had a button "Upload Your Photo!"

that was called submit.

I have changed it's name to submit1

that was the only real problem, (aside from my other suggestions)


the code was correct, it was the naming of the elements in the form that was problematic.

Bob
0
 

Author Comment

by:computer1000
ID: 6274791
5 to 50
0
 

Author Comment

by:computer1000
ID: 6274794
I will test it tonight.
0
 
LVL 8

Expert Comment

by:bebonham
ID: 6274896
thanks for the update,

good luck!
0
 

Author Comment

by:computer1000
ID: 6275779
I did change from button to submit. I uploaded photo that ends in GIF and it took me to the asp page. But, if I uploaded photo that ends in TXT and I got the message box and it took me to the asp page. If I got the message box, it should not go anywhere, select another image with GIF or JPG or PNG. Any ideas?
0
 
LVL 8

Accepted Solution

by:
bebonham earned 200 total points
ID: 6276838
okay, the button doesn't have to be submit it just CANNOT be NAMED submit.


I will show two codes, one with a submit button and one with a normal button.

they will both not submit if the alert box pops.




<HTML>
 <HEAD><SCRIPT LANGUAGE="JavaScript">
<!-- Hide script from older browsers

extArray = new Array(".gif", ".jpg", ".png");


function LimitAttach(form, file) {
allowSubmit = false;
if (!file) return;
filename=file.substring(file.lastIndexOf('\\')+1,file.length-4)
ext=(file.substr(file.length-4,4))
for(i=0;i<extArray.length;i++){
if (extArray[i] == ext) { allowSubmit=true}
}
if (allowSubmit) form.submit()
else{
alert("Please only upload files that end in types:  "
+ (extArray.join("  ")) + "\nPlease select a new "
+ "file to upload and submit again.");
return false;
}}
//  End -->
</SCRIPT>
     <TITLE></TITLE>
 </HEAD>
 <BODY>
     <P>Click "Browse" to choose the photo from your computer.<BR> Please upload
         only images that end in: <SCRIPT> document.write(extArray.join("  "));
 </SCRIPT><BR> Then click "Upload Your Photo" to upload
         it </P>
     <FORM METHOD="POST" ACTION="newphoto.asp" ENCTYPE="multipart/form-data"
      ID="form1" NAME="form1"> <INPUT TYPE="file" NAME="UploadForm"
         SIZE="30"><BR><BR>
         <INPUT TYPE="button" NAME="cantbesubmit" VALUE="Upload Your Photo!"
          ONCLICK="return LimitAttach(this.form, this.form.UploadForm.value)"> </FORM></BODY>
</HTML>




this below example is with a submit button instead




<HTML>
 <HEAD><SCRIPT LANGUAGE="JavaScript">
<!-- Hide script from older browsers

extArray = new Array(".gif", ".jpg", ".png");


function LimitAttach(form, file) {
allowSubmit = false;
if (!file) return;
filename=file.substring(file.lastIndexOf('\\')+1,file.length-4)
ext=(file.substr(file.length-4,4))
for(i=0;i<extArray.length;i++){
if (extArray[i] == ext) { allowSubmit=true}
}
if (allowSubmit) form.submit()
else{
alert("Please only upload files that end in types:  "
+ (extArray.join("  ")) + "\nPlease select a new "
+ "file to upload and submit again.");
return false
}}
//  End -->
</SCRIPT>
     <TITLE></TITLE>
 </HEAD>
 <BODY>
     <P>Click "Browse" to choose the photo from your computer.<BR> Please upload
         only images that end in: <SCRIPT> document.write(extArray.join("  "));
 </SCRIPT><BR> Then click "Upload Your Photo" to upload
         it </P>
     <FORM ONSUBMIT="return LimitAttach(this, this.UploadForm.value)" METHOD="POST" ACTION="newphoto.asp" ENCTYPE="multipart/form-data"
      ID="form1" NAME="form1"> <INPUT TYPE="file" NAME="UploadForm"
         SIZE="30"><BR><BR>
         <INPUT TYPE="submit" NAME="submit1" VALUE="Upload Your Photo!"> </FORM></BODY>
</HTML>


hope that helps,

Bob
0
 
LVL 8

Expert Comment

by:bebonham
ID: 6278223
if you use the one with the submit button then this line should be

if (allowSubmit) return true
else{

and not

if (allowSubmit) form.submit()
else{

as I posted it previously.

it will work either way, but technically, it is not right.

Bob
0
 

Author Comment

by:computer1000
ID: 6278468
Bob: I modified your code and it worked fine. Thanks a lot!

<SCRIPT language="JavaScript">
<!-- Hide script from older browsers

extArray = new Array(".gif", ".jpg");

function filetype(form, file) {
allowSubmit = false;
if (!file) return;
while (file.indexOf("\\") != -1)
file = file.slice(file.indexOf("\\") + 1);
ext = file.slice(file.indexOf(".")).toLowerCase();
for (var i = 0; i < extArray.length; i++) {
if (extArray[i] == ext) { allowSubmit = true; }
}
if (allowSubmit) form.submit();
else {
alert("Please only upload files that end in types:  "
+ (extArray.join("  ")) + "\nPlease select a new "
+ "file to upload and submit again.");
return false;
}}
//  End -->
</script>




<p><font face="Arial" size="2" color="#000000"><center>
    Please upload only images that end in:  
      <script>
       document.write(extArray.join("  "));
      </script><BR>
 Click "Browse" to choose the photo from your computer.<BR>
 Then click "Upload Your Photo" to upload it</center></font>
<BR>



<form method="POST" action="newphoto.asp" enctype="multipart/form-data" id=form1 name=form1>
<input type="file" name="UploadForm" size="30"><BR><BR>
<input type="submit" name="submit" value="Upload Your Photo!" onclick=" return filetype(this.form, this.form.UploadForm.value)"></CENTER>
  </form>
0
 
LVL 8

Expert Comment

by:bebonham
ID: 6278556
glad to see you have it working!!
0

Featured Post

Introducing Priority Question

Increase expert visibility of your issues by participating in Priority Question, our latest feature for Premium and Team Account holders. Adjust the priority of your question to get emergent issues in front of subject-matter experts for help when you need it most.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
This article discusses how to implement server side field validation and display customized error messages to the client.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

741 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question