- 父 portlet 有一个表单,我填写但尚未提交。
- 然后,我从这个父 portlet 中单击一个链接来打开一个弹出 portlet,在弹出窗口中填写表单并提交值。
- 该值现在应该在父 portlet 中可用。但如果不刷新,该值在父 portlet 中将不可用。
- 因此,我编写了使用 ajax 在弹出提交上刷新父 portlet 的逻辑,并且该值在父 portlet 中变得可用。
- 但问题是父 portlet 中的表单被清除,我必须再次重新填写表单。
那么如何保留尚未提交的父表单值呢?或者有没有办法使弹出的 portlet 值在父 portlet 中可用而无需刷新父 portlet?
父 portlet 的代码:
<aui:form action="<%= editURL %>" method="POST" name="fm">
<aui:fieldset>
<aui:input name="redirect" type="hidden" value="<%= redirect %>" />
<aui:input name="name" />
<aui:input name="acronym" />
<aui:input name="url" />
<aui:select showEmptyOption="<%= true %>">
// Want to make the values added from pop up available here
</aui:select>
<%
String portletId = (String) request.getAttribute(WebKeys.PORTLET_ID);
String portletNamespace = PortalUtil.getPortletNamespace(portletId);
%>
<c:set var="portletNameSpaceVal" value="<%=portletNamespace%>" />
<liferay-portlet:renderURL
var="addURL" windowState="<%= LiferayWindowState.POP_UP.toString() %>"
portletName="name">
<liferay-portlet:param name="jspPage" value="/html/person/edit_person_popup.jsp"/>
</liferay-portlet:renderURL>
<c:set var="portletURL" value="<%=addURL%>" />
<aui:a href="#" onClick="${portletNameSpaceVal}showPopup('${portletURL}')"><liferay-ui:icon image="add"/></aui:a> // this link triggers the pop up
<aui:select label="Country" name="countryCode" showEmptyOption="<%= true %>">
<%
for (Country country : countries) {
%>
<%
}
%>
</aui:select>
</aui:fieldset>
<aui:button-row>
<aui:button type="submit" />
<aui:button onClick="<%= viewURL %>" type="cancel" />
</aui:button-row>
</aui:form>
<aui:script>
function <portlet:namespace />showPopup(url) {
var url = url;
Liferay.Util.openWindow(
{
dialog: {
cache: false,
width:800,
modal: true,
centered: true
},
id: 'popUpId',
uri: url
}
);
}
</aui:script>
<aui:script>
Liferay.provide(window, 'refreshPortlet', function() {
var curPortlet = '#p_p_id<portlet:namespace/>';
Liferay.Portlet.refresh(curPortlet);
},
['aui-dialog','aui-dialog-iframe']
);
</aui:script>
<aui:script>
Liferay.provide(window, 'closePopup', function(dialogId) {
var A = AUI();
var dialog = Liferay.Util.Window.getById(dialogId);
dialog.destroy();
},
['liferay-util-window']
);
</aui:script>
然后我就得到了弹出的 portlet。
<aui:form action="<%= editURL %>" method="POST" name="fm" onSubmit="event.preventDefault();">
<aui:fieldset>
<aui:input name="name" />
<aui:input name="url" />
<aui:input name="address" />
</aui:fieldset>
<aui:button-row>
<aui:button type="submit" />
<aui:button name="cancel" value="Cancel"/>
</aui:button-row>
</aui:form>
<aui:script use="aui-base,aui-form-validator,aui-io-request">
AUI().use('aui-base','aui-form-validator','aui-io-request',function(A){
var rules = {
<portlet:namespace/>name: {
required: true
},
<portlet:namespace/>url: {
url: true
},
<portlet:namespace/>address: {
required: true
},
};
var fieldStrings = {
<portlet:namespace/>name: {
required: 'The Name field is required.'
},
<portlet:namespace/>address: {
required: 'The Address field is required.'
},
};
new A.FormValidator({
boundingBox: '#<portlet:namespace/>fm',
fieldStrings: fieldStrings,
rules: rules,
showAllMessages:true,
on: {
validateField: function(event) {
},
validField: function(event) {
},
errorField: function(event) {
},
submitError: function(event) {
event.preventDefault(); //prevent form submit
},
submit: function(event) {
var A = AUI();
var url = '<%=editURL.toString()%>';
A.io.request(
url,
{
method: 'POST',
form: {id: '<portlet:namespace/>fm'},
on: {
success: function() {
Liferay.Util.getOpener().refreshPortlet();
Liferay.Util.getOpener().closePopup('popUpId');
}
}
}
);
}
}
});
});
</aui:script>
<aui:script use="aui-base">
A.one('#<portlet:namespace/>cancel').on('click', function(event) {
Liferay.Util.getOpener().closePopup('popUpId);
});
</aui:script>
最佳答案
我认为你可以这样做:
- 您可以以 JSON 格式从服务器传递数据。
- 在
success
中获取该内容方法 - 将数据传输到父 JavaScript 函数
- 运行父级中的方法以更新
<aui:select>
.
弹出窗口成功方法中的一些示例代码:
success: function(responseData) {
// refresh method removed
// get the responseData as JSON or something from the server
Liferay.Util.getOpener().updateDataFromPopUp("JSON-data-passed");
Liferay.Util.getOpener().closePopup('popUpId');
}
在父级中:
<aui:script>
Liferay.provide(window, 'updateDataFromPopUp', function(jsonDataFromPopUp) {
// do something with the data here
}
);
</aui:script>
可能还有其他方法,但这是我现在能想到的。
<小时/>建议:
您可以在一个 <aui:script></aui:script>
中拥有所有功能而不是多次这样做。
希望这有帮助。
关于java - 将值从弹出 portlet 发送回父 portlet,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26056820/