XPages server side validation not working on IE8

0
votes

Have a simple "contact us" XPage created.

Have server side validation in place that displays errors via 'Display Error' controls. Have button that sends out email when clicked.

Functionality works using Firefox 4.0.1, but does not with IE8.

Have put the following compatibility code in the beforeRenderResponse event:

try {
if (context.getUserAgent().isIE(8, 8)) {
var exCon = facesContext.getExternalContext();

var response = exCon.getResponse();
response.setHeader("X-UA-Compatible", "IE=EmulateIE7");
}
} catch (e) {
}

Does not seem to help. Any ideas/suggestions?

Derek

Update:

As requested - here's the button code:

var doc = database.createDocument();
doc.replaceItemValue("Form", "Memo");
doc.replaceItemValue("Subject", "Contact Us Received");
doc.replaceItemValue("SendTo", "detnyre@mac.com");
doc.replaceItemValue("DisplaySent","detnyre@mac.com");

//Build Body

var1 = "The following Contact Us message was received: <br><br>";
var2 = var1 + "Contact Name: " + document1.getItemValueString("ContactName").valueOf()+ "<br><br>";
var3 = var2 + "Email Address: " + document1.getItemValueString("ContactEmail").valueOf()+ "<br><br>";
var4 = var3 + "Phone Number: " + document1.getItemValueString("ContactPhone").valueOf() + "<br><br>";
var5 = var4 + "Subject: " + document1.getItemValueString("ContactSubject").valueOf() + "<br><br>";
var6 = var5 + "Message: " + document1.getItemValueString("ContactMessage").valueOf() + "<br>";

body = doc.createMIMEEntity()
stream = session.createStream()
stream.writeText(var6)
body.setContentFromText(stream, "text/html; charset=iso-8859-1", 0)

// Send
doc.send();
context.redirectToPage("Home")

Here's the XML generated:

<xp:button value="Email Test" id="button2">
    <xp:eventHandler event="onclick" submit="true"
        refreshMode="complete">
        <xp:this.action><![CDATA[#{javascript:var doc = database.createDocument();
doc.replaceItemValue("Form", "Memo");
doc.replaceItemValue("Subject", "Contact Us Received");
doc.replaceItemValue("SendTo", "detnyre@mac.com");
doc.replaceItemValue("Princial","detnyre@mac.com");
doc.replaceItemValue("ReplyTo","detnyre@mac.com");
doc.replaceItemValue("tmpDisplaySentBy","detnyre@mac.com");
doc.replaceItemValue("DisplaySent","detnyre@mac.com");
doc.replaceItemValue("From","DonahueOnline")

//Build Body
var1 = "The following Contact Us message was received: <br><br>";
var2 = var1 + "Contact Name: " + document1.getItemValueString("ContactName").valueOf()+ "<br><br>";
var3 = var2 + "Email Address: " + document1.getItemValueString("ContactEmail").valueOf()+ "<br><br>";
var4 = var3 + "Phone Number: " + document1.getItemValueString("ContactPhone").valueOf() + "<br><br>";
var5 = var4 + "Subject: " + document1.getItemValueString("ContactSubject").valueOf() + "<br><br>";
var6 = var5 + "Message: " + document1.getItemValueString("ContactMessage").valueOf() + "<br>";

body = doc.createMIMEEntity()
stream = session.createStream()
stream.writeText(var6)
body.setContentFromText(stream, "text/html; charset=iso-8859-1", 0)

// Send
doc.send();
context.redirectToPage("Home")

}]]></xp:this.action>
    </xp:eventHandler>
</xp:button>

Derek

============

Update #2

Moved the code from the button to the query save event. Same result - works in Firefox, but not IE8. Assume I have something basic wrong, just can't find it... Here is new source code:

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">


<xp:this.beforeRenderResponse><![CDATA[#{javascript:try {
if (context.getUserAgent().isIE(8, 8)) {
var exCon = facesContext.getExternalContext();
var response = exCon.getResponse();
response.setHeader("X-UA-Compatible", "IE=EmulateIE7");
}
} catch (e) {
}}]]></xp:this.beforeRenderResponse>
<xp:br></xp:br>
<xp:this.data>
    <xp:dominoDocument var="document1" formName="CUF">
        <xp:this.querySaveDocument><![CDATA[#{javascript:var doc = database.createDocument();
doc.replaceItemValue("Form", "Memo");
doc.replaceItemValue("Subject", "Contact Us Received");
doc.replaceItemValue("SendTo", "detnyre@mac.com");
doc.replaceItemValue("Princial","detnyre@mac.com");
doc.replaceItemValue("ReplyTo","detnyre@mac.com");
doc.replaceItemValue("tmpDisplaySentBy","detnyre@mac.com");
doc.replaceItemValue("DisplaySent","detnyre@mac.com");
doc.replaceItemValue("From","DonahueOnline")

//Build Body
var1 = "The following Contact Us message was received: <br><br>";
var2 = var1 + "Contact Name: " + document1.getItemValueString("ContactName").valueOf()+ "<br><br>";
var3 = var2 + "Email Address: " + document1.getItemValueString("ContactEmail").valueOf()+ "<br><br>";
var4 = var3 + "Phone Number: " + document1.getItemValueString("ContactPhone").valueOf() + "<br><br>";
var5 = var4 + "Subject: " + document1.getItemValueString("ContactSubject").valueOf() + "<br><br>";
var6 = var5 + "Message: " + document1.getItemValueString("ContactMessage").valueOf() + "<br>";

body = doc.createMIMEEntity()
stream = session.createStream()
stream.writeText(var6)
body.setContentFromText(stream, "text/html; charset=iso-8859-1", 0)

// Send
doc.send();
context.redirectToPage("Home")

}]]></xp:this.querySaveDocument></xp:dominoDocument>
</xp:this.data>
<xp:table
    style="margin-top:5.0px;margin-bottom:5.0px;padding-top:5.0px;padding-bottom:5.0px">
    <xp:tr>
        <xp:td>
            <xp:span style="font-size:16pt">Contact Us</xp:span>
        </xp:td>
    </xp:tr>
    <xp:tr>
        <xp:td></xp:td>
    </xp:tr>
    <xp:tr>
        <xp:td style="font-size:12pt">
            * (denotes required field)
        </xp:td>
    </xp:tr>
    <xp:tr>
        <xp:td></xp:td>
    </xp:tr>
    <xp:tr>
        <xp:td style="width:400px;font-size:12pt">
            Name:*
            <xp:message id="ContactNameError" for="ContactName"
                style="color:rgb(255,128,128);font-size:9pt">
            </xp:message>
        </xp:td>

    </xp:tr>

    <xp:tr>
        <xp:td>
            <xp:inputText id="ContactName"
                value="#{document1.ContactName}" style="width:200px"
                required="true">
                <xp:this.validators>
                    <xp:validateRequired
                        message="Name is required.">
                    </xp:validateRequired>
                </xp:this.validators>
            </xp:inputText>
            <xp:br></xp:br>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td style="font-size:12pt">
            Email Address:* &#160;
            <xp:message id="message1"
                style="color:rgb(255,0,0);font-size:9pt" for="ContactEmail">
            </xp:message>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td>
            <xp:inputText id="ContactEmail" style="width:200px"
                value="#{document1.ContactEmail}" required="true">
                <xp:this.validators>
                    <xp:validateRequired
                        message="Email Address is Required.">
                    </xp:validateRequired>
                </xp:this.validators>
            </xp:inputText>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td style="font-size:12pt">Phone Number:</xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td>
            <xp:inputText id="ContactPhone" style="width:200px"
                value="#{document1.ContactPhone}" required="true">
                <xp:this.validators>
                    <xp:validateRequired
                        message="Phone Number is Required.">
                    </xp:validateRequired>
                </xp:this.validators>
            </xp:inputText>
            <xp:br></xp:br>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td style="font-size:12pt">
            Subject:* &#160;
            <xp:message id="message2"
                style="color:rgb(255,0,0);font-size:9pt" for="ContactSubject">
            </xp:message>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td>
            <xp:inputText id="ContactSubject" style="width:300px"
                value="#{document1.ContactSubject}" required="true">
                <xp:this.validators>
                    <xp:validateRequired
                        message="Subject is required.">
                    </xp:validateRequired>
                </xp:this.validators>
            </xp:inputText>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td style="font-size:12pt">
            Message:* &#160;
            <xp:message id="message3"
                style="color:rgb(255,0,0);font-size:9pt" for="ContactMessage">
            </xp:message>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td>
            <xp:inputTextarea id="ContactMessage"
                style="height:250px;width:99%" value="#{document1.ContactMessage}"
                required="true">
                <xp:this.validators>
                    <xp:validateRequired
                        message="A message is required.">
                    </xp:validateRequired>

                </xp:this.validators>
            </xp:inputTextarea>
        </xp:td>

    </xp:tr>
</xp:table>


<xp:br></xp:br>
<xp:button value="Submit" id="button1"><xp:eventHandler event="onclick" submit="true" refreshMode="complete">
<xp:this.action>
    <xp:saveDocument var="document1"></xp:saveDocument>
</xp:this.action></xp:eventHandler></xp:button></xp:view>

==========

UPDATE #3

Tried the suggestions posted. Removed the code that set compatibility mode of IE8. Re-did the button. Included save="false" in the button code. Still works in FireFox, but not with IE8. IE8 displays page, but validation and email code does not run... odd...

Here is latest source code:

<xp:br></xp:br>
<xp:this.data>
    <xp:dominoDocument var="document1" formName="CUF">
        <xp:this.querySaveDocument><![CDATA[#{javascript:var doc = database.createDocument();

doc.replaceItemValue("Form", "Memo"); doc.replaceItemValue("Subject", "Contact Us Received"); doc.replaceItemValue("SendTo", "detnyre@mac.com"); doc.replaceItemValue("Princial","detnyre@mac.com"); doc.replaceItemValue("ReplyTo","detnyre@mac.com"); doc.replaceItemValue("tmpDisplaySentBy","detnyre@mac.com"); doc.replaceItemValue("DisplaySent","detnyre@mac.com"); doc.replaceItemValue("From","DonahueOnline")

//Build Body var1 = "The following Contact Us message was received:

"; var2 = var1 + "Contact Name: " + document1.getItemValueString("ContactName").valueOf()+ "

"; var3 = var2 + "Email Address: " + document1.getItemValueString("ContactEmail").valueOf()+ "

"; var4 = var3 + "Phone Number: " + document1.getItemValueString("ContactPhone").valueOf() + "

"; var5 = var4 + "Subject: " + document1.getItemValueString("ContactSubject").valueOf() + "

"; var6 = var5 + "Message: " + document1.getItemValueString("ContactMessage").valueOf() + "
";

body = doc.createMIMEEntity() stream = session.createStream() stream.writeText(var6) body.setContentFromText(stream, "text/html; charset=iso-8859-1", 0)

// Send doc.send(); context.redirectToPage("Home")

}]]> Contact Us * (denotes required field) Name:* 

    </xp:tr>

    <xp:tr>
        <xp:td>
            <xp:inputText id="ContactName"
                value="#{document1.ContactName}" style="width:200px"
                required="true">
                <xp:this.validators>
                    <xp:validateRequired
                        message="Name is required.">
                    </xp:validateRequired>
                </xp:this.validators>
            </xp:inputText>
            <xp:br></xp:br>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td style="font-size:12pt">
            Email Address:* &#160;
            <xp:message id="message1"
                style="color:rgb(255,0,0);font-size:9pt" for="ContactEmail">
            </xp:message>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td>
            <xp:inputText id="ContactEmail" style="width:200px"
                value="#{document1.ContactEmail}" required="true">
                <xp:this.validators>
                    <xp:validateRequired
                        message="Email Address is Required.">
                    </xp:validateRequired>
                </xp:this.validators>
            </xp:inputText>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td style="font-size:12pt">Phone Number:</xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td>
            <xp:inputText id="ContactPhone" style="width:200px"
                value="#{document1.ContactPhone}" required="true">
                <xp:this.validators>
                    <xp:validateRequired
                        message="Phone Number is Required.">
                    </xp:validateRequired>
                </xp:this.validators>
            </xp:inputText>
            <xp:br></xp:br>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td style="font-size:12pt">
            Subject:* &#160;
            <xp:message id="message2"
                style="color:rgb(255,0,0);font-size:9pt" for="ContactSubject">
            </xp:message>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td>
            <xp:inputText id="ContactSubject" style="width:300px"
                value="#{document1.ContactSubject}" required="true">
                <xp:this.validators>
                    <xp:validateRequired
                        message="Subject is required.">
                    </xp:validateRequired>
                </xp:this.validators>
            </xp:inputText>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td style="font-size:12pt">
            Message:* &#160;
            <xp:message id="message3"
                style="color:rgb(255,0,0);font-size:9pt" for="ContactMessage">
            </xp:message>
        </xp:td>

    </xp:tr>
    <xp:tr>
        <xp:td>
            <xp:inputTextarea id="ContactMessage"
                style="height:250px;width:99%" value="#{document1.ContactMessage}"
                required="true">
                <xp:this.validators>
                    <xp:validateRequired
                        message="A message is required.">
                    </xp:validateRequired>

                </xp:this.validators>
            </xp:inputTextarea>
        </xp:td>

    </xp:tr>
</xp:table>


<xp:br></xp:br>
<xp:button value="Label" id="button1">
<xp:eventHandler event="onclick" submit="true" save="false" refreshMode="complete">
<xp:this.action>
    <xp:saveDocument var="document1"></xp:saveDocument>
</xp:this.action>

3
internet-explorer-8lotus-dominoxpages
Can you add the XML that defines the button to the question and explain what exactly it is that doesn't work? – Thimo Jansen

3 Answers

1
votes

Without the actual code it's hard to diagnose the problem. It might be related to not setting the correct button type, which works in Firefox, but breaks IE. See this blog post I wrote about that:

http://blog.thimojansenit.nl/2011/06/fix-default-type-for-submit-buttons-in.html

(edit) In this case, after seeing the code, try it with 'save="false"' added to the eventHandler. Like this:

<xp:button value="Submit" id="button1">
<xp:eventHandler event="onclick" submit="true" save="false" refreshMode="complete">
    <xp:this.action>
        <xp:saveDocument var="document1"></xp:saveDocument>
    </xp:this.action>
</xp:eventHandler>

For me this does the trick when IE is not behaving the same as Firefox on a submit event.

1
votes

Your code shouldn't be in the button. Set the button to be type 'submit and move your code to the querysave event of your data source.

0
votes

Why are you emulating ie7? If you have a 8.5.3 server use ie8 standards or 9 if possible. ie7 is not good.