Accessing JSON through javascript in custom portlet

Scenrio:
 
        Accessing the other custom portlet JSON services in our custom portlet through the javascript.

Step:1

Enable remote-servie = true in service.xml as shown and build service to generate the services

<service-builder package-path="com.liferay.testjson">
<namespace>custom</namespace>
         <entity name="jsontest" remote-service="true" local-service="true" uuid="true">
 
                   <column name="id" type="int" primary="true" />
 
                    <column name="name" type="String"></column>
                    <column name="desc" type="String"></column>
    </entity>
 
</service-builder>

Step2:

  Open the class XXXXServiceImpl.class and write a method that you want to access in other portlet.

  Here i have written getUsers method to reteive the count of users

public int getUsers() {
int userCount = 0;
try {
userCount = UserLocalServiceUtil.getUsersCount();
} catch (SystemException e) {
e.printStackTrace();
}
return userCount;
}

  Again build the service.  You can see the Service.js is generated in docroot/js folder

Step3:

      Open the web.xml and paste the following entries , We Can details of this in the following URL.

http://www.liferay.com/documentation/liferay-portal/6.1/development/-/ai/json-web-services

  <web-app>
        ...
        <filter>
            <filter-name>Secure JSON Web Service Servlet Filter</filter-name>
            <filter-class>com.liferay.portal.kernel.servlet.PortalClassLoaderFilter</filter-class>
            <init-param>
                <param-name>filter-class</param-name>
                <param-value>com.liferay.portal.servlet.filters.secure.SecureFilter</param-value>
            </init-param>
            <init-param>
                <param-name>basic_auth</param-name>
                <param-value>true</param-value>
            </init-param>
            <init-param>
                <param-name>portal_property_prefix</param-name>
                <param-value>jsonws.servlet.</param-value>
            </init-param>
        </filter>
        <filter-mapping>
            <filter-name>Secure JSON Web Service Servlet Filter</filter-name>
            <url-pattern>/api/jsonws/*</url-pattern>
        </filter-mapping>

        <servlet>
            <servlet-name>JSON Web Service Servlet</servlet-name>
            <servlet-class>com.liferay.portal.kernel.servlet.PortalClassLoaderServlet</servlet-class>
            <init-param>
                <param-name>servlet-class</param-name>
                <param-value>com.liferay.portal.jsonwebservice.JSONWebServiceServlet</param-value>
            </init-param>
            <load-on-startup>0</load-on-startup>
        </servlet>
        <servlet-mapping>
            <servlet-name>JSON Web Service Servlet</servlet-name>
            <url-pattern>/api/jsonws/*</url-pattern>
        </servlet-mapping>
        ...
    </web-app>

and deploy the portlet ,

Step:4 Open the browser and access the http://localhost:8081/TestJSON-portlet/api/jsonws/ to acess the JSON webservices

We will see the screen with our custom method as

Click on the getUsers on the left side pane and click on the invoke button to get results.

Then we can able to see 4 tabs as Result , javascript example ,crul example and URLExample Just here we need only javascript Example .Copy that javascript example which we will be using in Other custom portlet.

How to access the this Javascript in Other custom portlet? Here We go,



Step5: Create the Another portlet to access this javascript


<script type="text/javascript">

AUI().ready('aui-io',
Liferay.Service('/TestJSON-portlet#jsontest/get-users',
                    function(obj) {
                         console.log(obj);
                       }
successCallback = function(m) {
alert("m is "+m);
}
exceptionCallback = function(m) {
alert(" exception m is "+m);
                        }
                );

);
</script>


on the page load we can able to see the alert message. Thats it! You have done . Try with different method.