I have a widget in which my property name is "./title". i want to get this property value in javascript. for this i am getting its value in jsp.
JSP code
<div class="title">
<%=properties.get("./title","PageTitle")%>
</div>
jquery
$('.title').text();
By doing i'm able to get the value of title.But is there any other way through which i can get its value directly in javascript . thanks in advance.
You can initialize a JS variable with this value.
<script>
var title = "<%=properties.get("./title","PageTitle")%>"
</script>
Related
Am having a AEM6 html component, am getting the values from dialog and using it inside the component via the .js file and using the return properties.
I could able to get the authored values but it is getting null or empty when am using it inside the onclick method. Please find below the code snippet below.
<div data-sly-unwrap data-sly-use.test="test.js"></div>
<a href="#" class="${test.testId}" id="${test.testId}" onClick="toggleDraw('${test.testId}')" >
The content I authored is getting displayed in class and Id, but it is not displaying in the onClick method.
Below is the Output am getting after authoring.
<a href="#" class="get-a-quote" id="get-a-quote" onClick="toggleDraw('')" >
Output I needed is :
<a href="#" class="get-a-quote" id="get-a-quote" onClick="toggleDraw('get-a-quote')" >
This should do the trick:
<a data-sly-test.variable123="toggleDraw('${test.testId}')" href="#" class="${test.testId}" id="${test.testId}" onclick="${variable123 # context='attribute'}" >
You need to put the function call in a variable because of the nested single quotes. And you need to manually set the context in this case. If "attribute" does some escaping you do not like, you could use "unsafe" - this will end in all escaping mechanisms being disabled. That might or might not be a security issue for your application.
HTH
I have plain use class which contains one method that returns complex bean with a lot of setters/getters. Lets name it SomeUse. Given sightly file:
<sly data-sly-use.someUse="com.mycompany.SomeUse">
${someUse.data.firstProperty}
<div>
${someUse.data.secondProperty}
</div>
<!-- ...and so on -->
</sly>
So the point is I don't want to look at someUse.data getting. Instead of it I would do something like this:
<sly data-sly-use.someUse="com.mycompany.SomeUse" data-sly-use.data=${someUse.data}>
${data.firstProperty}
<div>
${data.secondProperty}
</div>
<!-- ...and so on -->
</sly>
I can't do this way though. Is there any alternative to achieve such result? Thanks a lot!
So the answer is to:
<sly data-sly-test.varName="${data.firstProperty}"></sly>
<div> ${varName.secondProperty} </div>
Creating a variable through empty data-sly-test attribute make it accessible after a tag.
You can set variables for use in a WCMUse class with the following syntax:
<sly data-sly-use.someUse="${ 'com.mycompany.SomeUse' # page=currentPage }">
and retrieve the page variable from your WCMUse class's activate() method like this:
Page page = get("page", Page.class);
For a working example, check out this Sightly script and this WCMUse class.
Instead of data-sly-use.data=${someUse.data}
use data-sly-test.data="${someUse.data}".
Then you will be able to get the property like
${data.firstProperty}
<div>
${data.secondProperty}
</div>
You can also set in DOM elements
<div id="elementId" data-sly-test.vehicle="${model.vehicle}">
<p>${vehicle.name}</p>
<p>${vehicle.type}</p>
</div>
Thanks for the help. I'm trying to use a jQuery selector to watch for a click on a group of elements, that start with particular characters. I have come up with the following code, but I must be missing something. If I hard code the ID (ie. $("#test_1")...), the code works:
<body>
<div id="content">
<div id="parentcontainer">
<div id="test_1"></div>
</div>
</div>
</body>
<script>
$(window).load(function(){
$("#statusbar").text("Ready");
$("#parentcontainer").click(function(){alert("parent clicked");});
$("#btnaddelement").click(function(){alert("Add Button Clicked");});
$("[name^='test_']").click(function(e){e.stopPropagation();
alert("Child Clicked");});
});
</script>
You are selecting on $("[name^='test_']") which will give you elements who have a name attribute that start with test_. You need to select on $("[id^='test_']") for elements with an id that start with test_. That is one example of what you are getting with your hard-coded success of $('#test_1') -- an element whose id attribute is test_1.
Also, be aware if you are not already that xpath is the language used for selectors, so you can do all kinds of incredible selection if you become familiar with it.
Yes, you missed something. Change the div's attribute id to name will work
<div name="test_1"></div>
Actually, class was used more frequently.
And there are an opinion I want to improve the code.
Try to use the jquery's $(document).ready instead of DOM's load. Because load will wait for all the sources to be loaded compeletely before the js code can be executed, for example, all the photos are downloading ok.
I hope this help!
I have a form and javascript function to open 2.jsp page but it keeps giving me
Message: Object doesn't support this property or method
Here is how I do it. I tried to put in only the important parts.
<form name = iForm action=1.jsp method=POST>
<input type="button" value="Button2" name=button2 onclick="OnButton1()"/>
</form>
<script language="JavaScript">
function OnButton1{
document.iFrom.action = "2.jsp";
document.iFrom.target = "_blank";
document.iFrom.submit();
return true;
}
< /script>
I know a way to open through 'window' but I was wondering if there is this way
You did not put parenthesis after your JavaScript function name and you misspelled the form name in your script.
Correct those mistakes and it should work as you might expect.
As well, the target attribute does work for forms.
im making some script with python PAMIE module.
inside my script im using internet explorer object and to handle this object
im using DOM path but it not easy to check Full dom element path .
for example , how can i search full dom path such like format?
divChild.nextSibling.nextSibling.nextSibling.nextSibling.childNodes[0].nextSibling.nextSibling.nextSibling.nextSibling.childNodes[0].childNodes[0].childNodes[0].childNodes[0]
it not easy to check manually
if anyone help me much apprecaite!
could you identify the node by object id ?
document.getElementById("elementId")
try to use this : https://github.com/asatour/jquery-domPath.
To get DOM Path of HTML jquery element
<body>
<div class="module" id="products-block">
<div class="description">
<h1 class="section-title">
product general description
</h1>
<ul class="products">
<li>Cameras</li>
<li>TV</li>
<li>Computers</li>
</ul>
</div>
</div>
</body>
JavaScript :
var products_domPath = $(".products").domPath();
Output:
["div#products-block.module > div.description > ul.products"]