Liferay 7 Maintain focus on portlet after action

[Massimo Bevilacqua, geändert vor 6 Jahren.]

Hi,

I have a contact us custom portlet in my footer. when I send an email a success message is displayed in portlet.
After the action the page is reloaded and the page stay on top, to see the success message I have to scroll down to the footer.

There is a way to maintain the focus on portlet after action?

(I saw there is a message similar to mine with no reply, I hope to be more lucky)

[Andrew Jardine, geändert vor 6 Jahren.]

Hi (again) Massimo,

I see two options for you here. The first, and probably the more common/sexy would be to use a resource call (ajax) instead of an ACTION call to do the work. This was the whole page doesn't have to reload (which has some possible performance gains) -- the user stays where they are and you can render a success message.

Alternatively, at the end of the action method, you could set a render parameter -- same the id of the dom element, let's call it "footerContainer". Then in the JSP you could detect the "footerContainer" value and then us JS to find the element in the page and scroll to it automatically.

Personally, I would go with the first option. I think it is a much cleaner solution and much more inline with modern web applications.

[Massimo Bevilacqua, geändert vor 6 Jahren.]

Thank you (again) for your reply,

if the first solution is the more sexy I can't resist

I never used ajax call, I will do some research on google and try this way.

[Andrew Jardine, geändert vor 6 Jahren.]

You can put it in the portlet class as --

public void serveResource(ResourceRequest resourceRequest, ResourceResponse resourceResponse)

.. but in Liferay 7 you really should use the command references so that you can set them as extension points to allow other to redefine portlet behaviour. Try following this guide -- it should be all you need.

https://dev.liferay.com/develop/tutorials/-/knowledge_base/7-0/mvc-resource-command

[Massimo Bevilacqua, geändert vor 6 Jahren.]

Sorry for the late answer,

I finally tried your solution but something doesn't work.
My test is:

in my view.jsp:

<portlet:resourceurl id="test" var="testResource" />

<div id="testForm">
<aui:form action="${testResource}" method="post">
<h1>Press the button</h1>
<aui:button type="submit" value="Submit" />
</aui:form>
</div>

I have created a test class in my portlet:

@Component(
	    property = {
	        "javax.portlet.name=com_test_liferay_TestResourceCommand",
	        "mvc.command.name=test"
	    },
	    service = MVCResourceCommand.class
	)
public class TestResourceCommand implements MVCResourceCommand{

	@Override
	public boolean serveResource(ResourceRequest resourceRequest, ResourceResponse resourceResponse)
			throws PortletException {
		System.out.println("I am in serveResource");
		return true;
	}

}

when i press the button the method is called, but my page become blank

[Andrew Jardine, geändert vor 6 Jahren.]

Hi Massimo,

I've never tried to use a resource url to submit a form to be honest -- I'm not sure that you can do that. Rather than using the action attribute on the form with your resourceURL, route the submit button action to a function in an <aui:script/> on the page. In the function you can retrieve your form values and then form the resourceURL use the JS library. Once that is done you can use the A.IO (AUI) plugin to make an ajax call. Something similar to this --

function submitForm()
{
	// set up variables with your form value
	var xxx = ....

	// create the resource url
	var resourceURL = Liferay.PortletURL.createResourceURL();

	resourceURL.setPortletId(portletId);
	resourceURL.setPlid(themeDisplay.getPlid());
	resourceURL.setResourceId('/view');
	resourceURL.setParameter('xxx', yyy);

	A.io.request(
				url,
				{
					on: {
						success: function () {
							var response = JSON.parse(this.get('responseData'));

							if (response) {
								// do soemthing here to updat the view
							}
							
						}
					}
				}
			);
}

.. There are tons of resources out there that will demonstrate how to do it. A lot of them are going to reference 6.2, but it's the same in 7. I have used this approach several times and it's working for me if you want to try that out.