AEM sightly: redirect to new page on button click | Community
Skip to main content
Siva_Sogalapalli
Siva_Sogalapalli
New Participant
September 1, 2016
Solved

AEM sightly: redirect to new page on button click

Hi All,

I'm trying to a contact us component. It will provide the button, when the user clicks on the button, he will be redirected to the contact us page. I've added input button and trying to redirect to contact us page when the user clicks on the button, but it's not redirecting to the new page.

Sample code:

<div data-sly-test.myPath="/content/geometrixx/en/contactus" data-sly-unwrap></div>

<input type="Submit" onclick="location.href='${myPath}'" value="Contact Us" />

Please correct me i'm wrong.

Thanks in Advance

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
antoniom5495929
antoniom5495929Accepted solution
Level 7
September 2, 2016

If you want to use an external url you have to put also the protocol.

This should be the trick:

<sly data-sly-test.myPath="https://www.google.com" />


<input type="Submit" onclick="location.href='${myPath @ context='scriptString'}'" value="Contact Us" />

View reply

8 replies

antoniom5495929
antoniom5495929Accepted solution
Level 7
September 2, 2016

If you want to use an external url you have to put also the protocol.

This should be the trick:

<sly data-sly-test.myPath="https://www.google.com" />


<input type="Submit" onclick="location.href='${myPath @ context='scriptString'}'" value="Contact Us" />

Translate
Siva_Sogalapalli
Siva_SogalapalliAuthor
New Participant
September 2, 2016

Hi Feike,

Thanks for your prompt response.

I see the correct url in the source code (onclick="location.href='www.google.com'" ), but when I click on the button it is redirecting to

http://localhost:4502/content/geometrixx/en/www.google.com

Note: I'm testing the component at http://localhost:4502/content/geometrixx/en/products.html

Please advise.

Translate
Feike_Visser1
Feike_Visser1
Employee
September 2, 2016

What do you see in the generated HTML-source? Should be the same.

Did you try with an http:// prefix?

Translate
Siva_Sogalapalli
Siva_SogalapalliAuthor
New Participant
September 2, 2016

Feike Visser wrote...

This should do the trick:

<sly data-sly-test.myPath="/content/geometrixx/en/contactus" />

<input type="Submit" onclick="location.href='${myPath @ context='scriptString'}'" value="Contact Us" />

 

Thanks Feike,

It works for Internal url. But the same thing is not working when I give external urls.

<sly data-sly-test.myPath="www.google.com" />

<input type="Submit" onclick="location.href='${myPath @ context='scriptString'}'" value="Contact Us" />

Please advise.

Translate
smacdonald2008
smacdonald2008
Level 10
September 1, 2016

Thxs Feike

Translate
Feike_Visser1
Feike_Visser1
Employee
September 1, 2016

This should do the trick:

<sly data-sly-test.myPath="/content/geometrixx/en/contactus" />

<input type="Submit" onclick="location.href='${myPath @ context='scriptString'}'" value="Contact Us" />

Translate
smacdonald2008
smacdonald2008
Level 10
September 1, 2016

You can also look into using Java part of the component. See http://stackoverflow.com/questions/33252410/how-to-redirect-a-page-in-sightly-without-html-tags-apart-from-meta-command. Hope this helps.

Translate
antoniom5495929
antoniom5495929
Level 7
September 1, 2016

You need to use the context:

${myPath @ context='uri'} or ${myPath @ context='scriptString'} just because it's in a javascript section.

Let me know. 

Translate
Terms & ConditionsAccessibility statement

Loading footer...