Question

我知道在jsp页面中将参数从javascript传递给scriptlet代码是不可能的所以我想使用ajax将我选择的值发布到服务器，然后通过请求对象在scriptlet代码中获取它我用

<aui:select label="My Selection" name="ms" id="ms" onchange="<%= updateItem()%>" >
    <%
    for(String item : itemList){            
    %>
    <aui:option selected="<%= item.equals(selItem) %>" value="<%=item%>"><%=item%></aui:option>         
    <%}%>
</aui:select>

<%! 
private Object updateItem() throws Exception{
    //to do something with selected value
return null;
}%>

请告诉我如何在此标记中执行ajax帖子，或者可以在我的方案中使用任何标记

Answer 1

您似乎根本没有意识到HTTP和Web应用程序的工作原理。您必须了解请求/响应周期。

对于你想要做的事情，AJAX是正确的，但正如名称所说的AJAX是异步 JavaScript - 并且你试图将java方法调用放在你的onchange属性中。这不起作用。

要首先执行您要求的操作，您必须找到您的Portlet类，并实现serveResource(ResourceRequest req, ResourceResponse resp) 方法，您将接收所选值（String selectedVal = req.getParameter("selectedVal")）并根据该值返回一些内容。

String result = null; 
if ("blah".equals(selectedVal))
  { result = "Something"; } 
else 
  { result = "Something Else"; } 
resourceResponse.getPortletOutputStream().write(result.getBytes("UTF-8"));

然后你必须对该方法进行AJAX调用。大致应该是这样的：

<portlet:resourceUrl var="resourceUrl">
<portlet:param name="selectedVal" value="PARAM_PLACEHOLDER_SELECTED_VAL" />
</portlet:resourceUrl>
<aui:script use="io">
function ajax<portlet:namespace />MySelect(selectedVal) {
        A.io(
            '${resourceUrl}'.replace("PARAM_PLACEHOLDER_SELECTED_VAL", selectedVal),
            {
                on: {
                    success: <portlet:namespace />processResponse(select, response);
                }
            }
        );

function <portlet:namespace />processResponse(response) {
alert("Here's what java code returned:"+response+". Do whatever you want with it - with javascript");
}
</aui:script>

...

<aui:select label="My Selection" name="ms" id="ms" onchange="ajax<portlet:namespace>MySelect(this.values[this.selectedIndex])" >
    <%
    for(String item : itemList){            
    %>
    <aui:option selected="<%= item.equals(selItem) %>" value="<%=item%>"><%=item%></aui:option>         
    <%}%>
</aui:select>

希望这有帮助。

Answer 2

假设我们有两个选择，一个用于选择主题，另一个是根据主题选择自动填充主题：这个例子我尝试过使用Ajax并且成功了！

**在JSP中：**

1. declare this in your jsp

    <portlet:resourceURL var="fetchTopicsResourceURL" />
after 
        <portlet:defineObjects />

首选主题选择选项

 <aui:select id="subject" name="subject" label="Subject"
    inlineField="true" onChange='<%= renderResponse.getNamespace() + "fetchTopics();"%>'>
    <aui:option selected="true" value="">
        <liferay-ui:message key="Please select one.." />
    </aui:option>
    <%
        int totalsubject = SubjectLocalServiceUtil
                        .getSubjectsCount();
                List<Subject> subjectList = SubjectLocalServiceUtil
                        .getSubjects(0, totalsubject);
                for (Subject subject : subjectList) {
    %>
    <aui:option value="<%=subject.getSubjectId()%>"><%=subject.getSubjectName()%></aui:option>

    <%
        }
    %>

第二个选择选项，用于根据上面的主题选择自动填充主题。

编写一个javascript函数，将执行onThange of subject的值，如下所示：

Liferay.provide(
    window,
    '<portlet:namespace />fetchTopics',
    function() {

        var A = AUI();

        var fetchTopicsURL = '<%= fetchTopicsResourceURL.toString() %>';

        // selecting the sourceSelect drop-down to get the current value
        var sourceElement = A.one("#<portlet:namespace />subject");

        // selecting the targetSelect drop-down to populate values
        var targetElement = A.one("#<portlet:namespace />topic");

        A.io.request (
            // the resource URL to fetch words
            fetchTopicsURL, {
            data: {
                // request parameters to be sent to the Server
                <portlet:namespace />subject: sourceElement.val()
            },
            dataType: 'json',
            on: {
                    failure: function() {
                        // if there was some error at the server
                        alert("Ajax failed! There was some error at the server");
                    },
                    success: function(event, id, obj) {

                        // JSON Data recieved from Server

                        var topicsArray = this.get('responseData');

                        // crude javascript magic to populate the drop-down

                        //clear the content of select
                        targetElement.html("");

                        for (var j=0; j < topicsArray.length; j++) {

                            targetElement.append("<option value='" + topicsArray[j] + "'>" + topicsArray[j] + "</option>");
                        }
                    }
                }
            }
        ); 
    },
    ['aui-io']
);

这就是你所有的jsp编码！：）

下一部分是编写一个portlet类的方法，如下所示：

 @Override
    public void serveResource(ResourceRequest resourceRequest,
            ResourceResponse resourceResponse) throws IOException,
            PortletException {

        String subject = ParamUtil.getString(resourceRequest, "subject");

        // build the JsonArray to be sent back
        JSONArray jsonArray = JSONFactoryUtil.createJSONArray();

        //put some topics
        if(subject.equals("Maths")){
        jsonArray.put("Math1");
        jsonArray.put("Math2");
        jsonArray.put("Math3");
        }
        if(subject.equals("Science")){
        jsonArray.put("science1");
        jsonArray.put("science2");
        jsonArray.put("science3");
        }


        // set the content Type
        resourceResponse.setContentType("text/javascript");

        // using printWrite to write to the response
        PrintWriter writer = resourceResponse.getWriter();

        writer.write(jsonArray.toString());
    }

这就是你所有的编码.. :)

aui上的ajax：选择liferay

2 个答案: