javascript - Primefaces Notification bar working selectively -
i'm having odd problem notification bar in primefaces. actually, notification bar displays on page load without problems, , buttons open/hide work fine.
problem in javascript call hiding notification bar - doesnt work. doesn't work if exclude settimeout , call hide function directly. situation same button displaying bar - button works, not working javascript.
and checked, if put alert in javascript displays without problems, functions working.
any ideas?
thanks!
<h:form> ... <p:notificationbar position="top" effect="slide" styleclass="top" widgetvar="bar" autodisplay="true"> <p:commandbutton id="baroff" onclick="pf('bar').hide()" type="button" icon="ui-icon-arrow-1-n"/> <h:outputtext value="some text" style="font-size:36px;" /> </p:notificationbar> <p:commandbutton id="baron" value="show" onclick="pf('bar').show()" type="button" icon="ui-icon-arrow-1-s"/> </h:form> <script type="text/javascript"> function load() { settimeout(close(), 3000); } function close() { document.getelementbyid('baroff').click(); } document.getelementsbytagname('body')[0].onload = load(); </script>
baron , baroff <p:commandbutton>
in naming container, in order select them, have either:
- prefix id naming container id
- add
prependid="false"
naming container (see note below)
edit: note component ids , uinamingcontainer balusc's blog:
render ids resolved relative parent uinamingcontainer component. examples of uinamingcontainer components
<h:form>
,<h:datatable>
,<ui:repeat>
, etc. components prepends client id of children own client id.[...]
the absolute render id needs full client id prefixed ":". if render target nested in uinamingcontainer component, need give fixed id , include id well.
when using prependid="false"
on uinamingcontainer, id of components inside rendered as-is in dom. somehow an easy way out should avoided since can lead have accidentally multiple components same id in dom. better use fully-qualified ids.
taking precaution account, add id form , use prefix qualify children components:
<h:form id="notification-form">
and
function close() { document.getelementbyid('notification-form:baroff').click(); }
or (without need reference ids):
function close() { pf('bar').hide(); }
see also:
Comments
Post a Comment