I would like to submit an XForm by clicking on a hyperlink, instead of a regular submit button. Does anyone know if this is possible?
This works in HTML, like this (there is no button shown, only a hyperlink) :
<style type="text/css">
.submitLink {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: Bold;
color: #CCCC88;
background-color: transparent;
text-decoration: underline;
border: none;
cursor: pointer;
cursor: hand;
}
</style>
<FORM action="http://somesite.com" method="post">
<LABEL for="firstname">First name: </LABEL>
<INPUT type="text" id="firstname"><BR>
<INPUT type="submit" class="submitLink" value="Submit Button"/>
</FORM>
How could this be achieved in XForms? I tried to add a "class"-attribute to the trigger that sends the form, but to no avail. The font has a pretty color, and is underlined, but the button is still shown.
This is my xforms-code (it's not what I want) :
<xforms:trigger class="submitLink" style="display:block">
<xforms:label>Login</xforms:label>
<xforms:action ev:event="DOMActivate">
<xforms:send submission="getLogin" />
</xforms:action>
</xforms:trigger>
So I'm thinking that Javascript is the way to go, perhaps like this:
a href="javascript:login()">Login</a>
and then
<SCRIPT LANGUAGE="JavaScript">
function login(){
var theModel = document.getElementById("LoginFormModel");
//var theInstance = theModel.getInstanceDocument("loginInstance");
//this works, I've used it to add and read nodes to and from the instance
//So how do I access the submission element of the model?
//And how can I submit it then?
//var theSubmit = theModel.getSubmission(); --> this does not work
var theSubmit = document.getElementById("getLogin"); // --> this doesn't give an
// error
theSubmit.submit(); // this does not work :(
}
</SCRIPT>
So how can I submit a XForm by clicking on a hyperlink, instead of a regular button?
I really need this, so I'd really appreciate all the help.
thanks in advance
Matt
Belgium

wow it worked!
hi,
wow it worked! Thanks alot! Here is the final code:
.submitLink {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
background-color: transparent;
text-decoration: underline;
border: none;
cursor: pointer;
cursor: hand;
}
<xforms:trigger class="submitLink" appearance=minimal>
<xforms:label>Login</xforms:label>
<xforms:action ev:event="DOMActivate">
<xforms:send submission="getLogin"/>
</xforms:action>
</xforms:trigger>
thanks again!
Use @appearance="minimal"
Hi Matt,
It's actually easier than calling script--just style the
submitto look like a link using the CSS that you mentioned. The only bit you need to add is @appearance="minimal" on the button so that it doesn't get styled to look like an operating system button.Hope that helps.
Mark
wow it worked
hi,
wow thanks man, it worked!
This is the final code:
.submitLink {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
background-color: transparent;
text-decoration: underline;
border: none;
cursor: pointer;
cursor: hand;
}
<xforms:trigger class="submitLink" appearance=minimal >
<xforms:label>Login</xforms:label >
<xforms:action ev:event="DOMActivate">
<xforms:send submission="getLogin"/>
</xforms:action>
</xforms:trigger>
thanks again!