Foren

Ajax in liferay 6

Srikanth Reddy, geändert vor 13 Jahren.

Ajax in liferay 6

Junior Member Beiträge: 53 Beitrittsdatum: 18.06.10 Neueste Beiträge
Hi Friends
Has liferay provided any implementation for an ajax call in liferay 6 .
as we had AjaxUtil in liferay 5.X.?
Actually i tried to implement an ajax in liferay 6 but the thing is that
I am not able to make a call to the servlet as im in Ext -environment.
I confirgured my servlet which handles the ajax request in web.xml file.
But my container is not able to find the mapping route of the servlet which i
configured in web.xml.
So can any one have any idea of how to do it in ExT environment .

Thanks in advance
Srikanth
thumbnail
Sheikh Sajid, geändert vor 13 Jahren.

RE: Ajax in liferay 6

New Member Beiträge: 17 Beitrittsdatum: 04.10.10 Neueste Beiträge
Hi Srikanth,

Liferay 6 provides new API for ajax.


var A = AUI(); 
A.use('aui-io-request', 
	function(aui) {
		A.io.request([b]<url>[/b], { 
			method : 'GET', 
			dataType : 'json', 
			on : { 
				success : function() { 
					alert(this.get('responseData').status); 
				} 
			} 
		});
	}
);
</url>


Replace the <url> with the url of your remote service. The response is available in the responseData as shown above. If you are expecting xml as response, then remove the dataType parameter. In this example, the response is json so we directly access the status field (assumed) from the response. If you want to know whether the service failed, then add failure parameter similar to success parameter above.

I have not tested with ext environment but this should wok there too.
Srikanth Reddy, geändert vor 13 Jahren.

RE: Ajax in liferay 6

Junior Member Beiträge: 53 Beitrittsdatum: 18.06.10 Neueste Beiträge
Hi Sajid,
thanks for sharing this code snippet,i think it will do my work!
But my only concern was that ,the url here call a servlet ,but configuring that
in web.xml in ext environment is giving me a prob,some time is not calling
my servlet .it gives 404 status error .ie. its not able to take my web
deployment descriptor.
how are servlets configured in EXT are called?

Thanks and Regards
Srikanth
simon tuffle, geändert vor 13 Jahren.

RE: Ajax in liferay 6

Regular Member Beiträge: 150 Beitrittsdatum: 18.05.09 Neueste Beiträge
Hey srikanth,


I am not much aware of ajax but below links may help you.
link1link2
thumbnail
Rendi Januar, geändert vor 13 Jahren.

RE: Ajax in liferay 6

New Member Beiträge: 13 Beitrittsdatum: 06.12.10 Neueste Beiträge
Hi Srikanth,

Before this, I'm using AJAX in ext environment but has the problem when redirect back again to jsp from JAVA.I don't know it same or not, just want to share knowledge.

So i do some tricked, i'm not direct the url to java, but i direct it to another jsp that have same action like in java.

this is the sample that i used, i'm using jQuery

function <portlet:namespace />setBankCode(){
		var urlAction='/html/portlet/enterprise_admin/user/ajax_bank.jsp';
		jQuery.ajax({
			url: urlAction,
			type: "post",
			dataType: "json",
			data: {			
				param: paramValue
			},					
			success:function(msg){
			   var paramJSON= msg.paramJSON;		
                           //this is the action 
			}							
		});
	}


This is action that i wrote in jsp that mention in url

&lt;%
	long paramValue= ParamUtil.getLong(request, "param");		
	JSONArray paramJSON= ParamLocalServiceUtil(paramValue);
	JSONObject obj = JSONFactoryUtil.createJSONObject();
	obj.put("paramJSON", paramJSON);
	out.println(obj.toString());
%&gt;


Okay this is code that i used. Hope it will help you.

Regards,
Rendi
David Thieffry, geändert vor 13 Jahren.

RE: Ajax in liferay 6

New Member Beitrag: 1 Beitrittsdatum: 11.02.11 Neueste Beiträge
Sheikh Sajid:
Hi Srikanth,

Liferay 6 provides new API for ajax.


var A = AUI(); 
A.use('aui-io-request', 
	function(aui) {
		A.io.request([b]<url>[/b], { 
			method : 'GET', 
			dataType : 'json', 
			on : { 
				success : function() { 
					alert(this.get('responseData').status); 
				} 
			} 
		});
	}
);
</url>


Replace the <url> with the url of your remote service. The response is available in the responseData as shown above. If you are expecting xml as response, then remove the dataType parameter. In this example, the response is json so we directly access the status field (assumed) from the response. If you want to know whether the service failed, then add failure parameter similar to success parameter above.

I have not tested with ext environment but this should wok there too.


HI,

I'm new to Liferay. I've got a lot of difficulty to perform a simple ajax call so I would like to try your code. First, I created a remote service but I don't know what is its URL. Where can I get it?

Thanks.
thumbnail
Sheikh Sajid, geändert vor 13 Jahren.

RE: Ajax in liferay 6

New Member Beiträge: 17 Beitrittsdatum: 04.10.10 Neueste Beiträge
David Thieffry:

HI,

I'm new to Liferay. I've got a lot of difficulty to perform a simple ajax call so I would like to try your code. First, I created a remote service but I don't know what is its URL. Where can I get it?

Thanks.



Hi David,

If you are calling a service hosted on your server, use ajax like this:


var A = AUI();
A.use('aui-io-request', function(aui) {
	Liferay.Service.[u]gis.GMap.getWeather[/u](
		{
		location : location
		},function(message) {
			//place your code here
		});
});


Replace the underlined code and the function parameters from the service.js file that is created in the js folder of your portlet docroot folder. Sample content of my docroot/js/service.js file

Liferay.Service.register("Liferay.Service.gis", "com.test.service");

Liferay.Service.registerClass(
	[u]Liferay.Service.gis[/u], "[u]GMap[/u]",
	{
		getDirections: true,
		[u]getWeather[/u]: true
	}
);


My remote service getWeather takes a single parameter 'location'. See the underlined code in my remote service. Match the same with your service.

Hope this helps.
X Man, geändert vor 12 Jahren.

RE: Ajax in liferay 6

Junior Member Beiträge: 41 Beitrittsdatum: 05.01.12 Neueste Beiträge
Hello Sheikh Sajid:
I tried your code, and it helps me greatly, but AJAX returns the current page.


var A = AUI();
A.use('aui-io-request',
function(aui) {
A.io.request('/html/portlet/journal/test1.jspf', {
method : 'GET',
dataType : 'json',
on : {
success : function() {
alert(this.get('responseData').status);
}
}
});
}
);



If you say something, it will be great, because any thing could help.
Thank you in advance.
thumbnail
Sujay Kumar Paul, geändert vor 10 Jahren.

RE: Ajax in liferay 6

Regular Member Beiträge: 164 Beitrittsdatum: 28.10.11 Neueste Beiträge
Hi,

Can any one please tell me how to get the value of data from struts 2 action class.

Thanks in advance.
thumbnail
Sujay Kumar Paul, geändert vor 10 Jahren.

RE: Ajax in liferay 6

Regular Member Beiträge: 164 Beitrittsdatum: 28.10.11 Neueste Beiträge
Hi,

Can any one please tell me how to get the value of data from struts 2 action class.

Thanks in advance.
thumbnail
Ravi Kumar Gupta, geändert vor 13 Jahren.

RE: Ajax in liferay 6

Liferay Legend Beiträge: 1302 Beitrittsdatum: 24.06.09 Neueste Beiträge
Alternatively you can use jquery.. but of course recommended is AUI.

include jquery and use like this

$.post("myurl.jsp", { firstName: "Ravi", lastName: "Gupta" },
function(data){
alert("Data Loaded: " + data);
});

where function will be called once the request is completed..

Cheers!!!
thumbnail
Ravi Kumar Gupta, geändert vor 13 Jahren.

RE: Ajax in liferay 6

Liferay Legend Beiträge: 1302 Beitrittsdatum: 24.06.09 Neueste Beiträge
Adding more..

I have created a simple ajax portlet using JQuery and added to sourceforge.

Can be found here

Thanks
Ravi Gupta
Ricardo Viegas, geändert vor 13 Jahren.

RE: Ajax in liferay 6

New Member Beiträge: 3 Beitrittsdatum: 15.04.10 Neueste Beiträge
Im trying to just implement two combobox with country and region (the regions being updated acording to country).
Im interest in using the alloy librarys, can you guys give a hint please.
Thanks a lot
thumbnail
Raja Seth, geändert vor 12 Jahren.

RE: Ajax in liferay 6

Regular Member Beiträge: 233 Beitrittsdatum: 18.08.11 Neueste Beiträge
Thanks Ravi for your help... emoticon
thumbnail
Sagar A Vyas, geändert vor 12 Jahren.

RE: Ajax in liferay 6

Liferay Master Beiträge: 679 Beitrittsdatum: 17.04.09 Neueste Beiträge
Hi Guys,

Please check out this url.

It shows good example for ajax in Liferay.

http://www.excession.org.uk/blog/liferay-and-ajax.html


Thanks,
Sagar Vyas
thumbnail
yaragad from Spain, geändert vor 12 Jahren.

RE: Ajax in liferay 6

Junior Member Beiträge: 52 Beitrittsdatum: 15.03.11 Neueste Beiträge
What's wrong here?
Im using a simple Servlet (http://myurl.com/servlet.do) and LF6 portlet (http://someLiferayURL.com/home).

My JSP

&lt;%@ taglib uri="http://java.sun.com/portlet" prefix="portlet" %&gt;
&lt;%@ taglib uri="http://liferay.com/tld/theme" prefix="liferay-theme" %&gt; 
&lt;%@ taglib uri="http://liferay.com/tld/aui" prefix="aui" %&gt; 

<liferay-theme:defineobjects />
<portlet:renderurl var="renderURL" />

<script language="JavaScript">
var A = AUI(); 
A.use('aui-io-request', 
	function(aui) {
                alert("Im here");
		A.io.request('http://myurl.com/servlet.do', { 
			method : 'GET', 
			on : { 
				success : function() { 
					alert(this.get('responseData').status); 
				} 
			} 
		});
	}
);
</script>


If I enter http://myurl.com/servlet.do as URL on IE, Firefox or Chrome I get my Servlet response data ("Hello"). But there is no response on the portlet...
Also, alert("Im here") is displayed and there are no errors on Firebug console.
Any idea?
thumbnail
Mika Koivisto, geändert vor 12 Jahren.

RE: Ajax in liferay 6

Liferay Legend Beiträge: 1519 Beitrittsdatum: 07.08.06 Neueste Beiträge
Here's how I've done Ajax with Alloy:

<form>
	<input type="button" id="<portlet:namespace />incrementBtn" value="Increment">
</form>

<aui:script use="io">
	A.one("#<portlet:namespace />incrementBtn").on("click", function(e) {
		e.preventDefault();

		<portlet:namespace />incrementCounter();
	});

	var <portlet:namespace />incrementCounter = function() {
		A.io(
			'&lt;%= jsonURL %&gt;',
			{
				on: {
					success: <portlet:namespace />processResponse
				}
			}
		);
	};

	var <portlet:namespace />processResponse = function(id, obj) {
			var response = A.JSON.parse(obj.responseText);
			var countSpan = A.one("#<portlet:namespace />count");
			countSpan.text(response.count);
	};
</aui:script>


See the full code and working plugin here: https://github.com/mikakoivisto/liferay-random-plugins/blob/master/portlets/sample-ajax-portlet/docroot/view.jsp
thumbnail
krunal b soni, geändert vor 13 Jahren.

RE: Ajax in liferay 6

Junior Member Beiträge: 29 Beitrittsdatum: 04.01.10 Neueste Beiträge
Hi Srikanth,

If you are not getting familiar with YUI or Jquery Ajax call. Try DWR for Ajax with Liferay. I have used it and its very easy to implement (regardless of your Liferay version). For basic understanding of DWR (Direct web remoting) you can go through its website.

click on below link

http://directwebremoting.org/dwr/index.html


To get basic idea how you can implement DWR with Liferay see below WIKI page.

http://www.liferay.com/community/wiki/-/wiki/Main/Using+DWR+for+AJAX

Thanks,
Krunal Soni
thumbnail
Pranay R Patadiya, geändert vor 13 Jahren.

RE: Ajax in liferay 6

Regular Member Beiträge: 177 Beitrittsdatum: 23.02.10 Neueste Beiträge
Hi,

Yes, I have used DWR thoroughly in my current project and gives a number of functionality against AJAX or JSON.

Thanks,
Pranay Patadiya
Aston Chan, geändert vor 13 Jahren.

RE: Ajax in liferay 6

New Member Beiträge: 6 Beitrittsdatum: 10.12.10 Neueste Beiträge
Hi,

In your example, you have:


var A = AUI();
A.use('aui-io-request', function(aui) {
Liferay.Service.gis.GMap.getWeather(
{
location : location
},function(message) {
//place your code here
});
});

The question is, how do I invoke his getWeather() function from outside this scope?

Say, I have a button or a link, when user click on it, I need to make a service call getWeather(). How do I do that since Liferay.Service.gis.GMap.getWeather() is inside the scope of A.use(){} ?

Thanks.
Aston Chan, geändert vor 13 Jahren.

RE: Ajax in liferay 6

New Member Beiträge: 6 Beitrittsdatum: 10.12.10 Neueste Beiträge
I was so confused. It is as simple as:

this.myFunc = function() {
var A = AUI();
A.use('aui-io-request', function(aui) {
Liferay.Service.gis.GMap.getWeather(
{
location : location
},function(message) {
//place your code here
});
});
};


And then later on, do this.myFunc().

Sorry about the noise...
Aston Chan, geändert vor 13 Jahren.

RE: Ajax in liferay 6

New Member Beiträge: 6 Beitrittsdatum: 10.12.10 Neueste Beiträge
I think I'm very close. The only thing missing is how do I pass parameters to my ajax call?

E.g.

this.myFunc = function() {
var A = AUI();
A.use('aui-io-request', function(aui) {
Liferay.Service.gis.GMap.getWeather(
{
location : location
},function(message) {
//place your code here
});
});
};

Where is that location value come from? In the above case, I want to call myFunc with a location value. How do I do it?

Thanks again.
thumbnail
Hitoshi Ozawa, geändert vor 13 Jahren.

RE: Ajax in liferay 6

Liferay Legend Beiträge: 7942 Beitrittsdatum: 24.03.10 Neueste Beiträge
This thread my help you.

http://www.liferay.com/ja/community/forums/-/message_boards/message/7146031
thumbnail
Sheikh Sajid, geändert vor 12 Jahren.

RE: Ajax in liferay 6

New Member Beiträge: 17 Beitrittsdatum: 04.10.10 Neueste Beiträge
Aston Chan:
I think I'm very close. The only thing missing is how do I pass parameters to my ajax call?

E.g.

this.myFunc = function() {
var A = AUI();
A.use('aui-io-request', function(aui) {
Liferay.Service.gis.GMap.getWeather(
{
location : location
},function(message) {
//place your code here
});
});
};

Where is that location value come from? In the above case, I want to call myFunc with a location value. How do I do it?

Thanks again.


Sorry for the delayed reply. Haven't been checking the forum of late.

The 'location' on the right hand side is a javaScript variable. It can be any javascript variable.