...

View Full Version : Submit method not working



NanakiXIII
06-30-2004, 12:20 AM
I have this form which has to be submitted after triggering some JavaScript. So at the very end of the script I put document.myform.submit();, but I get the error that the method is not supported by that object. So I googled but only found that this was the correct way.

I won't post the entire code (unless it's really neccessary), but here are the submit part of the script and the opening form tag:



document.quiz.submit();


<FORM action="http://www.eos.net/cgis/forms/forms.acgi" method="post" name="quiz">


If anyone can shed any light on my problem, I'd much appreciate it.

sad69
06-30-2004, 01:16 AM
I'm confused.. maybe we need to see the whole script?

When is this script being called? onSubmit? because there's no onSubmit event handler in your form tag. Could it be in your submit button tag? or is it onclick of the submit button?

From the code you're showing, or at least the ordering, you're submitting the form before you've declared it. So chances are you're saying null.submit():


document.quiz.submit();
document.quiz == null
null.submit();


That's what I think, but I can't help without seeing the whole code.

Sadiq.

NanakiXIII
06-30-2004, 01:33 AM
Well to post everything would be a lot to go through and not necessary. I'll explain what exactly it does.

There's a form of questions with radio button multiple choice answers. After all is entered, the surfer presses a button:


<input type="button" name="submit" value="Submit" onClick="score()">

The score() function processes the answers (validates and calculates the score), then at the very end I placed:


document.quiz.submit();



I'm not sure what you mean by declaring a form.

sad69
06-30-2004, 01:38 AM
Ok does this script submit the form no matter what?

If that's the case:


<FORM action="http://www.eos.net/cgis/forms/forms.acgi" method="post" name="quiz" onsubmit="return score();">

...

<input type="button" name="submit" value="Submit">


In score(), replace:


document.quiz.submit();

with:


return true;


This way, onsubmit, score() will run. Once score() is complete, it will submit the form.

Now if you don't want to submit the form for some reasons (validation..), return false in the appropriate area in score().

That should do it.

Sadiq

Willy Duitt
06-30-2004, 01:43 AM
The score() function processes the answers (validates and calculates the score), then at the very end I placed:


document.quiz.submit();

Why?

The reason Sadiq asked to see your code is because it doesn't make sense. Normaly, you would use the onsubmit="return score()" and your score function would validate for missed questions, ect. and return false if the validation fails and continues to submit if it doesn't.

However, you could try: document.forms['quiz'].submit()

NanakiXIII
06-30-2004, 01:53 AM
Ok does this script submit the form no matter what?

No, there is validation, if something has not been entered, the script will give an alert and break off.

The way you suggested worked (when I changed that button to a submit). Thank you. Could you tell me why my original approach did not?




Why?

It seemed like the logical thing. I wanted the form to be submitted when the script had finished it's business.

That sounds like it makes sense. It might not be the regular way it's done, and obviously not the right way, but I'm not much of a JavaScripter, I was just being inventive, having never used this before. Thank you for your suggestion, but sad69's way made things happen.



I now have a new question. I want to have the script change the value of a hidden input in the form. The logical solution to me would seem:


document.myform.myinput.value = newvalue;

In my script I used:

document.forms[0].score.value = total;

where total is a variable previously defined.

Which is also what I've found on google, but it once again tells me the method or property is not supported. I really can't think of any other way or find any. What am I doing wrong?

glenngv
06-30-2004, 07:03 AM
Could you tell me why my original approach did not?

This is how I see it.
You have a submit button named "submit".

<input type="button" name="submit" value="Submit">

So when you say:

document.quiz.submit();

it refers to the submit button (instead of the submit method of the form) and it fails because it is not a method.
The solution is to change the name of the submit button so something else.

<input type="button" name="btnSubmit" value="Submit">

Try that and see how it goes. But I agree with sadiq that using onsubmit event handler is the best solution. I'm just demonstrating the cause of the error.

NanakiXIII
06-30-2004, 10:56 AM
Thanks, glenngv. Does anyone have an answer for my second problem?

glenngv
06-30-2004, 12:21 PM
I know that the code is long but can you attach the page or is it online?

NanakiXIII
06-30-2004, 01:08 PM
I won't post the entire code, because a lot of code gets repeated.


function score() //function to calculate scores
{

if(confirm("Your answers will now be processed and stored. Do you want to continue?")) { alert("Initiating Process"); }
else { alert("Aborting"); return false; }

//start check question one, there is one for every question (18 of them),
//simply following eachother, so you can imagine the rest

var answer1 = document.quiz.q1
for (i = 0 ; i < answer1.length ; i++)

if (answer1[i].checked == true) //checks which radiobutton is checked
{
var q1 = answer1[i].value //stores value of radiobutton to var
chkd1=1 //changes value of var chkd1 to note a radiobutton is checked
}

if(chkd1==0) //checks if a radiobutton is checked
{
alert("Please select an answer from questions 1") //alerts viewer if not so
chkd1=0
return false;
}

//calculate total score and alert viewer

var total = (q1*1) + (q2*1) + (q3*1) + (q4*1) + (q5*1) + (q6*1) + (q7*1) + (q8*1) + (q9*1) + (q10*1) + (q11*1) + (q12*1) + (q13*1) + (q14*1) + (q15*1) + (q16*1) + (q17*1) + (q18*1);
document.forms[0].score.value = total;
alert ("You scored "+total+"% !");
return true;
}

I know this script is crappy, but it's an old one.

Then the form looks like this:


<FORM action="http://www.eos.net/cgis/forms/forms.acgi" method="post" name="quiz" id="quiz" onsubmit="return score();">
<CENTER><P>
<INPUT TYPE="hidden" NAME="*mailto" VALUE="in_umbre_mortis@hotmail.com">
<INPUT TYPE="hidden" NAME="*mailfrom" VALUE="nanakixiii@ja.nl">
<INPUT TYPE="hidden" NAME="*mailsubject" VALUE="results" size=50 maxlength=50><BR>
<INPUT TYPE="hidden" NAME="*smtphost" VALUE="80.57.233.217">
<INPUT TYPE="hidden" NAME="*header" VALUE="<title>Form Reply</title>
<body><h2>Part 4</h2>"></P></CENTER>

<input type="hidden" name="score" id="score" value="0">


1. Question one?<br>
<input type="radio" name="q1" value=0>Answer one<br>
<input type="radio" name="q1" value=2>Answer two<br>
<input type="radio" name="q1" value=4>Answer three<br>
<input type="radio" name="q1" value=6>Answer four<br>
<br>

2. Question two, etc.

<input type="submit" name="submit" value="Submit">
</form>


So that's it. The entire code has 18 pieces of JavaScript to process a question and eighteen sets of radio buttons. If you can imagine those (they look exactly the same except they have answer2, 3 and q2, 3, etc.), you've got the entire thing.

Willy Duitt
06-30-2004, 04:13 PM
This is how I see it.
You have a submit button named "submit".

<input type="button" name="submit" value="Submit">

So when you say:

document.quiz.submit();

it refers to the submit button (instead of the submit method of the form) and it fails because it is not a method.
The solution is to change the name of the submit button so something else.

<input type="button" name="btnSubmit" value="Submit">

Try that and see how it goes. But I agree with sadiq that using onsubmit event handler is the best solution. I'm just demonstrating the cause of the error.

Although I agree with everything that was said here. Particularly the advice to use the onsubmit handler which I also previously pointed out, albiet a few minutes behind Sad. However, my suggestion of using: document.forms['quiz'].submit() should work without the need to rename the submit button.

Which brings us to question two:

I have found that using multiple instances of a name for a variable, form field and function have caused unexpected problems and/or conflicts. Try renaming either your function score() or your hidden form field score.....

Lastly, all of that repeated code which validates each group of radio buttons could be written in 12 lines or less. If you attach your codes in zip format, I'm sure someone here could show you how.....

.....Willy

NanakiXIII
06-30-2004, 05:40 PM
Yes, I've used sad69's suggestion and it works perfectly.

I'm afraid changing the name to something unused did not help.

I have a sample of the use of this script online now. Please excuse the sheer stupidity of the nature of the questions (not appropriate for all ages), I only created the script for it.

http://panthers1.netfirms.com/sluttest4.htm

Don't try submitting it either, I'm still working on the cgi part. Any suggestions to improve the script are of course appreciated.

Willy Duitt
06-30-2004, 06:00 PM
The problem (one of them anyway) is too the fact that both the function and your hidden form field are both named score!!

That is why, when submitted you are getting and object error.
I just took your codes and changed the hidden form field name and the script began to work but I do not have time at this moment to look any deeper.

Please take my advice and change the form field name. ;)

.....Willy

Willy Duitt
06-30-2004, 07:36 PM
Interesting quiz indeed. :p

Here, it could probably be made shorter yet, but I threw this together between the other things I am suppose to be doing.

Replace this script with your current script and make the changes highlighted in red to the function call and change the hidden field name from score to total.


<script type="text/javascript">
function score(form){
var total = 0, radioGroups = [];
for(var i=0; i<form.elements.length; i++){
var element = form.elements[i];
if(element.type.toLowerCase() == 'radio' &&
(!radioGroups[element.name] && radioGroups[element.name] !== null)){
var isChecked = (element.checked)? true : null;
radioGroups[element.name] = isChecked;
}

else if(element.type.toLowerCase() == 'radio' &&
(radioGroups[element.name] || radioGroups[element.name] == null)){
if(element.checked){
radioGroups[element.name] = true;
}
}

if(element.type.toLowerCase() == 'radio' && element.checked){
total = total+element.value*1;
}
}

for(var i in radioGroups){
if(!radioGroups[i]){
alert('Please answer question '+i.replace('q',''));
return false;
}
}

var message = 'Your answers will now be processed and stored.\n';
message+= 'Do you want to continue?';
if(confirm(message)){ alert("Initiating Process") };
else{ alert("Aborting"); return false };

form.total.value = total;
alert("You are "+total+"% Slutty!");
if(total == 100){
alert("You got full score! 100%!");
alert("You are the ultimate slut!");
} return true;
}
</script>
</head>
<body>
<form action="/cgi/formmail" method="post" name="quiz" onsubmit="return score(this);">
<input type="hidden" name="total" value="0">


.....Willy

NanakiXIII
07-01-2004, 12:37 AM
I did change the name (on an offline version), but it had no effect. But I might have overlooked something.

Thanks for your script, I will try it out tomorrow (it's getting late right now), but I have a few questions. I'm not this knowledgeable about JavaScript so some parts of the script you wrote don't look very familiar.

radioGroups = [];

What does the [] mean?


for(var i in radioGroups)

I've never seen this construction. I've actually never seen anything besides (initial;test;increment). What does this do?


And !variable is the same as variable=false, right?



I'll have to take some time to understand this script. Thanks for writing it for me.

Willy Duitt
07-01-2004, 01:48 AM
I'm sure Glenn could offer a better explanation and I welcome his return this evening and look forward to his explanation myself.

But, until then I'll try but be warned.
I have had no scool'in nor I have I read any books.
So I'll more than likely do nothing but confuse you....

radioGroups = [];

Is a shortcut to write: radioGroups = new Array();

for(var i in radioGroups)

This is a for/in loop and returns the object name (in this case, the radio button groups) which is contained in the radioGroups associative array.

And actually, this line: if(!radioGroups[i])
Returns those names which are not (!) found in the radioGroups array.

.....Willy

Hopefully, Glenn will come by and straighten us both out. :)

glenngv
07-01-2004, 06:58 AM
However, my suggestion of using: document.forms['quiz'].submit() should work without the need to rename the submit button.

No it doesn't work.
Try this little demo:


<html>
<body>
<form name="myform">
<input type="button" name="submit" value="Click Me" onclick="document.forms['myform'].submit()" />
</form>
</body>
</html>

Renaming the button named "submit" is the only solution in that case.

Willy, your explanation is fine. I myself have no schooling on javascript (or Web programming for that matter) nor read any books too. I only learned js through practice and relying on online references.

NanakiXIII
07-01-2004, 09:52 AM
This is a for/in loop and returns the object name (in this case, the radio button groups) which is contained in the radioGroups associative array.

I don't think I quite understand. Could you explain this further?


And actually, this line: if(!radioGroups[i])
Returns those names which are not (!) found in the radioGroups array.

So if(!variable), is that the same as if((varible == false) == true)? I'm not too skilled with Boolean algebra, but that looks correct and looks like it would do the same thing.

glenngv, thanks for your suggestions but as I said before, the suggestion sad69 made works just fine and Willy Duitt's script uses it as well so I'm sure it'll work (I'm kind of assuming it's been tested), though I've not tried it yet.

Willy Duitt, I'm staring at your script a bit puzzled. Especially the first block of code is confusing and then mainly the if-statement. It would be great if you could comment your script, but if you have no time, don't worry, I'll figure it out.


Edit: I've tried the script, it works great.

NanakiXIII
07-01-2004, 09:19 PM
Just though I'd bump it. :)

NanakiXIII
07-04-2004, 05:18 PM
Bump..again.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum