Tooltip overlay issue
jayas Jun 29, 2013 8:07 PMI am working on RF4.3.2 and having an issue with tooltip. I have two calendar components and need to show error message in a tooltip if the fields are empty. The issue is if both the components are empty, tooltips are getting overlaid. My code is as below.
<h:panelGrid id="coursePeriodPanel" columns="10">
<h:outputLabel value="#{msg.coursePeriod}" style="margin-left:22px;" />
<rich:calendar id="fromCoursePeriod" datePattern="#{msg.datePattern}"
enableManualInput="true" inputStyle="width:74px;
#{not component.valid ? 'border-color:red;' : 'border-color:none;'};"
value="#{courseBean.course.fromDate}" required="true" requiredMessage="Please Enter the From Date">
</rich:calendar>
<rich:tooltip id="fromCoursePeriodTooltip" followMouse="false"
horizontalOffset="5" verticalOffset="5" style="display:table-cell"
layout="block" mode="client" rendered="#{courseBean.hasMessages('createCourse:fromCoursePeriod')}">
<span style="white-space: nowrap"> <rich:message for="fromCoursePeriod" style="color:red" /> </span>
</rich:tooltip>
<rich:calendar id="toCoursePeriod" datePattern="#{msg.datePattern}"
enableManualInput="true" required="true"
requiredMessage="Please Enter the To Date" inputStyle="width:74px;
#{not component.valid ? 'border-color:red;' : 'border-color:none;'};"
value="#{courseBean.course.toDate}" binding="#{toCoursePeriod}">
<f:validateRequired for="toCoursePeriod" />
</rich:calendar>
<rich:tooltip id="toCoursePeriodTooltip" followMouse="false"
verticalOffset="5" style="display:table-cell" showDelay="1000"
layout="block" mode="client" rendered="#{courseBean.hasMessages('createCourse:toCoursePeriod')}">
<span style="white-space: nowrap"> <rich:message for="toCoursePeriod" style="color:red" /> </span>
</rich:tooltip>
<h:panelGrid>
Please suggest how to fix this issue.
Any suggestions are appreciated.
Thanks.
-
TooltipIssue.jpg 10.5 KB