How to get Submit via Enter key working on Chrome and Firefox (via input type="submit") with access only to CSS

390 Views Asked by At

I have an issue with the enter key not submitting data in a form when the enter key is hit in Chrome and Firefox, you have to click on the link:

onclick="javascript:document.EntryForm.TargetAction.value = 'NewDocument'; document.EntryForm.submit();"

I believe this is because the document lacks input type="submit", so I would like to add it into the page.

The problem lies in the fact that the page is generated dynamically by Sage CRM which according to our Sage team does not give us access to modify the scripts. I have however found the CSS! I have used the CSS in the past to change certain aspects of the interface.

Another problem is that although Sage CRM is a relatively new system (I am told) as it was created when Sage sold ACT! the HTML does not seem to comply with what I would describe as best practices (HTML4, no DOCTYPE, elements 20 tables deep, very few class tags and fewer ID tags, I think we got lucky in this case with the .ButtonItem class)

My plan is to change this link (one of many links with no IDs) to the submit input type using css content: and :after and :nth-of-type(1)

<TABLE class=ButtonGroup>
    <TBODY>
        <TR>
            <TD class=ButtonItem>
                <TABLE cellSpacing=0 cellPadding=0 border=0>
                    <TBODY>
                        <TR>
                            <TD width=32><A onfocus="if (event &amp;&amp; event.altKey) click();" class=ButtonItem accessKey=F href="javascript:try{checkSubmit(document.EntryForm);}catch(e){document.EntryForm.submit();}"><IMG border=0 src="/CRM/Themes/img/default/Buttons/Search.gif" align=middle></A></TD>
                            <TD>&nbsp;</TD>
                            <TD><A onfocus="if (event &amp;&amp; event.altKey) click();" class=ButtonItem accessKey=F href="javascript:try{checkSubmit(document.EntryForm);}catch(e){document.EntryForm.submit();}"><FONT style="TEXT-DECORATION: underline">F</FONT>ind</A></TD>
                        </TR>
                    </TBODY>
                </TABLE>
            </TD>
        </TR>
        <TR>
            <TD class=ButtonItem>
                <TABLE>
                    <TBODY>
                        <TR>
                            <TD><A>a</A></TD>
                            <TD><!-- Many more of these rows --></TD>
                            <TD><A>a</FONT>ear</A></TD>
                        </TR>
                    </TBODY>
                </TABLE>
            </TD>
        </TR>
    </TBODY>
</TABLE>

Is this how you would get the submit on enter to work and if so how would you select the css and insert the html?

And how come IExplorer knows what to do when I hit return but Firefox/Chrome does not if not submit is specified? A best guess?

0

There are 0 best solutions below