2

我知道这是不可能将参数从 javascript 传递到 jsp 页面中的 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 帖子，或者任何标签都可以在我的场景中使用

4

2 回答 2

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>

希望这可以帮助。

于 2012-08-09T13:02:44.277 回答
0

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

**在 JSP 中：**

1. declare this in your jsp

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

  1. 首先选择主题选择选项

     <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>

    <%
        }
    %>

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

  3. 编写一个javascript函数，该函数将在主题值的更改上执行，如下所示：

    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());
    }

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

于 2014-09-10T12:26:02.593 回答