You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@myfaces.apache.org by Chris Hansen <ha...@gmail.com> on 2008/03/25 00:19:37 UTC

[Trinidad] Modal tr:panelPopup issue in IE 7

First of all, I don't know much about CSS, so if this is purely a CSS issue,
I apologize.

I've noticed an issue on IE 7 (works fine in FireFox 2) that prevents the
user from doing anything within a modal tr:panelPopup (i.e. the area within
the popup is disabled just like the area outside of it). This has to do with
"position: relative;" in the CSS.

Here is a minimal example (sorry if the formatting is lost):
<pre>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<tr:document xmlns="http://www.w3.org/1999/xhtml"
  xmlns:f="http://java.sun.com/jsf/core"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:tr="http://myfaces.apache.org/trinidad">

  <f:view>
    <div style="margin-top: 100px; position: relative;">
      <tr:form id="testForm">
        <tr:panelPopup id="testPopup" text="Click here" title="Title"
modal="true">
          <tr:outputText value="content" />
        </tr:panelPopup>
      </tr:form>
    </div>
  </f:view>
</tr:document>

</pre>

I've noticed that the problem goes away if I remove the tr:form entirely or
move it outside of the div. Is this an issue with tr:panelPopup, tr:form, or
purely a CSS mistake/misuse?

Thanks,
Chris Hansen

Re: [Trinidad] Modal tr:panelPopup issue in IE 7

Posted by Andrew Robinson <an...@gmail.com>.
Yes you can. The problem is that it really makes the code more complex
as it would have to take into scroll locations of many elements
instead of just the body when computing locations.

On Tue, Mar 25, 2008 at 2:15 PM, Chris Hansen <ha...@gmail.com> wrote:
> Thanks for your reply.
>
> There's no reason in particular to have the form within the div in this
> case, but, to me, it seems unreasonable for the popup to assume its form is
> the top level element in general, so it sounds like further testing is in
> order. Actually, the example I gave works if you remove the "position:
> relative;" from the div, even though the form is not top-level, so I don't
> think that is the issue in this case.
>
> Should I file a bug for this?
>
> Thanks,
> -Chris
>
>
>
> On Tue, Mar 25, 2008 at 6:51 AM, Andrew Robinson
> <an...@gmail.com> wrote:
>
> > The popup code assumes that the item it is in is the top level. On the
> > other hand, it has to keep the popup in the form to ensure proper
> > submission. It only is tested with having the form directly under the
> > document component. We can add some more tests, but what does having
> > the DIV outside the form give you that you cannot do with it inside
> > the form?
> >
> > -Andrew
> >
> >
> >
> >
> > On 3/24/08, Chris Hansen <ha...@gmail.com> wrote:
> > > First of all, I don't know much about CSS, so if this is purely a CSS
> issue,
> > > I apologize.
> > >
> > > I've noticed an issue on IE 7 (works fine in FireFox 2) that prevents
> the
> > > user from doing anything within a modal tr:panelPopup (i.e. the area
> within
> > > the popup is disabled just like the area outside of it). This has to do
> with
> > > "position: relative;" in the CSS.
> > >
> > > Here is a minimal example (sorry if the formatting is lost):
> > > <pre>
> > >
> > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
> > > http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> > > <tr:document xmlns="http://www.w3.org/1999/xhtml"
> > >   xmlns:f="http://java.sun.com/jsf/core"
> > >   xmlns:h="http://java.sun.com/jsf/html"
> > >   xmlns:ui="http://java.sun.com/jsf/facelets"
> > >   xmlns:tr="http://myfaces.apache.org/trinidad">
> > >
> > >   <f:view>
> > >     <div style="margin-top: 100px; position: relative;">
> > >       <tr:form id="testForm">
> > >         <tr:panelPopup id="testPopup" text="Click here" title="Title"
> > > modal="true">
> > >           <tr:outputText value="content" />
> > >         </tr:panelPopup>
> > >       </tr:form>
> > >     </div>
> > >   </f:view>
> > > </tr:document>
> > >
> > > </pre>
> > >
> > > I've noticed that the problem goes away if I remove the tr:form entirely
> or
> > > move it outside of the div. Is this an issue with tr:panelPopup,
> tr:form, or
> > > purely a CSS mistake/misuse?
> > >
> > > Thanks,
> > > Chris Hansen
> > >
> >
>
>

Re: [Trinidad] Modal tr:panelPopup issue in IE 7

Posted by Chris Hansen <ha...@gmail.com>.
Thanks for your reply.

There's no reason in particular to have the form within the div in this
case, but, to me, it seems unreasonable for the popup to assume its form is
the top level element in general, so it sounds like further testing is in
order. Actually, the example I gave works if you remove the "position:
relative;" from the div, even though the form is not top-level, so I don't
think that is the issue in this case.

Should I file a bug for this?

Thanks,
-Chris

On Tue, Mar 25, 2008 at 6:51 AM, Andrew Robinson <
andrew.rw.robinson@gmail.com> wrote:

> The popup code assumes that the item it is in is the top level. On the
> other hand, it has to keep the popup in the form to ensure proper
> submission. It only is tested with having the form directly under the
> document component. We can add some more tests, but what does having
> the DIV outside the form give you that you cannot do with it inside
> the form?
>
> -Andrew
>
> On 3/24/08, Chris Hansen <ha...@gmail.com> wrote:
> > First of all, I don't know much about CSS, so if this is purely a CSS
> issue,
> > I apologize.
> >
> > I've noticed an issue on IE 7 (works fine in FireFox 2) that prevents
> the
> > user from doing anything within a modal tr:panelPopup (i.e. the area
> within
> > the popup is disabled just like the area outside of it). This has to do
> with
> > "position: relative;" in the CSS.
> >
> > Here is a minimal example (sorry if the formatting is lost):
> > <pre>
> >
> > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
> > http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> > <tr:document xmlns="http://www.w3.org/1999/xhtml"
> >   xmlns:f="http://java.sun.com/jsf/core"
> >   xmlns:h="http://java.sun.com/jsf/html"
> >   xmlns:ui="http://java.sun.com/jsf/facelets"
> >   xmlns:tr="http://myfaces.apache.org/trinidad">
> >
> >   <f:view>
> >     <div style="margin-top: 100px; position: relative;">
> >       <tr:form id="testForm">
> >         <tr:panelPopup id="testPopup" text="Click here" title="Title"
> > modal="true">
> >           <tr:outputText value="content" />
> >         </tr:panelPopup>
> >       </tr:form>
> >     </div>
> >   </f:view>
> > </tr:document>
> >
> > </pre>
> >
> > I've noticed that the problem goes away if I remove the tr:form entirely
> or
> > move it outside of the div. Is this an issue with tr:panelPopup,
> tr:form, or
> > purely a CSS mistake/misuse?
> >
> > Thanks,
> > Chris Hansen
> >
>

Re: [Trinidad] Modal tr:panelPopup issue in IE 7

Posted by Andrew Robinson <an...@gmail.com>.
The popup code assumes that the item it is in is the top level. On the
other hand, it has to keep the popup in the form to ensure proper
submission. It only is tested with having the form directly under the
document component. We can add some more tests, but what does having
the DIV outside the form give you that you cannot do with it inside
the form?

-Andrew

On 3/24/08, Chris Hansen <ha...@gmail.com> wrote:
> First of all, I don't know much about CSS, so if this is purely a CSS issue,
> I apologize.
>
> I've noticed an issue on IE 7 (works fine in FireFox 2) that prevents the
> user from doing anything within a modal tr:panelPopup (i.e. the area within
> the popup is disabled just like the area outside of it). This has to do with
> "position: relative;" in the CSS.
>
> Here is a minimal example (sorry if the formatting is lost):
> <pre>
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
> http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> <tr:document xmlns="http://www.w3.org/1999/xhtml"
>   xmlns:f="http://java.sun.com/jsf/core"
>   xmlns:h="http://java.sun.com/jsf/html"
>   xmlns:ui="http://java.sun.com/jsf/facelets"
>   xmlns:tr="http://myfaces.apache.org/trinidad">
>
>   <f:view>
>     <div style="margin-top: 100px; position: relative;">
>       <tr:form id="testForm">
>         <tr:panelPopup id="testPopup" text="Click here" title="Title"
> modal="true">
>           <tr:outputText value="content" />
>         </tr:panelPopup>
>       </tr:form>
>     </div>
>   </f:view>
> </tr:document>
>
> </pre>
>
> I've noticed that the problem goes away if I remove the tr:form entirely or
> move it outside of the div. Is this an issue with tr:panelPopup, tr:form, or
> purely a CSS mistake/misuse?
>
> Thanks,
> Chris Hansen
>