I'm using AlloyUI in my liferay portlet.
I want to use my <input>
's id in javascript. The problem is that the id of the elements are changed in client side.
For example:
If I set an <input>
's Id to "username" it is changed to _hospital_WAR_hospitalportlet_userName
i.e. _hospital_WAR_hospitalportlet_
is appended to the Id, where Hospital
is my portlet name.
How can I get client-side Id so that I can use it in jquery?
The string _hospital_WAR_hospitalportlet_
prepended to the Id
of the <input>
is nothing but the portlet-namespace.
This is only prepended to your <input>
's name
& id
attribute if you use <aui:input>
tag and the name
& id
attributes are not changed if you just use plain-vanilla html <input>
tag.
But as it is a good practice to use <aui:input>
you can do the following to get the portlet-namespace in your javascript code:
If you are using javascripts inside a JSP i.e. using within <script> .. </script>
or <aui:script> .. </aui:script>
then you can use <portlet:namespace />
or <%= renderResponse.getNamespace() %>
to get the string _hospital_WAR_hospitalportlet_
inside your javascript, something like.
jQuery("#<portlet:namespace />username").val();
// Or
jQuery("#<%= renderResponse.getNamespace() %>username").val();
But if you are using a *.js
file then I suggest you pass the namespace as an argument to the javascript function in the js
file:
function changeValues(portletNamespace) { // this function is in a js file
jQuery("#" + portletNamespace + "username").val("Lets change");
}
calling this function from the JSP:
<input type="button" onClick="changeValues('<portlet:namespace />')" />
Hope this helps. I don't know if there is a way to get the namespace
or portletId
directly through some javascript function defined by Liferay. If you get something like that you can post it here and that would be very helpful.