Issue with Liferay UI tab Navigation - liferay

I am using <liferay-ui:tabs> for displaying jsp pages as tabs. I am able to see my pages as tabs but If I navigate to one of my pages in the tab and on click of the button then it is navigating to some other page, that it showing in a separate page instead of showing under that tab. I need to click of button events the control should be still under the tabs. my Code is as follows,
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%><%#include file="/html/users/init.jsp"%>
<portlet: defineObjects />
<portlet:renderURL var="navigateTabURL"/>
<% String navigateTab = ParamUtil.getString(request, "tabs1","Current"); %>
<liferay-ui:tabs names="Current, Available" url="<%=navigateTabURL.toString()%>" >
<c:if test='<%= navigateTab.equalsIgnoreCase("Current")%>' >
<jsp:include page="current_members.jsp" flush="true" />
</c:if>
<c:if test='<%= navigateTab.equalsIgnoreCase("Available")%>' >
<jsp:include page="available_members.jsp" flush="true" />
</c:if>
</liferay-ui:tabs>
The pages "Current" and "Available" are showing correctly, But If I click any button in my Current page it is navigating to some other jsp I need that jsp also under that tabs only not showing as a separate page.
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%><%#include file="/html/users/init.jsp"%>
<portlet: defineObjects />
<%
List<User> userList = (List) request.getAttribute("UserGroupList");
//out.println(userList.size());
%>
<%!
List<User> users = null;
int totalNoOfUsers=0;
String value = null;
%>
<%
//totalNoOfUsers = UserLocalServiceUtil.getUsersCount();
totalNoOfUsers = userList.size();
users = userList;
%>
<liferay-ui:search-container delta="5" emptyResultsMessage="no-users-were-found" rowChecker="<%= new RowChecker(renderResponse) %>" >
<liferay-ui:search-container-results results="<%= ListUtil.subList(users,searchContainer.getStart(),searchContainer.getEnd()) %>"
total="<%= totalNoOfUsers %>">
</liferay-ui:search-container-results>
<liferay-ui:search-container-row className="com.liferay.portal.model.User" keyProperty="userId" modelVar="user">
<liferay-ui:search-container-row-parameter name="userIds" value="<%= user.getUserId()%>">
</liferay-ui:search-container-row-parameter>
<liferay-ui:search-container-column-text name="UserName" value="
<%= user.getScreenName()%>" />
<liferay-ui:search-container-column-text name="First Name" value="<%= user.getFirstName() %>">
</liferay-ui:search-container-column-text>
<liferay-ui:search-container-column-text name="Last Name" value="<%= user.getLastName() %>">
</liferay-ui:search-container-column-text>
<liferay-ui:search-container-column-jsp align="right" path="/html/users/custom_user_actions.jsp" />
</liferay-ui:search-container-row>
<liferay-ui:search-iterator />
</liferay-ui:search-container>
<liferay-ui:search-container delta="5" emptyResultsMessage="no-users-were-found" />
<portlet:actionURL name="viewEntry" var="viewEntryURL"></portlet:actionURL>
<aui:form action="<%= viewEntryURL %>" name="<portlet:namespace />fms">
<aui:button type="submit" value="Cancel"></aui:button>
</aui:form>
How do I navigate the tabs as dynamic requests. Any suggestions please!!

To retain a tab selection, "value" attribute of should be mentioned with name of tab to select.
If "value" attribute not specified then first tab will be considered as active.
For example, please refer following file in liferay portal sources.
portal-web/docroot/html/portlet/dockbar/add_panel.jsp
Also, below post in liferay forum should help.
http://www.liferay.com/en_GB/community/forums/-/message_boards/message/4809190

Related

Liferay search container in Spring MVC portlets

Is it possible to use Liferay search container in spring portlets? when i tried, nothing is rendering in the page. i have enclosed the code. am just adding the data in session and trying to show in search container.
<%
final PortletSession sessData = renderRequest.getPortletSession();
List<Detail> details = (List<Detail>) sessData.getAttribute("DETAILS",PortletSession.PORTLET_SCOPE);
%>
<liferay-ui:search-container delta="3" emptyResultsMessage="No Details found" headerNames="User ID, First Name, Last Name, Address">
<%
int numOfRecords = details.size();
%>
<liferay-ui:search-container-results results="<%= details %>" total="${numOfRecords}">
</liferay-ui:search-container-results>
<liferay-ui:search-container-row className="Detail" modelVar="detailData">
<liferay-ui:search-container-column-text name="User ID" property="userId" />
<liferay-ui:search-container-column-text name="First Name" property="firstName" />
<liferay-ui:search-container-column-text name="Last Name" property="lastName" />
<liferay-ui:search-container-column-text name="Address" property="address" />
</liferay-ui:search-container-row>
</liferay-ui:search-container>
I missed to add the search-iterator.
<liferay-ui:search-iterator searchContainer="<%=searchContainer%>"
paginate="<%=isNeeded%>" />

Use liferay's change portrait image in liferay 6.2 GA4

i have liferay 6.2 GA4.. i have a question
i want to use liferay's user portrait change, but i dont want to copy all the code to my portlet...
is there a way to call liferay's portrait update from my portlet? just like in a render URL or something like that... call the edit_user_portrait struts action from liferay's my account portlet, and then let liferay do everything else... update the image, show errors, etc...
using this for example: (this is the code in liferay's my account portlet, to call the pop up that updates the portrait)
<portlet:renderURL var="editUserPortraitURL" windowState="<%= LiferayWindowState.POP_UP.toString() %>">
<portlet:param name="struts_action" value="/users_admin/edit_user_portrait" />
<portlet:param name="redirect" value="<%= currentURL %>" />
<portlet:param name="p_u_i_d" value="<%= String.valueOf(selUser.getUserId()) %>" />
<portlet:param name="portrait_id" value="<%= String.valueOf(selUser.getPortraitId()) %>" />
i want something like this, but this is not working... where i tell the portlet name (users admin in this case) where the struts action lives... and let liferay handle the rest..
<liferay-portlet:renderURL portletName="<%=PortletKeys.USERS_ADMIN %>" var="editUserPortraitURL" windowState="<%= LiferayWindowState.POP_UP.toString() %>">
<portlet:param name="struts_action" value="/users_admin/edit_user_portrait" />
<portlet:param name="redirect" value="<%= currentURL %>" />
<portlet:param name="p_u_i_d" value="<%= String.valueOf(selUser.getUserId()) %>" />
<portlet:param name="portrait_id" value="<%= String.valueOf(selUser.getPortraitId()) %>" />
for this i imported the <%# taglib uri="http://liferay.com/tld/portlet" prefix="liferay-portlet"%>
this code gives me a permissions error:
You do not have the roles required to access this portlet.
but i doesnt send any error in the log..
how can i make this work? what im i missing?
thank you!!
i want to use liferay's user portrait change
Using Liferay API you can do this.
InputStream inputStream = new FileInputStream(file);
byte[] bytes = FileUtil.getBytes(inputStream);
UserServiceUtil.updatePortrait(themeDisplay.getUser().getUserId(), bytes);
reference
Thanks.
What I ended up doing is what Saleem suggested in the comments:
<%String editPortraitUrl = themeDisplay.getPortalURL()+"/group/control_panel/manage?p_p_id=2&p_p_lifecy‌​cle=0&p_p_state=pop_up&p_p_mode=view&_2_portrait_id=0&_2_p_u_i_d="+themeDisplay.getUserId()+"&_2_struts_action=%2Fmy_account%2Fedit_user_portrait";
%>
<liferay-ui:logo-selector
currentLogoURL="<%= selUser.getPortraitURL(themeDisplay) %>"
defaultLogoURL="<%= UserConstants.getPortraitURL(themeDisplay.getPathImage(), selUser.isMale(), 0) %>"
editLogoURL="<%=editPortraitUrl %>"
imageId="<%= selUser.getPortraitId() %>"
logoDisplaySelector=".user-logo"/>
Here is a link for reference:
https://www.liferay.com/es/community/forums/-/message_boards/message/57413369

open the docbar left side menu in the custom jsp page in liferay

I have a requirement that I need to add one link or button in docbar. From my custom jsp of the portlet when I click a link or button It should open the docbar left menu.For example in the docbar if I click on edit page it will open the left menu as shown below.How to achieve this ?
I have tried open the left menu link form my custom jsp page, it is not opened even I have included the docabr.js in custom jsp page. can any one guide me how to achieve this?
the following is my code which I have tried:
<script type="text/javascript" src="/html/js/liferay/dockbar.js"></script>
<portlet:renderURL var="editLayoutURL" windowState="<%= LiferayWindowState.EXCLUSIVE.toString() %>">
<portlet:param name="struts_action" value="/dockbar/edit_layout_panel" />
<portlet:param name="closeRedirect" value="<%= PortalUtil.getLayoutURL(layout, themeDisplay) %>" />
<portlet:param name="groupId" value="<%= String.valueOf(scopeGroupId) %>" />
<portlet:param name="selPlid" value="<%= String.valueOf(plid) %>" />
</portlet:renderURL>
<aui:nav-item anchorId="editLayoutPanel" cssClass="page-edit-controls" data-panelURL="<%= editLayoutURL %>" href="javascript:;" iconCssClass="icon-edit" label="edit" />
<aui:script position="inline" use="liferay-dockbar">
Liferay.Dockbar.init('#<portlet:namespace />dockbar');
var customizableColumns = A.all('.portlet-column-content.customizable');
if (customizableColumns.size() > 0) {
customizableColumns.get('parentNode').addClass('customizable');
}
</aui:script>
You probably need to register your panel in the Dockbar like this:
<aui:script use="liferay-dockbar">
Liferay.Dockbar.DOCKBAR_PANELS.myPanel = {
css: 'lfr-has-mypanel',
id: 'myPanel',
node: null,
showFn: A.bind(Liferay.Dockbar._showPanel, Liferay.Dockbar),
tpl: '<div class="lfr-add-panel lfr-admin-panel" id="{0}" />'
};
</aui:script>
You can check out a working implementation of this in the Audience Targetting Simulator Hook

How to set the selected value in aui:select box

I have form with select box in my user form. I also need to update the form in edit mode. I am able to get selected value in edit mode. But I am unable to set the selected value in the edit mode.
Here I am able to get the selected value from db. <%=user.getTitle() %> Now how can I set the selected value in my select box.
<aui:select name="title">
<aui:option label="Dr" value="dr" />
<aui:option label="Mr" value="mr" />
<aui:option label="Mrs" value="mrs" />
<aui:option label="Ms" value="ms" />
</aui:select>
Example I aset the selected value for input field like this,
<aui:input name="emailAddress" value=""></aui:input>
Any suggestions please!!
You can set selected value as:
Hard-coded Options:
<aui:select name="title">
<aui:option label="Dr" value="dr" selected="<%=user.getTitle().equals("dr") %>" />
<aui:option label="Mr" value="mr" selected="<%=user.getTitle().equals("mr") %>" />
<aui:option label="Mrs" value="mrs" selected="<%=user.getTitle().equals("mrs") %>" />
<aui:option label="Ms" value="ms" selected="<%=user.getTitle().equals("ms") %>" />
</aui:select>
Dynamic Options:
<aui:select name="title">
<%for(int i = 0; i < listOfOptions.size(); i++){
Object option = listOfOptions.get(i);
boolean selected = false;
if(user.getTitle().equals(option.getTitle())){
selected = true;
} %>
<aui:option label=<%=option.getTitle() %> value="<%=option.getValue() %>" selected=<%=selected %> />
<%} %>
</aui:select>
A cleaner way to do it:
<aui:select name="title">
<c:forEach items="${listOfOptions}" var="currOption">
<option value="${currOption}"<c:if test="${currOption == title}"> selected="selected"</c:if>>
${currOption}
</option>
</c:forEach>
</aui:select>
You can use ternary operator
<c:forEach var="currOption" items="${listOfOptions}">
<aui:option value="${currOption}" label="${currOption}" selected="${currOption==selOption?true:false}" />
</c:forEach>

How to have editable fields through liferay search container?

I am new to liferay development.
I have done good work to display the liferay grid by using liferay search container.
But now the requirement is that some of the fields in the grid should have provision to be modified by user.
Is it possible through liferay search container or do I need to follow any other approach to achieve editable liferay grid?
You can use <liferay-ui:search-container-column-jsp tag or directly use <aui-input /> inside the <liferay-ui:search-container-column-text tag.
Example (I have included code comments with the code sample for your understanding):
<liferay-ui:search-container
emptyResultsMessage="no-assets-selected"
iteratorURL="<%= configurationRenderURL %>"
total="<%= assetEntries.size() %>"
>
<liferay-ui:search-container-results
results="<%= assetEntries.subList(searchContainer.getStart(), searchContainer.getResultEnd()) %>"
/>
<liferay-ui:search-container-row
className="com.liferay.portlet.asset.model.AssetEntry"
escapedModel="<%= true %>"
keyProperty="entryId"
modelVar="assetEntry"
>
<aui:form action="doesThisWork?">
<%-- this is the normal way --%>
<liferay-ui:search-container-column-text
name="type"
value="<%= assetRendererFactory.getTypeName(locale, false) %>"
/>
<liferay-ui:search-container-column-date
name="modified-date"
value="<%= assetEntry.getModifiedDate() %>"
/>
<%--
this is the JSP way
You can include anything in the JSP like <input /> fields, textarea, select drop-down etc.
--%>
<liferay-ui:search-container-column-jsp
align="right"
path="/html/portlet/asset_publisher/asset_selection_action.jsp"
/>
<%--
Here is including <input /> field inside the column text field.
Notice I am not using the "value" attribute of this tag, instead I am
writing HTML inside the body of this tag.
--%>
<liferay-ui:search-container-column-text
name="type"
>
<aui:input type="text" name="enterSomething" value="I can enter input here" />
<aui:input type="text" name="enterSomething" value="<%=assetEntry.getTitle %>" />
<aui:input type="hidden" name="enterSomething" value="this is a hidden field of the form" />
</liferay-ui:search-container-column-text>
</aui:form>
</liferay-ui:search-container-row>
<liferay-ui:search-iterator paginate="<%= total > SearchContainer.DEFAULT_DELTA %>" />
</liferay-ui:search-container>
In the above example, there would be a <form> for each row, so you can have a submit button at the end of each row to submit the data for that row.
But you can do it in other ways as well:
You can write the <form> outside the Search-container tag so that you just have one form and can submit all the row data togather
Or else you can have a <form> somewhere down the page and through javascript populate the value in the form and then submit.
Or else you can use ajax and other stuff to accomplish this. Or a combination of several approaches.
I leave this upto you to figure out.
Disclaimer: I have not test this code. But as per my understanding this should work. :-)

Resources