Welcome to Vortx Community Forum, where you can ask questions and receive answers from the staff at Vortx and other members of the community.

If you had a user account on our previous forums website, you will need to register a new account here.

Learn more about...

AspDotNetStorefront
DotFeed

XMLPackage form issue: submit button is reloading the page!

 
Hello,
 
I have a XMLPackage with a simple custom form in it.
The problem is that when I click the button to submit my form it's reloading the page instead. How can I workaround it?
 
Thanks!
 
PS: I am posting below a copy of my code.
 
<?xml version="1.0" standalone="yes" ?>
<package version="2.1" displayname="Simple Form" debug="false" includeentityhelper="true">
	<PackageTransform>
		<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:aspdnsf="http://www.aspdotnetstorefront.com">
			<xsl:output method="html" omit-xml-declaration="yes" />
			<xsl:template name="myform">
				<form action="processform.aspx" method="post">
					<input type="text" name="firstname" />
					<br/>
					<input type="submit" value="Submit form" />
				</form>
			</xsl:template>
			<xsl:template match="/">
				<xsl:call-template name="myform" />
			</xsl:template>
		</xsl:stylesheet>
	</PackageTransform>
</package>
asked Sep 20 in MultiStore by Yan Kleber (1,140 points)
Please see my own answer below...

1 Answer

0 votes
 
Best answer
OK, I think I figured out what is going on AND the solution. The problem is that Multistore renders the XMLPackaged within an auto-generated <form> tag named "aspnetForm". So when you create a form in your package you will have nested forms (your form nested into "aspnetForm" form) that is a problem in HTML.
 
The result is when you click YOUR submit button it will perform the action property of the "aspnetForm" form and not yours. The reason why the page reloads itself is because the action of the "aspnetForm" form is the package name (eg. mypackage.aspx).
 
To workaround this I came with a 'hack' that consists in use a small JS code to rewrite the action property of the "aspnetForm" form. Everything you have to do is to replace the action property value (the name of the package) by the name of the script that should process your form using the setAttribute method. This way:
<?xml version="1.0" standalone="yes" ?>
<package version="2.1" displayname="Load Form EAF" debug="false" includeentityhelper="true">
<PackageTransform>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:aspdnsf="http://www.aspdotnetstorefront.com">
<xsl:output method="html" omit-xml-declaration="yes" />
<xsl:template name="myform">
<script>
function HackForm()
{
var fo = document.getElementById("aspnetForm"); 
fo.setAttribute("action", "processform.aspx");
return;
}
</script>

<!-- FORM BEGIN -->
<input type="text" name="name" /><br/>
<input type="submit" value="Submit form" onclick="return HackForm();" />
<!-- FORM END -->

</xsl:template>
<xsl:template match="/">
<xsl:call-template name="myform" />
</xsl:template>
</xsl:stylesheet>
</PackageTransform>
</package>

Notice that I didn't use the <form></form> tags around my own form because it's irrelevant – you still CAN use it if you want but it won't make any difference. Anyway, when you click the submit button it will actually submit the "aspnetForm" form sending everything that is nested into it (including your own form). It works!

Enjoy!

answered Sep 20 by Yan Kleber (1,140 points)
...