ajax на aui: выберите liferay

Я знаю, что невозможно передать параметр из javascript в код скриптлета на странице jsp. Поэтому я хочу использовать ajax для отправки выбранного значения на сервер, а затем получить его в коде скриптлета с помощью объекта запроса, который я использую

<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 в этом теге, или любой тег можно использовать в моем сценарии.


ajax liferay jsp scriptlet liferay-aui
person user1487380    schedule 25.07.2012    source источник
comment
Я хочу установить некоторую переменную для запроса объекта и получить ее в скриптлете при вызове события onchange   -  person user1487380    schedule 25.07.2012
comment
Итак, вы хотите вернуть объект запроса из сообщения ajax и обновить тот же JSP, откуда был отправлен запрос ajax? Тогда, мой друг, вам не повезло, поскольку JSP оценивается на стороне сервера и преобразуется в html, поэтому в браузере вы видите HTML, а не JSP. Таким образом, даже когда вы отправляете запрос ajax на сервер, вы отправляете его из HTML, а не из JSP. Таким образом, ответ, который вы получаете от запроса ajax, возвращается обратно в HTML, а не в JSP.   -  person Prakash K    schedule 25.07.2012

Ответы (2)


arrow_upward
1
arrow_downward

Вы, кажется, вообще не понимаете, как работают HTTP и веб-приложения. Вы должны узнать о цикле запрос/ответ.

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>

Надеюсь это поможет.

person mvmn    schedule 09.08.2012
comment
Я изменил свою логику и создал 1 портлет, который поддерживает эти значения. однако, спасибо за ответ ^^ - person user1487380; 10.08.2012

arrow_upward
0
arrow_downward

Предположим, у нас есть два выбора, один для выбора темы, а другой автоматически заполняет тему в соответствии с выбором темы: этот пример я пробовал с 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. second select option for populating topics automatically according subject selection above.

  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! :)

Следующая часть — написание метода вашего класса портлета, как показано ниже:

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

Это все ваше кодирование .. :)

person Sebin Joseph    schedule 10.09.2014