We are hosting a PURL site and the variable is at the end: http://mywebpage.com/first.last
Now the client wants a static web page where you go and enter a first and last, then on submit it goes to out PURL site.
Tried this with straight html but it's not going to work. On to ASP.
New to ASP and I'm trying to have a form that has 2 fields, first, last in a link. Here is the form concept:
<form id="form1" name="form1" method="post">
<p>
<label for="1">First Name:</label>
<input type="text" name="first" id="first" />
<label for="2">Last Name:</label>
<input type="text" name="last" id="last" />
</p>
<p><input type="submit" name="3" id="3" onclick="window.open('http://mywebpage.com/first=val1&.&last=val2')"/>
</p>
</form>
Any help to put me on the right tracks would be extremely welcome at this point.
Thank you,
Ed
Try this:
<form id="form1" name="form1" method="GET" action="http://mywebpage.com/" >
Then do a normal submit without onclick and window.open.
action will submit form to that URL, and method="GET" will pass form parameters in a query string.
I'm building a super-simple sign-up form for a mini app and thought it'd be fun to use the browser's built-in HTML5 validations if I could - so I made the text input for the form a type="email" for funsies. Load it up in Chrome (27.0.1453.116) and attempted to enter an invalid email ("lksjdf" or something, you know), and as expected an error message pops up when I attempt to submit. But the unexpected part was the validation message is offset from the text box by about 60 pixels (give or take a few)(note that the email field is active, but the error message appears to point to the password field):
If I remove all styling and just leave the markup, the validation message position is improved, but about the amount of margin and padding that were on the form field:
When I repeat the process in Firefox, the validations show up correctly.
As we're narrowing down the issue, it appears that having an <h1> tag just before the form tag causes the problem to appear - if I remove the <h1> tag then the validation message lines up correctly.
Is this a bug in Chrome? Is there a way I can force Chrome's validation messages to line up with the input correctly? Why would another tag cause it to not line up?
Here's the code so you can test/verify:
<!DOCTYPE html>
<html>
<head>
<title>Sample App | Sign Up</title>
<!-- stripped out styles and js -->
</head>
<body>
<!-- stripped out other irrelevant markup -->
<h1>Sign Up</h1>
<form accept-charset="UTF-8" action="" id="new_user" method="post">
<label for="user_name">Name</label>
<input id="user_name" name="user[name]" size="30" type="text" />
<label for="user_email">Email</label>
<!-- This is the validation test field! -->
<input id="user_email" name="user[email]" size="30" type="email" />
<label for="user_password">Password</label>
<input id="user_password" name="user[password]" size="30" type="password" />
<label for="user_password_confirmation">Confirm Password</label>
<input id="user_password_confirmation" name="user[password_confirmation]" size="30" type="password" />
<input class="btn btn-large btn-primary" name="commit" type="submit" value="Create my account" />
</form>
</body>
</html>
im confused, the w3c validation service seems to be saying that asp.net cannot legally render a hidden field inside a form tag on the page, have a look at this ...
http://validator.w3.org/check?uri=http%3a%2f%2fmotcombegarage%2eco%2euk%2f
from what i can tell it seems to be saying that the following code sample is invalid markup WTF !!!
<html>
<head> ... header stuff ... </head>
<body>
<form method="post" action="" id="ctl01">
<div class="aspNetHidden">
<input type="hidden" name="ctl09_HiddenField" id="ctl09_HiddenField" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTY1NzEyODQ1M2RkJPtW5VtaL7LPuSxnn1JM1yVnOeGAovb8b4b3KShHy4M=" />
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAwKt17cxAr+s9MgFAqjXzJsHz7KyzLpZjYtTK89blY7GgKAElK/5syvVNn4h7rVehcQ=" />
</div>
... other code ...
</form>
</body>
</html>
This presents 2 problems for me if the code is in fact invalid:
This code is generated by the .net framework for handling postbacks so editing it could be a problem
i have no idea what the valid context for a form field should be (lolz)
Is this a bug or have i done something wrong ???
EDIT:
As pointed out by Peter O below I added the missing div tag in my markup ... comparing this to the markup that the validator uses shows that this div whilst present in the markup is apparently not worth validating ... so that kinda changes the question to ... why is it ignoring that div ? ...
Seems a bit odd that you can't put an input tag inside a form tag directly though ... surely thats the point of a form tag, to contain input tags ??
The only way I've seemed to get rid of the message, following the code on your homepage, is to assign a value to the first hidden input
<div class="aspNetHidden">
<input type="hidden" name="ctl09_HiddenField" id="ctl09_HiddenField" value="toverton" />
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTY1NzEyODQ1M2RkJPtW5VtaL7LPuSxnn1JM1yVnOeGAovb8b4b3KShHy4M=" />
</div>
In all liklihood, this is most likely a bug.
The INPUT elements should be placed within a DIV element, like this:
<form ... >
<div>
<input type="hidden" ... />
<input type="hidden" ... />
<input type="hidden" ... />
</div>
</form>
I have the following client side code:
<form action="PhotoStore.aspx" id="form1" method="post" enctype="multipart/form-data">
<div>
<input type="file" id="file"/>
<input type="submit" />
</div>
</form>
With this client side code, how will I access the uploaded file in Photostore.aspx? Request.Files is having a count = 0 :( .? Whats going wrong?
You need to put a name on the input field, or it won't be included in the form data:
<input type="file" name="file"/>
What about
Page.Request.Form["file"]
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">
<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>401</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>NDMI</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.
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.
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
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">
<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>401</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>NDMI</td><td>Note date is missing</td><td>2009.10.15</td>
</tr>
</table><input id="testSubmit" type="submit" />
</div>
</form>
</body>
</html>
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);
Ok solved the crashing, so I put another answer, its because you've copied the source code and used that to create the outline again, I think, as you shouldn't have the hidden input viewstate as part of the page, it gets generated automatically on build. Remove this line and try it
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNjQzMTI3NjU4ZGSW2wNBW3eGztyO+Tftc5BB8A6cMg==" />
</div>
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">
<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><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.