Combination View Flat View Tree View
Threads [ Previous | Next ]
Muhammad Taha
Unable to understand how javascript document.getElementByd() working
January 23, 2013 7:26 AM
Answer

Muhammad Taha

Rank: Junior Member

Posts: 66

Join Date: May 1, 2012

Recent Posts

Hi all, when im trying to get <h:inputText id="field"> value in javascript using document.getElementById('field').value, im getting some "TypeError: a is null"
When i check with firebug id is converting to 'A3761:field', if I change in code accordingly, its working fine.

Im looking for any alternate method for this.....hardcoding A3461 every where is not looking good. below is my code

<h:body>
<form>
<h:inputText id="field" value="#{myMO.myfield}" />
<h:inputText id="field2" value="#{myMO.myfield}" />
<h:commandButton action="#{myControllerBean.myMethod()}" value="Submit" onclick="return myfunction();" />
</form>
<script type="text/javascript">
function myfunction(){
var myvar=document.getElementById('A3761:field');
var myvar2=document.getElementById('A3761:field2');
alert(myvar.value);
alert(myvar2.value);
return false;
}
</script>
</h:body>

Thanks,
Ram A
RE: Unable to understand how javascript document.getElementByd() working
January 23, 2013 8:03 AM
Answer

Ram A

Rank: Junior Member

Posts: 76

Join Date: January 16, 2013

Recent Posts

Hi Muhammad,

Can you try with JQuery to read the value from fields.
var result=$('#fieldid').val();

This may help you.
Neil Griffin
RE: Unable to understand how javascript document.getElementByd() working
January 23, 2013 8:19 AM
Answer

Neil Griffin

LIFERAY STAFF

Rank: Liferay Legend

Posts: 2097

Join Date: July 26, 2005

Recent Posts

The value 'A3761' is the namespace prefix. It is put there by Liferay Faces Bridge in order to make sure that multiple JSF portlets on the same portal page have unique IDs for HTML elements.

You should be able to get the value dynamically with an EL expression like:
1#{facesContext.externalContext.encodeNamespace('')}

Alternatively, you can set an EL variable like this:
1<portlet:namespace var="portletNamespace" />

And then use it in an EL expression like this:
1#{portletNamespace}


(Note: Don't include the "1" at the beginning of each line. That's just a feature of the forums here adding line numbers to code fragments)
Muhammad Taha
RE: Unable to understand how javascript document.getElementByd() working
January 23, 2013 12:09 PM
Answer

Muhammad Taha

Rank: Junior Member

Posts: 66

Join Date: May 1, 2012

Recent Posts

Thanks Ram, and Niel,

I can able to get value by using #{facesContext.externalContext.encodeNamespace('')}

var myvar=document.getElementById("#{facesContext.externalContext.encodeNamespace('')}:field");

Thanks
Muhammad Taha
RE: Unable to understand how javascript document.getElementByd() working
January 24, 2013 5:39 AM
Answer

Muhammad Taha

Rank: Junior Member

Posts: 66

Join Date: May 1, 2012

Recent Posts

Hi Niel.. This time similar issue with css...Im unable to apply styles based on Ids
I've my issue with relevant code posted in thread. below I mentioned URL.
How to print only portlet content

Thanks
Neil Griffin
RE: Unable to understand how javascript document.getElementByd() working
January 24, 2013 11:02 AM
Answer

Neil Griffin

LIFERAY STAFF

Rank: Liferay Legend

Posts: 2097

Join Date: July 26, 2005

Recent Posts

You can use EL expressions like #{facesContext.externalContext.encodeNamespace('')} in CSS files if they are served up as JSF2 resources.

For example, in the jsf2-portlet demo, there is a file named styling.xhtml that has some markup like this:

1<h:outputStylesheet library="example" name="example.css" />


And the actual files live inside the src/main/webapp/resources/example folder of the portlet source code.
Muhammad Taha
RE: Unable to understand how javascript document.getElementByd() working
January 25, 2013 5:37 AM
Answer

Muhammad Taha

Rank: Junior Member

Posts: 66

Join Date: May 1, 2012

Recent Posts

Im following the same approach to add external css,

I tried using #{facesContext.externalContext.encodeNamespace('')} for adding css to an Id.I don't know if would have put it wrongly. I tried in different ways..

1. ##{facesContext.externalContext.encodeNamespace('')}:section_to_print{
background-color: red;
}
Not working
2. #"#{facesContext.externalContext.encodeNamespace('')}":section_to_print{
background-color: red;
}
Not working
3. #A7687:section_to_print{
background-color: yellow;
}
Here I directly hardcoded namespace prefix But Not worked
4. After changing Id to class in .xhtml
.section_to_print{
background-color: yellow;
}
Its working
Neil Griffin
RE: Unable to understand how javascript document.getElementByd() working
January 25, 2013 6:57 AM
Answer

Neil Griffin

LIFERAY STAFF

Rank: Liferay Legend

Posts: 2097

Join Date: July 26, 2005

Recent Posts

It has been my experience that accessing via class (rather than id) is always a nice way to do CSS.

If you need to try to get id working in the future, then please let me know -- the EL expression should have worked.