Hy all, I am trying to implement drag&drop primefaces components and I want do disable possibility to overlap on component to other before I drop the component. My components looks like this:
<p:outputPanel id="containment" header="Containment" style="color:black;position:relative; top:100px; left:50px; z-index:9" styleClass="button">
Test
</p:outputPanel>
<p:draggable for="containment" containment="parent" opacity="0.3" grid="10,10"/>
Is there a possibility to inform the user that the component while he is just dragging can't be dropped over another component?. I am using primefaces 5.2
Thanks #Kukeltje if I do like this
$("#comp1").draggable({
obstacle: "#comp2",
preventCollision: true,
containment: "#test"
});
Related
In a html page I have a h:commandButton that I want to make it to work in combination with a h:selectBooleanCheckbox, so every time I press the button the checkbox will be checked and otherwise.
Is it possible to do that directly in the html, and not in the java code behind it?
<h:commandButton value="#{userBean.buttonText()}" action="#{userBean.changeOutput()}"/>
<h:panelGrid columns="4" rendered="#{userBean.details}" styleClass="clicked" >
<h:outputText .... />
<h:outputText ..../>
</h:panelGrid>`
If you are using JSF 2, you have to update the area that include your checkbox, using f:ajax tag.
You can find a lot of examples here in stackoverflow, look this example just hide/show a div: After showing / hiding a JSF element with AJAX how to hide the triggering element?
Hope it helps.
I have a single page application written in JSF - PrimeFaces.
There are a couple of dialogs that are displayed correctly at the begining.
But after clicking:
<p:menuitem value="Logout" update="#all" action="#{loginBean.logout}"/>
the dialogs don't open correctly.
Maybe is is possible for you to make an update elements list, for example like:
update=":a:b,:c,:d:e:f".
Many people complains when try to use "#all".
you can also use, its like to show dialog force fully
<p:dialog widgetVar="statusDialog" ....... />
and use onClick = "PF('statusDialog').show();"
I am looking for something like <rich:popupPanel> in RichFaces 4, but then for RichFaces 3. I haven't found anything like in documenation. There is only <rich:modalPanel> which doesn't suit my needs, because it has problems displaying my datamodel in table. The selection doesn't work, it always returns no rows selected. If I put my table component in <rich:panel> or <rich:togglePanel>, then it works fine.
Is there any popup window excluding <rich:modalPanel> in RichFaces 3?
I dont have 50 reputation to ask you more details in a comment, so i will answer directly hoping this is what you're asking about.
I think you mean that your problem is that the content of the ModalPanel is not rerendered dynamically. but for this you can wrap your table (or the components you want to update) in an <a4j:outputPanel> with ajaxRendered="true"
Setting ajaxRendered="true" will cause the <a4j:outputPanel> to be updated with each Ajax response for the page, even when not listed explicitly by the requesting component. This can in turn be overridden by specific attributes on any requesting components.
http://docs.jboss.org/richfaces/latest_4_0_X/Component_Reference/en-US/html/chap-Component_Reference-Containers.html#sect-Component_Reference-Containers-a4joutputPanel
In my code I have something like :
<a4j:commandLink id="timelineBtn" action="#{timelineBean.doGenerateLog}"
oncomplete="Richfaces.showModalPanel('timelinePnl');return false;"
value="#{labels['timeline.button.lbl']}"/>
that opens the modalPanel :
<rich:modalPanel style="width:800;height:600;" id="timelinePnl">
<a4j:outputPanel id="dataPanel" ajaxRendered="true">
<!-- your components to be updated go here -->
</a4j:outputPanel>
</rich:modalPanel>
So my content is updated with the results of my timelineBean.doGenerateLog method each time i open the modalPanel .
I work with primefaces 3.4.1 and myfaces 2.1.9.
I need to show a component within a tab conditionally.
For the moment my code looks like that :
<p:tab id="tab" title="tabTitle">
<h:panelGroup id="tabContent">
<componentX:component id="component1" rendered="#{not condition}" />
<componentY:component id="component2" rendered="#{condition}" />
</h:panelGroup>
</p:tab>
I voluntarily changed the name of the components and arguments
My problem is with this solution component1 and component2 are both created. So the server will be working to generate the two components event if one is never shown.
My question is, is there a (clean) way to have this rendering result without creating both components?
I had the same results with c:if and c:choose, I am running out of ideas.
You can use c:if here without problems...
Say I have a websites with 3 panel grid (just for example..) and I would like to have buttons inside each grid that only cause the contents of that grid to refresh so the rest of the page doesn't necessarily have to refresh.
How do I do that?
I tried to have a form sorround that grid but it seems like the rest of the page still gets refreshed.
A Note - I'm trying to achieve something like what happens when you work with a picklist. when you move the objects between the lists there doesn't seem to be any page refresh...
Thanks!
If you are using RichFaces, you should definitivly check the Ajax chapter of the RichFaces manual. I think you will find everything you need to know there.
Here a small example for partial page rendering:
<a4j:commandButton value="update" reRender="infoBlock"/>
<h:panelGrid id="infoBlock">
<!-- Some content-->
</h:panelGrid>