Ajax form submit in liferay.
Sometimes liferay developer need to submit form in ajax. Here below i share my experience for on ajax form submit in liferay.
You can download source code from here..
Below the view.jsp:
<%--
--%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/xml" prefix="x" %>
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<%@ taglib uri="http://liferay.com/tld/aui" prefix="aui" %>
<%@ taglib uri="http://liferay.com/tld/ddm" prefix="liferay-ddm" %>
<%@ taglib uri="http://liferay.com/tld/portlet" prefix="liferay-portlet" %>
<%@ taglib uri="http://liferay.com/tld/security" prefix="liferay-security" %>
<%@ taglib uri="http://liferay.com/tld/theme" prefix="liferay-theme" %>
<%@ taglib uri="http://liferay.com/tld/ui" prefix="liferay-ui" %>
<%@ taglib uri="http://liferay.com/tld/util" prefix="liferay-util" %>
<%@ page import="com.liferay.portlet.journal.service.*" %>
<%@ page import="com.liferay.portlet.journal.model.*" %>
<%@ page import="com.liferay.portal.kernel.workflow.WorkflowConstants" %>
<%@ page import="com.liferay.portal.kernel.language.LanguageUtil"%>
<%@ page import="com.liferay.portal.kernel.util.LocalizationUtil"%>
<%@ page import="com.liferay.portlet.journalcontent.util.JournalContentUtil"%>
<%@ page import="com.liferay.portlet.messageboards.service.MBMessageLocalServiceUtil"%>
<%@ page import="com.liferay.portal.util.PortalUtil"%>
<%@ page import="com.liferay.portal.kernel.util.PropsUtil"%>
<%@ page import="com.liferay.portal.util.PortletKeys"%>
<%@ page import="com.liferay.portal.kernel.util.CalendarUtil"%>
<%@ page import="com.liferay.portal.kernel.util.HtmlUtil" %>
<%@ page import="com.liferay.portal.kernel.bean.BeanParamUtil"%>
<%@page import="com.liferay.portal.kernel.portlet.LiferayWindowState"%>
<%@page import="com.liferay.portlet.PortletURLFactoryUtil"%>
<%@page import="com.liferay.portal.kernel.util.ParamUtil"%>
<%@ page import="com.liferay.portal.kernel.util.Validator"%>
<%@ page import="com.liferay.portal.kernel.util.LocaleUtil"%>
<%@ page import="com.liferay.portal.kernel.util.UnicodeFormatter"%>
<%@ page import="com.liferay.portal.kernel.util.Constants"%>
<%@ page import="com.liferay.portal.service.*" %>
<%@ page import="com.liferay.portal.model.*" %>
<%@
page import="javax.portlet.MimeResponse" %><%@
page import="javax.portlet.PortletConfig" %><%@
page import="javax.portlet.PortletContext" %><%@
page import="javax.portlet.PortletException" %><%@
page import="javax.portlet.PortletMode" %><%@
page import="javax.portlet.PortletPreferences" %><%@
page import="javax.portlet.PortletRequest" %><%@
page import="javax.portlet.PortletResponse" %><%@
page import="javax.portlet.PortletURL" %><%@
page import="javax.portlet.ResourceURL" %><%@
page import="javax.portlet.UnavailableException" %><%@
page import="javax.portlet.ValidatorException" %><%@
page import="javax.portlet.WindowState" %><%@
page import="java.util.*" %><%@
page import="java.text.*" %><%@
page contentType="text/html; charset=UTF-8" %><%@
page import="java.net.URLEncoder" %>
<portlet:defineObjects />
<portlet:actionURL name="addStatusEntry" var="addStatusEntryURL" />
<portlet:resourceURL var="addStatusEntryResourceURL">
<portlet:param name="<%=Constants.CMD%>" value="addStatusEntry" />
</portlet:resourceURL>
<aui:form method="POST" action="javascript:void();" name="actionUrl" id="actionUrl">
<aui:input type="textarea" name="content" placeholder="What are you working on?" cssClass="status-content"></aui:input>
<aui:input name="test"/>
<div class="clearfix">
<a class="btn btn-primary pull-right" onClick="updateStatusFormActionUrl();" id='<portlet:namespace/>stausSubmit'>Post</a>
</div>
</aui:form>
<aui:form method="POST" action="javascript:void();" name="resourceURl" id="resourceURl">
<aui:input type="textarea" name="content" placeholder="What are you working on?" cssClass="status-content"></aui:input>
<aui:input name="test"/>
<div class="clearfix">
<a class="btn btn-primary pull-right" onClick="updateStatusFormResourceURL();" id='<portlet:namespace/>stausSubmit'>Post</a>
</div>
</aui:form>
<aui:script use="aui-io-request,aui-node">
Liferay.provide(window,'updateStatusFormActionUrl',
function() {
var A = AUI();
A.io.request('<%=addStatusEntryURL%>',{
method: 'POST',
form: { id: '<portlet:namespace/>actionUrl' },
on: {
success: function(){
///Here code after sucess
}
}
});
});
Liferay.provide(window,'updateStatusFormResourceURL',
function() {
var A = AUI();
A.io.request('<%=addStatusEntryResourceURL%>',{
method: 'POST',
form: { id: '<portlet:namespace/>resourceURl' },
on: {
success: function(){
///Here code after sucess
}
}
});
});
</aui:script>Below java action code:
/**
*
*/
package tariqliferay.blogspot.com;
import java.io.IOException;
import javax.portlet.ActionRequest;
import javax.portlet.ActionResponse;
import javax.portlet.PortletException;
import javax.portlet.ProcessAction;
import javax.portlet.RenderRequest;
import javax.portlet.RenderResponse;
import javax.portlet.ResourceRequest;
import javax.portlet.ResourceResponse;
import com.liferay.portal.kernel.util.Constants;
import com.liferay.portal.kernel.util.ParamUtil;
import com.liferay.util.bridges.mvc.MVCPortlet;
/**
* @author tariqliferay.blogspot.com
*
*/
public class AjaxFormSubmit extends MVCPortlet {
@Override
public void doView(RenderRequest renderRequest,
RenderResponse renderResponse) throws IOException, PortletException {
// TODO Auto-generated method stub
super.doView(renderRequest, renderResponse);
}
@Override
public void serveResource(ResourceRequest resourceRequest,
ResourceResponse resourceResponse) throws IOException,
PortletException {
// TODO Auto-generated method stub
String cmd = ParamUtil.getString(resourceRequest, Constants.CMD);
if (cmd.equals("addStatusEntry")) {
String content = ParamUtil.getString(resourceRequest, "content");
String test = ParamUtil.getString(resourceRequest, "test");
System.out.println(content+test);
}
}
@Override
public void render(RenderRequest request, RenderResponse response)
throws PortletException, IOException {
// TODO Auto-generated method stub
super.render(request, response);
}
@ProcessAction(name="addStatusEntry")
public void addStatusEntry(ActionRequest actionRequest,
ActionResponse actionResponse) throws IOException, PortletException {
// TODO Auto-generated method stub
String content = ParamUtil.getString(actionRequest, "content");
String test = ParamUtil.getString(actionRequest, "test");
System.out.println(content+test);
}
}
You can download source code from here..
Below the view.jsp:
<%--
--%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/xml" prefix="x" %>
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<%@ taglib uri="http://liferay.com/tld/aui" prefix="aui" %>
<%@ taglib uri="http://liferay.com/tld/ddm" prefix="liferay-ddm" %>
<%@ taglib uri="http://liferay.com/tld/portlet" prefix="liferay-portlet" %>
<%@ taglib uri="http://liferay.com/tld/security" prefix="liferay-security" %>
<%@ taglib uri="http://liferay.com/tld/theme" prefix="liferay-theme" %>
<%@ taglib uri="http://liferay.com/tld/ui" prefix="liferay-ui" %>
<%@ taglib uri="http://liferay.com/tld/util" prefix="liferay-util" %>
<%@ page import="com.liferay.portlet.journal.service.*" %>
<%@ page import="com.liferay.portlet.journal.model.*" %>
<%@ page import="com.liferay.portal.kernel.workflow.WorkflowConstants" %>
<%@ page import="com.liferay.portal.kernel.language.LanguageUtil"%>
<%@ page import="com.liferay.portal.kernel.util.LocalizationUtil"%>
<%@ page import="com.liferay.portlet.journalcontent.util.JournalContentUtil"%>
<%@ page import="com.liferay.portlet.messageboards.service.MBMessageLocalServiceUtil"%>
<%@ page import="com.liferay.portal.util.PortalUtil"%>
<%@ page import="com.liferay.portal.kernel.util.PropsUtil"%>
<%@ page import="com.liferay.portal.util.PortletKeys"%>
<%@ page import="com.liferay.portal.kernel.util.CalendarUtil"%>
<%@ page import="com.liferay.portal.kernel.util.HtmlUtil" %>
<%@ page import="com.liferay.portal.kernel.bean.BeanParamUtil"%>
<%@page import="com.liferay.portal.kernel.portlet.LiferayWindowState"%>
<%@page import="com.liferay.portlet.PortletURLFactoryUtil"%>
<%@page import="com.liferay.portal.kernel.util.ParamUtil"%>
<%@ page import="com.liferay.portal.kernel.util.Validator"%>
<%@ page import="com.liferay.portal.kernel.util.LocaleUtil"%>
<%@ page import="com.liferay.portal.kernel.util.UnicodeFormatter"%>
<%@ page import="com.liferay.portal.kernel.util.Constants"%>
<%@ page import="com.liferay.portal.service.*" %>
<%@ page import="com.liferay.portal.model.*" %>
<%@
page import="javax.portlet.MimeResponse" %><%@
page import="javax.portlet.PortletConfig" %><%@
page import="javax.portlet.PortletContext" %><%@
page import="javax.portlet.PortletException" %><%@
page import="javax.portlet.PortletMode" %><%@
page import="javax.portlet.PortletPreferences" %><%@
page import="javax.portlet.PortletRequest" %><%@
page import="javax.portlet.PortletResponse" %><%@
page import="javax.portlet.PortletURL" %><%@
page import="javax.portlet.ResourceURL" %><%@
page import="javax.portlet.UnavailableException" %><%@
page import="javax.portlet.ValidatorException" %><%@
page import="javax.portlet.WindowState" %><%@
page import="java.util.*" %><%@
page import="java.text.*" %><%@
page contentType="text/html; charset=UTF-8" %><%@
page import="java.net.URLEncoder" %>
<portlet:defineObjects />
<portlet:actionURL name="addStatusEntry" var="addStatusEntryURL" />
<portlet:resourceURL var="addStatusEntryResourceURL">
<portlet:param name="<%=Constants.CMD%>" value="addStatusEntry" />
</portlet:resourceURL>
<aui:form method="POST" action="javascript:void();" name="actionUrl" id="actionUrl">
<aui:input type="textarea" name="content" placeholder="What are you working on?" cssClass="status-content"></aui:input>
<aui:input name="test"/>
<div class="clearfix">
<a class="btn btn-primary pull-right" onClick="updateStatusFormActionUrl();" id='<portlet:namespace/>stausSubmit'>Post</a>
</div>
</aui:form>
<aui:form method="POST" action="javascript:void();" name="resourceURl" id="resourceURl">
<aui:input type="textarea" name="content" placeholder="What are you working on?" cssClass="status-content"></aui:input>
<aui:input name="test"/>
<div class="clearfix">
<a class="btn btn-primary pull-right" onClick="updateStatusFormResourceURL();" id='<portlet:namespace/>stausSubmit'>Post</a>
</div>
</aui:form>
<aui:script use="aui-io-request,aui-node">
Liferay.provide(window,'updateStatusFormActionUrl',
function() {
var A = AUI();
A.io.request('<%=addStatusEntryURL%>',{
method: 'POST',
form: { id: '<portlet:namespace/>actionUrl' },
on: {
success: function(){
///Here code after sucess
}
}
});
});
Liferay.provide(window,'updateStatusFormResourceURL',
function() {
var A = AUI();
A.io.request('<%=addStatusEntryResourceURL%>',{
method: 'POST',
form: { id: '<portlet:namespace/>resourceURl' },
on: {
success: function(){
///Here code after sucess
}
}
});
});
</aui:script>Below java action code:
/**
*
*/
package tariqliferay.blogspot.com;
import java.io.IOException;
import javax.portlet.ActionRequest;
import javax.portlet.ActionResponse;
import javax.portlet.PortletException;
import javax.portlet.ProcessAction;
import javax.portlet.RenderRequest;
import javax.portlet.RenderResponse;
import javax.portlet.ResourceRequest;
import javax.portlet.ResourceResponse;
import com.liferay.portal.kernel.util.Constants;
import com.liferay.portal.kernel.util.ParamUtil;
import com.liferay.util.bridges.mvc.MVCPortlet;
/**
* @author tariqliferay.blogspot.com
*
*/
public class AjaxFormSubmit extends MVCPortlet {
@Override
public void doView(RenderRequest renderRequest,
RenderResponse renderResponse) throws IOException, PortletException {
// TODO Auto-generated method stub
super.doView(renderRequest, renderResponse);
}
@Override
public void serveResource(ResourceRequest resourceRequest,
ResourceResponse resourceResponse) throws IOException,
PortletException {
// TODO Auto-generated method stub
String cmd = ParamUtil.getString(resourceRequest, Constants.CMD);
if (cmd.equals("addStatusEntry")) {
String content = ParamUtil.getString(resourceRequest, "content");
String test = ParamUtil.getString(resourceRequest, "test");
System.out.println(content+test);
}
}
@Override
public void render(RenderRequest request, RenderResponse response)
throws PortletException, IOException {
// TODO Auto-generated method stub
super.render(request, response);
}
@ProcessAction(name="addStatusEntry")
public void addStatusEntry(ActionRequest actionRequest,
ActionResponse actionResponse) throws IOException, PortletException {
// TODO Auto-generated method stub
String content = ParamUtil.getString(actionRequest, "content");
String test = ParamUtil.getString(actionRequest, "test");
System.out.println(content+test);
}
}
What about form validation? Does it work even without an explicit "submit"?
ReplyDeleteHere i try to show how form can submit in ajax..not form validation...form
ReplyDeleteYes it works without explicit submit..@Marco Rosetti..