Solved

See the code here

Posted on 2001-07-11
12
608 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
  • 6
  • 6
12 Comments
 

Author Comment

by:computer1000
Comment Utility
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
Comment Utility
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
Comment Utility
Bebonham: In the first part of your comments, show me the code. How can I submit the form?
0
 
LVL 8

Expert Comment

by:bebonham
Comment Utility
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
Comment Utility
5 to 50
0
 

Author Comment

by:computer1000
Comment Utility
I will test it tonight.
0
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 
LVL 8

Expert Comment

by:bebonham
Comment Utility
thanks for the update,

good luck!
0
 

Author Comment

by:computer1000
Comment Utility
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 50 total points
Comment Utility
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
Comment Utility
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
Comment Utility
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
Comment Utility
glad to see you have it working!!
0

Featured Post

Threat Intelligence Starter Resources

Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

Join & Write a Comment

This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
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…

771 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

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now