Coding on the main page is simple and takes only a few lines. This does not include the JavaScript. A full page won't be shown here, just the parts needed for remote scripting. But, the (X)HTML needs to be in the correct sections of a properly coded HTML document.
CSS is used to hide the iframe. So let's take a look.
CSS: .hidden-frame { visibility: hidden; border-width: 0; height: 0; width: 0; overflow: hidden; } #iframe-div { visibility: hidden; height: 0; width: 0; overflow: hidden; }
The iframe cannot be display none, or the call won't happen. Using visibility: hidden will hide the iframe in some browsers. To cover the rest, the iframe is wrapped in a block element with visibility: hidden. This will keep the iframe out of sight.
An iframe styled display: none will
not make the HTTP request in most browsers. Therefore,
it is necessary to hide the iframe another way.
Styling it with visibility: hidden; overflow: hidden;
and no height or width works in some browser. Wrapping it in a div styled
display: none
visibility: hidden; width: 0; height: 0; overflow: hidden;
seems to work in all browsers.
As far as the HTML goes, the only part that is affected is where the remote procedure call is made.
Similar or appropriate functionality for browsers that don't support remote scripting should be provided. This is accomplished by putting an appropriate URL in the action property of a form or the href of a link.
The onsubmit event of a form or the onclick event of a link runs the remote procedure call. And, if the RPC cannot be done, the code lets the default action, calling the url, happen.
HTML Call RPC with a form: <form name="rpc-form" id="rpc-form" action="page-for-noscript.cgi" method="get" onsubmit="return do_rpc("rpc-url", "target-id", responseHandler);"> HTML Call RPC with a link: <a href="page-for-noscript.html?data-value" onclick="return do_rpc('rpc-url', 'target-id', data, responseHandler );">link</a>
For this example, the event handler do_rpc is attached in-line. Better technique would be to use assignment to an object property or attachEvent for IE and addEventListener for FireFox, et al, to attach the event handler. See Add/Remove Event script for cross browser code to handle the event attachment.
The important point is that the default action is canceled when the RPC runs or allowed when the RPC cannot run. Failure to prevent the default action can cause Firefox to throw and error. The default action provides the response for browsers that don't support the RPC.