微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦！

如何在Liferay中使用Ajax请求提交表单？

分类：Ajax作者：编程之家
我是liferay门户的新手.我已经开发了一个portlet在liferay演示.在这个例子中我使用了portlet通信.我正在做的是： – 我有一个搜索portlet,我有一个文本框搜索.当我点击搜索按钮时,它从数据库中获取数据,并使用搜索包含在另一个portlet中显示该数据.我为此项目使用ProcessEvent和ActionEvent注释.

现在我想要的是当我点击搜索按钮,然后不应该刷新页面(即我希望使用AJAX的概念),数据应该显示在其他portlet上.

代码片段

Portlet A – view.jsp

<%@include file="/html/init.jsp"%>
<portlet:defineObjects />

<!--

<portlet:actionURL var="actionURL" name="pitchBall"></portlet:actionURL>

//-->
**Change to Resource URL**
<portlet:resourceURL var="resourceURL">
</portlet:resourceURL>


<aui:form method="POST" action="<%= resourceURL%>" name="    <portlet:namespace>fm1</portlet:namespace>">
    <aui:input name="search" id="search" />
    <aui:button type="submit" name="Search" value="Search" />
</aui:form>

Portlet A – SearchPortlet类

package com.test;

/**
 * Portlet implementation class SearchPortlet
 */
public class SearchPortlet extends GenericPortlet {

    @Override
    public void render(RenderRequest request,RenderResponse response)
            throws PortletException,IOException {
        // Todo Auto-generated method stub
        super.render(request,response);

    }

    @ProcessAction(name="pitchBall") 
    public void pitchBall(ActionRequest request,ActionResponse response) throws SystemException {
        String name = ParamUtil.getString(request,"search");       
        QName qName = new QName("http://liferay.com/events","ipc.pitch");
        response.setEvent(qName,name);
    }

    public void init() {
        editJSP = getinitParameter("edit-jsp");
        helpJSP = getinitParameter("help-jsp");
        viewJSP = getinitParameter("view-jsp");
    }

    public void doEdit(
            RenderRequest renderRequest,RenderResponse renderResponse)
        throws IOException,PortletException {

        include(editJSP,renderRequest,renderResponse);
    }

    public void doHelp(
            RenderRequest renderRequest,PortletException {

        include(helpJSP,renderResponse);
    }

    @Override
    public void doView(
            RenderRequest renderRequest,PortletException {
        //super.doView(renderRequest,renderResponse);
        System.out.println("In doView code");

        renderResponse.setContentType(renderRequest.getResponseContentType());

        // file to display...
        String url = "/html/searchportlet/view.jsp";

        // read the above file and output it...
        getPortletContext().getRequestdispatcher(url).include(renderRequest,renderResponse);
        //include(viewJSP,renderResponse);
    }

    @Override
    public void serveResource(ResourceRequest request,ResourceResponse response)
            throws PortletException,IOException {
        // Todo Auto-generated method stub
        //super.serveResource(request,response);
         System.out.println("In serveResource code");

         response.setContentType("text/html");

         String name = request.getParameter("search");

         // this seems to be the page that was calling...?
         String resourceID = request.getResourceID();
         System.out.println("resourceId was : " + resourceID);


         System.out.println("message was : " + name);
         PrintWriter writer = response.getWriter();

         writer.print(name);
    }

    protected void include(
            String path,RenderRequest renderRequest,PortletException {

        PortletRequestdispatcher portletRequestdispatcher =
            getPortletContext().getRequestdispatcher(path);

        if (portletRequestdispatcher == null) {
            _log.error(path + " is not a valid include");
        }
        else {
            portletRequestdispatcher.include(renderRequest,renderResponse);
        }
    }

    protected String editJSP;
    protected String helpJSP;
    protected String viewJSP;

    private static Log _log = LogFactoryUtil.getLog(SearchPortlet.class);

}

Portlet B – view.jsp

<%@include file="/html/init.jsp"%>
<portlet:defineObjects />

<%
String name = (String)renderRequest.getParameter("name");
%>

<liferay-ui:search-container
    emptyResultsMessage="author-empty-results-message">

    <liferay-ui:search-container-results
        results="<%= KeyurAuthorLocalServiceUtil.getStudentByName(name) %>" />

    <liferay-ui:search-container-row className="com.test.model.KeyurAuthor">

        <liferay-ui:search-container-column-text name="authorId"
            property="authorId" />
        <liferay-ui:search-container-column-text name="authorName"
            property="authorName" />
        <liferay-ui:search-container-column-text name="authorEmail"
            property="authorEmail" />
    </liferay-ui:search-container-row>

    <liferay-ui:search-iterator></liferay-ui:search-iterator>


</liferay-ui:search-container>

Portlet B – SearchResultPortlet类

/**
 * Portlet implementation class SearchResultPortlet
 */
public class SearchResultPortlet extends GenericPortlet {

    public void init() {
        editJSP = getinitParameter("edit-jsp");
        helpJSP = getinitParameter("help-jsp");
        viewJSP = getinitParameter("view-jsp");
    }

    @ProcessEvent(qname="{http://liferay.com/events}ipc.pitch")
    public void catchBall(EventRequest request,EventResponse response) {
        Event event = request.getEvent();
        String name = (String)event.getValue();
        response.setRenderParameter("name",name);
    }

    public void doEdit(
            RenderRequest renderRequest,RenderResponse renderResponse)
    throws IOException,renderResponse);
    }

    public void doView(
            RenderRequest renderRequest,PortletException {

        include(viewJSP,renderResponse);
    }

    protected void include(
            String path,renderResponse);
        }
    }

    protected String editJSP;
    protected String helpJSP;
    protected String viewJSP;

    private static Log _log = LogFactoryUtil.getLog(SearchResultPortlet.class);

}
在门户上进行ajax请求时,您的portlet应该实现 
javax.portlet.ResourceServingPortlet

GenericPortlet已经执行,但是您要覆盖它,而不是使用< portlet：actionURL />您应该使用< portlet：resourceURL />从行动开始.

在您的设置中,您应该具有关键字隐藏字段的搜索表单,然后在搜索portlet中单击提交按钮,您应该使用IPC从该表单中复制关键字,以搜索结果portlet并调用搜索结果提交(不提交表单搜索portlet(A)).

您的SearchResultPortlet类应该是

public class SearchResultPortlet extends GenericPortlet {
    ...
    public void serveResource(ResourceRequest request,ResourceResponse response) throws PortletException,java.io.IOException {
       // do search and return result
    }
    ...
}

编辑：完整的例子

SearchForm

import java.io.IOException;

import javax.portlet.GenericPortlet;
import javax.portlet.PortletException;
import javax.portlet.RenderRequest;
import javax.portlet.RenderResponse;

public class SearchForm extends GenericPortlet {

    @Override
    protected void doView(RenderRequest p_request,RenderResponse p_response) throws PortletException,IOException {
        getPortletContext().getRequestdispatcher("/WEB-INF/jsp/search.jsp").include(p_request,p_response);
    }
}

搜索结果

import java.io.IOException;

import javax.portlet.GenericPortlet;
import javax.portlet.PortletException;
import javax.portlet.RenderRequest;
import javax.portlet.RenderResponse;
import javax.portlet.ResourceRequest;
import javax.portlet.ResourceResponse;

public class SearchResult extends GenericPortlet {

    @Override
    protected void doView(RenderRequest p_request,IOException {
        getPortletContext().getRequestdispatcher("/WEB-INF/jsp/result.jsp").include(p_request,p_response);
    }

    @Override
    public void serveResource(ResourceRequest p_request,ResourceResponse p_response) throws PortletException,IOException {
                    //do your search here and put results in 'result'
        p_request.setAttribute("result","results for: " + p_request.getParameter("search"));

        getPortletContext().getRequestdispatcher("/WEB-INF/jsp/html.jsp").include(p_request,p_response);
    }
}

search.jsp的

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<%@ taglib uri="http://java.sun.com/portlet" prefix="portlet" %>

<portlet:defineObjects />

<script type="text/javascript">

    function doSearch() {
        Liferay.fire('searchKeywords',document.getElementById("<portlet:namespace/>search").value);    
    }

</script>

<form>
    <input type="text" name="search" id="<portlet:namespace/>search" />
    <button name="Search" value="Search" onclick="doSearch()" type="button">Search</button>
</form>

result.jsp中

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<%@ taglib uri="http://java.sun.com/portlet" prefix="portlet" %>
<%@ taglib uri="http://liferay.com/tld/aui" prefix="aui" %>

<portlet:defineObjects />
<portlet:resourceURL var="rurl" />

<script type="text/javascript">
    Liferay.on('searchKeywords',function(event,p_data){
        var A = AUI(); 
        A.use('aui-io-request',function(aui) {
            A.io.request("<%= rurl %>",{ 
                method : 'POST',data: {search: p_data},dataType : 'html',on : { 
                    success : function() { 
                        AUI().one("#<portlet:namespace/>placeholder").html(this.get('responseData'));
                    } 
                } 
            });
        });
    });
</script>

Search Results:<br />
<div id="<portlet:namespace/>placeholder">
</div>

html.jsp(这是为了渲染结果)

<%= request.getAttribute("result") %>

原文地址：https://www.jb51.cc/ajax/160120.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

相关推荐

ajax 上传文件项目下载
IE6是一个非常老旧的网页浏览器，虽然现在很少人再使用它，但是在某些特殊情况下，我们可能还需要使用IE6来访问网页。而在IE6中，我们通常会使用JavaScript来提交表单，来看一下具体操作。
ajax .post()
PHP中的count()函数是用来计算数组或容器中元素的个数。这个函数十分方便，在编写代码时使用频率也非常高。无论你是要统计数组的长度、统计字符串中字符出现的次数还是统计对象中属性的个数，count()都可以帮助你轻松
ajax 不返回值 写法
使用 AJAX（Asynchronous JavaScript and XML）技术可以在不刷新整个页面的情况下，向服务器发送请求并接收响应。通常来说，我们使用 AJAX 请求是为了获取后台数据，并将其展示在前端页面上。然而，有时候我们只需要
ajax 下载文件 blob
Ajax（Asynchronous JavaScript and XML）是一种用于改进网页用户体验的技术，通过与服务器进行异步通信，实现在网页上局部刷新数据而不必整个页面刷新的功能。在实际开发中，我们经常需要从服务器端下载文件，而传统
ajax 下载excel文件流
本文将介绍如何通过AJAX下载Excel文件流。通过AJAX，我们可以在不刷新整个页面的情况下，向服务器发送请求并获取响应数据。在某些场景下，我们需要通过AJAX下载Excel文件流，以便于在前端使用或保存到本地。本文将详
ajax .get .post
Ajax是一种用于客户端和服务器之间的异步通信技术。通过Ajax，我们可以在不刷新整个页面的情况下向服务器发送请求并获得响应数据。而在Ajax的基础上，.get和.post是两种常用的请求方法，它们分别用于发送GET和POST请
ajax 上传 excel
AJAX（Asynchronous JavaScript and XML）是一种在网页上实现异步数据传输的技术。通过AJAX，网页可以在不刷新整个页面的情况下与服务器进行数据交互，提升用户体验和页面性能。在实际应用中，AJAX广泛用于表单提交、
ajax 下拉 360取不到值
在使用Ajax下拉加载数据的过程中，有时候会出现无法取到360度的问题。这个问题可能是由于代码逻辑的问题导致的，也有可能是网络延迟引起的。为了解决这个问题，我们需要对代码进行仔细排查，并且在合适的地方添加适当
ajax 与 .post 区别
本文将介绍Ajax和.post之间的区别。Ajax是一种用于在网页上进行异步通信的技术，能够在不刷新整个页面的情况下更新部分页面内容。.post是jQuery中的一个方法，用于向服务器发送POST请求。虽然它们都可以用于发送异步
ajax 上传文件 目录权限
AJAX（Asynchronous JavaScript and XML）是一种在Web页面上进行异步数据请求和交互的技术。它的出现使得页面在后台与服务器进行数据交互的同时，不需要重新加载整个页面。在网页开发中，常常需要实现文件上传功能，
苹果市值2025年有望达4万亿美元
pythonJavaScriptjavaHTMLPHPreactjsC#AndroidCSSNode.jssqlrpython-3.xMysqLjQueryc++pandasFlutterangularIOSdjangolinuxswifttypescript路由器JSON路由器设置无线路由器h3c华三华三路由器设置华三路由器电脑软件教程arraysdocker软件图文教程Cvue.jslaravelspring-boot