tags:

views:

246

answers:

6
Q: 

Javascript/DOM Why is does my form not support submit()?

This is my first time working with asp.net and javascript, so I don't know a lot of the nice web resources, or much about debugging javascript. I'm looking to find out why on line oFormObject.submit(); Microsoft JScript runtime error: Object doesn't support this property or method.

I'm using links to function as buttons because I'm terrible at aesthetics and I think links will look more professional than a table of 50 buttons. I read that this solution may cause issues with browsers trying to pre-render my links and causing lots of extra traffic and problems, but the Css I found to make a button look like a link seemed to have alignment and spacing issues.

<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"&gt; 

<html xmlns="http://www.w3.org/1999/xhtml" >
<head><link rel="stylesheet" type="text/css" href="DefectSeverity.css" /><title>
  Defect Severity Assessment Code List
</title></head>
<body>
<form name="form1" method="post" action="CodeList.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNjQzMTI3NjU4ZGSW2wNBW3eGztyO+Tftc5BB8A6cMg==" />
</div>

<div>
<p>Welcome Maslow</p><SCRIPT language="JavaScript">
function submitForm(intId)
{ oFormObject= document.getElementById(""form"+_StrCodeId + @""");
oFormElement= document.getElementById("codeId");
oFormElement.value=intId;
  oFormObject.submit();
}
</SCRIPT> <form method="post" action="CodeAssessment.aspx" id="formcodeId">
<table name="codeId" id="codeId" value="0" type="hidden" class="linkTable">
<tr>
   <th>Completed</th><th>Code</th><th>Description</th><th>Code Present Since</th>
</tr><tr class="row">
<td><input name="401" type="checkbox" value="401" DISABLED /></td><td><a href="javascript:submitForm(0);">401</a></td><td>Missing Original Document/form</td><td>2009.10.16</td>
</tr><tr class="rowAlternate">
<td><input name="NDMI" type="checkbox" checked="checked" value="NDMI" DISABLED /></td>
<td><a href="javascript:submitForm(1);">NDMI</a></td>
<td>Note date is missing</td>    <td>2009.10.15</td>
</tr>
 </table><input type="submit" />
</form>
</div>
</form>
</body>
</html>

If I change the script line to oFormObject= document.forms[0]; it submits the asp.net's viewstate form posting back to the same page instead of where I want to go. so the rest of the code on the page appears to work.

A: 

I'm not really into asp.net but into javascript, so I'd say there's a parse error in 

oFormObject= document.getElementById(""form"+_StrCodeId + @""");

the quotes just don't match. i'd say you try to change it to

oFormObject= document.getElementById("formcodeId");

instead

msparer  2009-10-16 13:51:31
sorry that code is in my asp. so the extra `"` are needed to pass it out as the proper javascript.
Maslow  2009-10-16 13:53:09
A: 

Ok apparently you can't nest forms in html/DOM. I have changed my asp.net provided form and now it navigates but crashes saying

Validation of viewstate MAC failed. If this application is hosted by a Web Farm or cluster, ensure that <machineKey> configuration specifies the same validationKey and validation algorithm. AutoGenerate cannot be used in a cluster. 

<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"&gt; 

<html xmlns="http://www.w3.org/1999/xhtml" >
<head><link rel="stylesheet" type="text/css" href="DefectSeverity.css" /><title>
 Defect Severity Assessment Code List
</title></head>
<body>
<form name="form1" method="post" action="CodeAssessment.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNjQzMTI3NjU4ZGSW2wNBW3eGztyO+Tftc5BB8A6cMg==" />
</div>

<div>
<p>Welcome Maslow</p><SCRIPT language="JavaScript">
function submitForm(intId)
{ oFormObject= document.forms[0];
oFormElement= document.getElementById("codeId");
oFormElement.value=intId;
oFormObject.submit();
}

</SCRIPT> <table name="codeId" id="codeId" value="0" type="hidden" class="linkTable">
<tr>
 <th>Completed</th><th>Code</th><th>Description</th><th>Code Present Since</th>
</tr><tr class="row">
 <td><input name="401" type="checkbox" value="401" DISABLED /></td>
<td><a href="javascript:submitForm(0);">401</a></td><td>Missing Original Document/form</td><td>2009.10.16</td>

</tr><tr class="rowAlternate">
 <td><input name="NDMI" type="checkbox" checked="checked" value="NDMI" DISABLED /></td>
<td><a href="javascript:submitForm(1);">NDMI</a></td><td>Note date is missing</td><td>2009.10.15</td>
</tr>
</table><input id="testSubmit" type="submit" />
</div>
</form>
</body>
</html>
Maslow  2009-10-16 13:59:45
How come you've got your JS mid div? Why not put it in the head tags?
Psytronic  2009-10-16 14:06:13
moved it to the head section. no improvement.
Maslow  2009-10-16 14:44:04
no I know there wouldn't be, thats just more a general comment, I just prefer my code to be in head whereever possible thats all :)
Psytronic  2009-10-16 14:53:53
A: 

I don't see what the issue is now, the code you posted in your answer worked fine for me, only problem I have is that I dont have a CodeAssesment.aspx page so I get a HTML404 error, but thats it. Your original code document.getElementById(""form"+_StrCodeId + @"""); was not valid, and you don't have a variable called StrCodeId,

Try 

oFormObject = document.getElementById("form"+intId);
Psytronic  2009-10-16 14:22:08
try making a blank CodeAssessment.aspx page to recieve the post. `document.getElementById(""form"+_StrCodeId + @""");` is valid in the .aspx.cs file where it resides. private const string _StrCodeId = "codeId";
Maslow  2009-10-16 14:33:42
oh, so you have some CS writing that bit of the page aswell?
Psytronic  2009-10-16 14:36:39
@Psytronic - right, CS is writing that section so that if I need to change the element name, I change it in one place and everywhere else automatically updates.
Maslow  2009-10-16 14:45:07
A: 
Psytronic  2009-10-16 14:42:51
so you were able to reproduce the crash?
Maslow  2009-10-16 14:45:54
yeah, Even if it was a bog standard white page it would produce that error, and then removing that input (and subsquent superfolous div) made it go through fine.I should point out that your page isn't valid with the DOCType you've declared, you might want to look into that
Psytronic  2009-10-16 14:50:36
yeah while you have been trying to figure it out, I've been running through http://validator.w3.org/ to clean it up, and see if that helps. but I don't have an extra <input type="hidden" name="__VIEWSTATE" in my aspx or .cs.
Maslow  2009-10-16 14:55:32
the page it is posting to is basically a blank aspx template page.
Maslow  2009-10-16 14:56:25
Hmmm, ok maybe that was jsut a coincidence with the input then, as it works now when I put it in, it could be to do with the attributes, if you are using VisWebExpress it should highlight them for you. If not the main ones will be the table being hidden and having a value, remove those and try
Psytronic  2009-10-16 14:59:16
The entire table is being dynamically generated via C#. I'm in VS2008 professional. I've now cut out the entire table and I'm still getting the error, posting another answer with the html.
Maslow  2009-10-16 15:02:30
A: 

I trimmed out my dynamic code generation section

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html 
 PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;


<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head><link rel="stylesheet" type="text/css" href="DefectSeverity.css" /><title>
 Defect Severity Assessment Code List
</title><script type="text/javascript">
function submitForm(intId)
{ oFormObject= document.forms[0];
oFormElement= document.getElementById("codeId");
oFormElement.value=intId;
  oFormObject.submit();
}
</script> </head>
<body>
<form name="form1" method="post" action="CodeAssessment.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJMzMxMzk5NjY5ZGTQg8pLRPHaRM4Idd6LyKDmFvMpNA==" />
</div>

<div>
<input type="submit" />
</div>
</form>
</body>
</html>

Hey look there's another div again. I don't see where this is coming from. and I'm still getting Validation of viewstate MAC failed. If this application is hosted by a Web Farm or cluster, ensure that configuration specifies the same validationKey and validation algorithm. AutoGenerate cannot be used in a cluster.

Maslow  2009-10-16 15:05:13
I noticed that there's now no element called codeId. putting one in didn't solve the problem.
Maslow  2009-10-16 15:07:23
bascially that div contains the values of the input elements on the page, so if the page submits to itself you don't have to tell it to display the values from before.
Psytronic  2009-10-16 15:08:24
are you using <asp: input> tags?
Psytronic  2009-10-16 15:11:21
no, just html input
Maslow  2009-10-16 15:16:11
But I bet your form still has the runat="server" tag? :p
Psytronic  2009-10-16 15:17:25
yes, head has runat=server, form has runat=server
Maslow  2009-10-16 15:18:41
That is what is creating the viewstate, what are you planning on doing with the data from the form on the second page?
Psytronic  2009-10-16 15:21:30
Because bascically if you are dealing with it on another page then I don't think you need that tag, as that only deals with post backs (ie form submitting to itself) if say you want a button to change some text on the page (and dont want to use javascript)
Psytronic  2009-10-16 15:23:49
I had no idea what that tag was for. but since it gave it to me by default I assumed it needed to be there for something. removing the runat=server for the form made it work. a work around was to change the recieving page to say EnableViewStateMac="False" in the <%@ Page section. post all this as an answer so I can give you credit. =)
Maslow  2009-10-16 15:27:36
A: 

So we solved this in another answer, but using comments, so this is just incase anyone else has the same problem,

It's all down to the form having a runat="server" attribute, this generates the viewstate input, then when the form is submitted to the second page, it tries to fill out the page with the details from the viewstate, however as in this case the form is submitted to another page, the two pages don't match up and when it tries to deal with the viewstate input it throws the error.

The solution is to either remove the runat="server" attribute on the form, or to set EnableViewStateMac="False" attribute from the second page.

Psytronic  2009-10-17 08:05:34

related questions

Is it better to create Model classes, or just stick with generic database utility class?
What are effective options for embedding video in an ASP.NET web site?
Visual Studio 2008 debugger already attached work-around
Tracking state using ASP.NET AJAX / ICallbackEventHandler
ASP.NET Display SVN Revision Number
ASP.NET URL Rewriting
How can I change the background of a masterpage from the code behind of a content page?
Easy way to AJAX WebControls
How do I define custom web.config sections with potential child elements and attributes for the properties?
ASP.NET MVC "CRUD" Database Sample
Are Multiple DataContext classes ever appropriate?
How to RedirectToAction in ASP.NET MVC without losing request data
Triple Quotes? How do I delimit a databound Javascript string parameter in ASP.NET?
ASP.NET built in user profile, Vs old stile user class/tables
What's a good book for learning ASP?
Bandwith throttling in IIS 6 by IP Address
ASP .Net Custom Client-Side Validation
How to get the value of built, encoded ViewState?
Decent, simple, GIS/mapping component for ASP.NET?
Checklist for IIS 6/ASP.NET Windows Authentication?
How to write to Web.Config in Medium Trust ?
ASP.NET, Visual Studio and Subversion - how to integrate?
Floating Point Number parsing: Is there a Catch All algorithm?
How do I sync the SVN revision number with my ASP.NET web site?
ASP.NET Site Maps