May 25, 2010

Trouble Saving a Notes Document from Web

I'm currently working on re-implementing the customer's intranet site. As part of this work, I'm at the moment developing a page that let the users publish news to the site.

Reading different blogs around the web, the way to do is is fairly straight forward:
  • Add a data source to your xpage, select a form, and set it to create a document when the page is loaded
  • Add some fields and bind them to fields in your form.
  • Add a button at the bottom of your page, and add a Simple Action event ("Save Document") to it.

This work was completed in a few minutes and I successfully tested the page in Firefox.  I was about to run around the office in celebration, when I reminded myself to verify that it works in Internet Explorer 7 (the browser of choice at the customer's office) as well... That's when the trouble started!

Clicking the save button in IE7, the only thing happening is that an error message is displayed:
'document.forms[...].$$xspsubmitid' is null or not an object'
Inspecting the source code of the Xpage, there are a few interesting parts. When creating an Xpage with a submit/save button, the following HTML is automagically created and included in your page:
(The id of my save button is "view:_id1:button1")

As I click the save button in Firefox, I can see through Firebug that the DOM is actually changed as the onClick event of the button is fired. The code snippet now looks like this:

As far as I can see (through Firebug Lite), the same changes are not made in Internet Explorer 7. I have just started experimenting with this part of XPages (submitting/editing documents from Web), but I am assuming that this is what causes the trouble, as the Xpage does not know what part of the page to submit to the server side.

Are there anyone else out there experiencing the same problems?
I have made attempts to dive into the XPages event handling, but I have yet to get to grips with it.

Unfortunately, I have not been able to test this page in other browsers yet. Due to security issues, I am developing the XPages application on a computer provided by the customer, with insufficient rights to install additional software.


UPDATE:
The source code that creates the problem:
XPAGE SOURCE CODE

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xc="http://www.ibm.com/xsp/custom">
    <xp:this.resources>
        // Removed included js and css files
    </xp:this.resources>
    <xp:this.data>
        <xp:dominoDocument var="newsDoc" formName="NEWS">
        </xp:dominoDocument>
    </xp:this.data>

    <xc:global_linkjs />
    <div class="main xpNyhet">
        <div class="mainInner">
            <div class="content">
                <div class="page">
                    <div class="pageCenter">
                        <div class="pageContent">
                            // Removed code to generate entry fields and bind them to fields in the document (by drag-and-drop from Data palette)
                            <xp:button value="Lagre dokument"
                                id="button1" save="true" execMode="complete">
                                <xp:eventHandler event="onclick"
                                    save="true" submit="true" immediate="false" refreshMode="complete">
                                    <xp:this.action>
                                        <xp:actionGroup>
                                            <xp:saveDocument></xp:saveDocument>
                                            <xp:openPage>
                                                <xp:this.name><![CDATA[#{javascript:var mid = new CGIVariables().getURLParam("mid");

                                                    if (mid) {
                                                        return "/forsideSpin.xsp?mid=" + mid + "&login";
                                                    } else {
                                                        return "/forsideSpin.xsp?login";
                                                }}]]>
                                                </xp:this.name>
                                            </xp:openPage>

                                        </xp:actionGroup>
                                    </xp:this.action>
                                </xp:eventHandler>
                            </xp:button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</xp:view>

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

HTML SOURCE CODE (from IE7)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="no">
<head>
    // Removed content here
</head>
    <body class="xspView tundra">
        <form id="view:_id1" method="post" action="/weblink/FELLES/spinlokalnyheter.nsf/lagNyhet.xsp?mid=spin&amp;login" class="xspForm" enctype="multipart/form-data">
            <div class="content">
                <div class="page">
                    <div class="pageCenter">
                        <div class="pageContent">
                            // Removed content here. Entry fields bound to fields in the doucment form.
                            <button id="view:_id1:button1" class="xspButtonSubmit" type="button" name="view:_id1:button1">Save document</button>
                        </div>
                    </div>
                </div>
            </div>
            <input type="hidden" name="$$viewid" id="view:_id1__VUID" value="!cjwesc81oc!">
            <input type="hidden" name="$$xspsubmitid">
            <input type="hidden" name="$$xspexecid">
            <input type="hidden" name="$$xspsubmitvalue">
            <input type="hidden" name="$$xspsubmitscroll">
            <input type="hidden" name="view:_id1" value="view:_id1">
            <script type="text/javascript">
                function clearFormHiddenParams_view__id1(curFormName) {
                    var curForm = document.forms[curFormName];
                }
            </script>
        </form>
        <script type="text/javascript">
            XSP.addOnLoad(function() {
                XSP.attachEvent("view:_id1:_id90", "view:_id1:button1", "onclick", null, true, false);
            }); 
        </script>
    </body>
</html>