« Zurück zu AJAX

Ajax in Liferay 5

Form submission #

As of Liferay 5 , form submission is done using JQuery and the LiferayWindowState.EXCLUSIVE window state , that will return just the HTML snippet produced by the portlet.

The following code sample demonstrates the pattern of progressive enhancement where the form will submit without Javascript as well as with (To work with less capable devices .etc.

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib uri="http://java.sun.com/portlet" prefix="portlet" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page import="com.liferay.portal.kernel.portlet.LiferayWindowState" %>

<div id="<portlet:namespace />lgoUsers">
<script type="text/javascript">
jQuery(function($){

var <portlet:namespace/>form = $('#'+'<portlet:namespace />fm');

<portlet:namespace/>form.bind("submit",function(event){
	   event.preventDefault();
	   var inputs = $("input, textarea, select", <portlet:namespace/>form);
	   var url = '<portlet:actionURL windowState="<%= LiferayWindowState.EXCLUSIVE.toString() %>"/>' + "&" + inputs.serialize(); // see note below
	   $('#<portlet:namespace />lgoUsers').load(url);
});

});
</script>

<form
action="<portlet:actionURL/>"
method="post"
name="<portlet:namespace />fm"
id="<portlet:namespace />fm">

<input name="<portlet:namespace />sn" type="text" value="<c:out value="${sn}"/>" />
<input type="submit" name="<portlet:namespace />sm" value="Search" />
</form>
<ul>
<c:forEach items="${users}" var="user">
	<li><c:out value="${user}"/></li>
</c:forEach>
</ul>
</div>
0 Anhänge
59156 Angesehen
Durchschnitt (0 Stimmen)
Die durchschnittliche Bewertung ist 0.0 von max. 5 Sternen.
Kommentare
Antworten im Thread Autor Datum
BUG: jQuery('#'+'<portlet:namespace />fm'); -... Fuad Efendi 15. November 2008 18:39
hi, i've got problem ajax in liferay... delang j 2. Dezember 2009 22:35
What if you have multiple Ajax calls on the... Michael Poznecki 4. Januar 2010 12:08
FYI, I've posted a demonstration portlet using... Jeff Robinson 19. Juli 2009 05:38
is there anyway to implement something like... dennis monsewicz 4. August 2009 15:00
Great sample. A little step-by-step... Ilya V. Kalujny 14. September 2009 05:48
Last version of this wiki is unreadable.... Felix Ashirov 18. November 2011 04:57

BUG:
jQuery('#'+'<portlet:namespace />fm');
- called before form is defined in HTML... Quick fix: move javascript block after form definition.
Gepostet am 15.11.08 18:39.
FYI, I've posted a demonstration portlet using code at the following link:

http://www.robisoft.com/downloads/hello-jquery-portlet/
Gepostet am 19.07.09 05:38.
is there anyway to implement something like this in PHP?
Gepostet am 04.08.09 15:00 als Antwort auf Jeff Robinson.
Great sample. A little step-by-step instructions wont hurt tho emoticon
Gepostet am 14.09.09 05:48 als Antwort auf Jeff Robinson.
hi,
i've got problem ajax in liferay
http://www.liferay.com/web/guest/community/forums/-/message_boards/messag­e/4285302

breadcrumb and search form appear twice, any idea to solve this?
Gepostet am 02.12.09 22:35 als Antwort auf Fuad Efendi.
What if you have multiple Ajax calls on the same page? How do you make the URL? Would you call multiple backend beans? Or, if you called the same backend bean, how would you handle the logic in the bean?
Gepostet am 04.01.10 12:08 als Antwort auf delang j.
Last version of this wiki is unreadable. Version 1.3 looks fine.
Gepostet am 18.11.11 04:57.