Control JSF Component navigation thru Javascript

<a4j:region>
                                             <h:inputText id="bc1"                     value="#{addHardware.barCode1}"           valueChangeListener="#{addHardware.processValueChange}"          style="border-right-color: BLUE; border-bottom-color: BLUE; border-top-width: medium; border-top-color: BLUE; border-right-width: medium; border-left-width: medium; border-left-color: BLUE; border-bottom-width: medium">
                                             <a4j:support event="onfocus"           reRender="form1"/>
                                             <a4j:support event="onblur"               reRender="bc1, displayMessageLabel, errmsgheader, addnotesbtn, submit"/>
                                             </h:inputText>
                                             </a4j:region>
Question: How can I pass the values to the Javascript function if my backing bean returns two values such as component id (in the above example "bc1") and validational error msg so that I can keep the focus on the same component (thru Javascript) when validational error message exists.
If my question is not clear,....please let me know ...Thx for your help

Maybe I just haven't looked far enough but it seems
that using client-side Javascript is not intended to
be used/asociated with JSF.I'm not sure how much is mentioned about this in the current draft (if at all), but the intention is that client-side code can be generated (by the component or by a renderer) to perform things like validation of the client when possible (in addition to the server validation, just to speed things up). This is an area that 's even more "work in progress" than other parts.

Similar Messages

Triggering a reRender of a JSF component from a Javascript function

Hi
I am using a javascript calendar component(JQuery +JCal) to allow the user to select a date for which they want to see events displayed for. When the user selects the date I was planning on outputting the events in a rich:dataTable or something similar.
Is there anyway that I can trigger a reRender of the dataTable from the javascript, i.e. when someone selects a particular date I would like to trigger a reRender of the rich:dataTable.
I know I can do it easily from another JSF component, e.g. if I had a commandLink I could set the reRender property to be the id of the dataTable. But I am wondering can I trigger the reRender of the dataTable from a Javascript function, i.e. can I submit an AJAX request
Thanks

If you are using the the Richfaces components then you should look at the a4j:jsFunction component, which is provided by Richfaces.
Follow the following format using the a4j:jsFunction:
<a4j:jsFunction name="functionName" reRender="targetCompoentId"/>So in the component that the event should be triggered...like the 'onclick' or 'onmouseover' or whatever the legal event is use the following format:
onclick="functionName();"Richfaces renders the a4j:jsFunction as a javascript function. The a4j:jsFunction name attibute becomes the name of the javascript function; You just have to remember to add the "()" parenthesis to the end of the function name.
You could technically call the function also inside a javascript that has page access to the javascript generated from the a4j:jsFunction component.
Hope this helps!

How can I include a javaScript files from within jsf component

Is there any way using which I can include javascript files from my jsf component. Because otherwise I have to write all the javascript commands using writer.write which is very tedious rather than this I just want to include the javascript file which contains all the functions required. Also I want that this file should be included only once irrespective of the number of components included.
Thanx in advance

This doesn't depend on JSF. You need to include a script tag, like:
<script src="/path/script.js"
language="JavaScript" type="text/javascript"></script>
If you want to include this only once, make a file included into every page, into which you can put other resources to be included along with this script.
HTH,
rs.

How to make Javascript access standard JSF component

Hello all,
I'm in need of a proper javascript code that access standard jsf component.
Like we do for html tags;
if( el.tagName.toLowerCase() != 'select')
I need to do the same thing for a jsf tag i.e; <h:selectOneMenu>. How to make javascript access <h:selectOneMenu> like it does with <select> tag ? Please let me know asap. Extremely sorry if the question is kind of stupid....cause I'm a beginner for JSF environment.
Any sort of help, suggestion or advice would highly be appreciated.
Thanks in advance.

Ummmm, I may be off the beaten path, but by the time your javascript is called the h:selectOneMenu would be a select tag within the dom. You should be able to reference that tag as you normally would.

Relative positioning of JSF component

Hi,
How can I place a JSF component relative to another component, say I want to place a table below another table whose number of rows may vary.
Thanks,
Bob

Have two differnt tables or use frames and place the controls(tableand button in this case) in different frames.
<table width="100%" height="350"> -outertable
<table .................................................><tr> any number of rows. </tr>-inner table
</table>- - close outer
</tr </table> - close inner
<table> -new table
command button
</table> - close new table

Setting focus to a jsf component inside a tab.

Hi,
How can I set focus to a jsf component that is placed on some tab other then the first. Suppose that on the 2nd tabitem of the tab. there are some components on this tab . How can I set the focus to any one of these components on tabitem2 when the jsf page is opened.
Any ideas..
Thanks in advance..

Use Javascript.var el = document.getElementById('elementId');
if (el && el.focus) {
el.focus();
}

Access client DOM id of current JSF component via an EL statement

Is it possible to access the client-side DOM id of a JSF component from within an EL statement?
For example:
<a4j:commandLink id="marketNameLink" action="#{testAction.myFunction( 'some how get client DOM id' )} />
I could use rich:clientId('marketNameLink'), except I think that this is a bit wasteful in processing time to search the complete DOM tree to access the id of the current component.
Any ideas?
Philip

EL are evaluted at server side and DOM id are generated for the client side
I advice you to read this article :
[http://balusc.blogspot.com/2009/05/javajspjsf-and-javascript.html|http://balusc.blogspot.com/2009/05/javajspjsf-and-javascript.html]
and also this on :
[http://weblogs.java.net/blog/2009/07/22/say-sayonara-spal|http://weblogs.java.net/blog/2009/07/22/say-sayonara-spal]

How to load a class dynamically (via reflection) in a jsf-component

Hi all,
I am writing my own jsf component and I would like to do it generically. Therefore I have an attribute, where the developer can pass a fully qualified classname, which I want to use to instantiate. But I have a Problem with the classloaders, everytime I get a ClassNotFound-Exception during debugging.
Does anybody know how it is possible, to to get the most parent classloader?
Currently I am even not able to load a class, which is in the same package like all other compontent-classes.
Thank you very much in advance
Thomas

Within web applications, I believe it is recommended to use Thread.getContextClassLoader(). Keep in mind that web applications require different classloader semantics than regular Java applications. The class loader which gets resources from the WAR is favored over others, even when this violates the normal class loading conventions.

How to add properties to a custom JSF component?

Hello, everybody!
I've just developed my first custom JSF component. It's a data pager and it is working pretty well. But now I want to be able to use some of it attributes in my backing beans at runtime. I mean, I want to bind it to component in the JSF page. It already has a binding attribute in the tld file, but I want to be able to accesss two values that the renderer of my custom component calculate inside it, which would relieve me from calculating these values manually in the backing beans. So, I would like to know how to make these values external to the component.
By now this is my custom pager class:
import javax.faces.component.UICommand;
public class UIPaginadorDados extends UICommand
}You can see that it has no logic because all the logic is in the renderer class:
import javax.faces.render.Renderer;
public class PaginadorDadosRenderer extends Renderer
// logic here
}As I said I want to be able to do the following in my backing beans:
private UIPaginadorDados pager = new UIPaginadorDados();
// and later...
pager.getCurrentPage();
pager.getPageCount();In the JSF page:
// I already can do this, because I have a binding attribute
<urca:paginadorDados binding="#{backingBean.pager}" />I suppose that I'll have to create the properties getCurrentPage() and getPageCount() in the component class, UIPaginadorDados, but I don't know how to get the values to the properties from the renderer class. I don't even know if this is how I should do it.
So I would appreciate a lot your help about this subject.
Thank you.
Marcos

Marcos_AntonioPS wrote:
RaymondDeCampo wrote:
I neglected to mention: do not forget to implement the methods in StateHolder to preserve the properties you added to your component.Hello, Raymond. Could you elaborate a little more on that? If you could give a short example, it would be helpful.
MarcosNo problem. I have already found out how.
Thank you very much, Raymond.
Marcos

JSF component inside HTML table -- not rendering properly

I have a HTML table like the one below. In one of those columns (td) I have a JSF component. When I run the app, the JSF component (even if its a simple inputText or panelGrid or panelGroup) is not getting inside the td. Instead, it forms a seperate table after this td.
Code I have:
<table border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>... ..MULTIPLE Td's here - Deleted for simplicity </td>
<td class="topNav">
Blog Directory
</td>
<td>
<img src="./images/top_button_right.gif"/>
</td>
<td class="topNav">
<f:panelGroup>
<h:inputText value="Username"/>
<h:inputSecret value="Password"/>
</f:panelGroup>
</td>
</tr>
</tbody>
</table>
What I expected:
username, passwd field inside the top level HTML table.
What comes: (as a result of running thsi JSF page )
<table> -- Original table
<td> </td> -- -TD that had the inputText - comes empty here
</table>
<table>
<tbody>
<tr>
<td><input type="text" name="_id1:header:EasyHeader:_id4" value="Username" /><input type="password" name="_id1:header:EasyHeader:_id5" value="" /></td>
</tr>
<tr>
<td><table>
I am a newbie to JSF & due to the complexity of the layout & page, I m unable to get rid of the HTML tags totally.
Thanks in advance.
Ganesh

Found the solution to the problem.
wrapped the entire HTML page till the JSF component ( panelGrid) under <f:verbatim>.
something like this
<f:verbatim>
<table>
<tr> <td>...</td>
<td>
</f:verbatim>
<h:panelGrid> ... </h:panelGrid>
<f:verbatim>
</td>
</table>
</f:verbatim>

Can i use one JSF component's value for other component in the same page.

Can i use one JSF component's value for other component in the same page.
For example
I have a <h:selectBooleanCheckbox id="myChk"> in my jsf page, i want to access its value for another component like:
<h:commandButton disabled="#{myChk.checked}" action="myAction" value="myValue" />
** "myChk.checked" >> I am just asuming "checked" property is available...

Bind the checkbox to a UIInput myChk property. Then you can reference this property from the page, e.g.
<h:selectBooleanCheckbox binding="#{myBean.myChk}" onchange="submit();" />
<h:commandButton disabled="#{myBean.myChk.value}" action="myAction" value="myValue" />

How to call sharepoint datetime control on date changed in javascript?

Hi,
Can any body help me to call sharepoint datetime control date changed event in javascript.? Im trying to show the date on dateTimeControl2 based on dateTimeControl1 on dateChanged event (not submit ) ie, when mouse leaves from the first date control
, next date control will update 1 year from first date control.
<SharePoint:DateTimeControl ID="effectiveDate"
CssClassTextBox="form-control"
runat="server" DateOnly="true"
OnValueChangeClientScript="val_create_cca_onchange()"
DatePickerFrameUrl="<%$SPUrl:~sitecollection/_layouts/15/iframe.aspx %>" />
and my js function is..
function val_create_cca_onchange( ) {
var dt = new Date();
var val_effective_date = document.getElementById("<%= effectiveDate.ClientID %>");
var dt2 = dt.getDate(val_effective_date);
var month2 = dt.getMonth(val_effective_date) + 1;
var year2 = dt.getFullYear(val_effective_date) + 1;
var dateUpdate = dt2 + '/' + month2 + '/' + year2;
document.getElementById("<%= endDate.ClientID %>").innerText = dateUpdate;
Thanks in advance.

Your script is correct except id in the url. You need to pass the url like
<a href="javascript:OpenPopUpPage(‘/sites/wm/Lists/WorkItems/EditForm.aspx?ID={@ID}’)">
Edit Item</a>
http://jimecox.wordpress.com/2011/08/02/url-stings-in-sharepoint-2010-to-launch-edit-forms/

Tutorial on how to create an Ajax-enabled JSF component in Creator?

Is there a tutorial on how to create (not use/import existing) an Ajax-enabled JSF component using Creator 2? I read somewhere that it was done during a presentation in 3 minutes! Now that I really want to see ;-
thanks,
-nikita

As far as I remeber, Edwin Goei's examples are the
closest thing to the info you are looking. He has an
example component, but don't remember if they're
AJAX enabled. Check it on
http://wiki.java.net/bin/view/Javatools/CustomCompone
tLibraries.
Best regards
Antonio.Thanks for the plug. I've been meaning to update that article. Writing an AJAX component is similar to writing other kinds of components but the developer uses AJAX techniques. The latest version of the popup calendar which is checked into the bpcatalog project of java.net uses Dojo which also has some support for AJAX. I haven't yet had time to update the article yet, unfortunately.
-Edwin
http://blogs.sun.com/edwingo/

Unable to add Dimension thru Javascript

I am connected to an Essbase cube thru IR. I am trying to change the selected Toplabels and Sidelabels thru Javascript. I have a dimension called FY_Period. The structure of FY_period is
FY_Period
-----Q1
---------Jan
---------Feb
---------Mar
-----Q2
---------Apr
---------May
-So on ....
I am writing the following script in Dashboard
Documents["*****.bqy"].Sections["Query"].TopLabels.Add("Gen3,FY_Period"); This DID NOT WORK
Then I wrote
Documents["*****.bqy"].Sections["Query"].TopLabels.Add("Jan"); This DID NOT WORK either.
How do I specify the member name dynamically ?
Any help will be appreciated.
Thanks
Debasish

First Thanks Wayne for your sugegstions and help.
I found part of the solution. I was using the Add methos only. I found I need to add the Dimension name first then I could use the Add for the dimension to add members. I had different impression reading the help file.
Documents["***********.bqy"].Sections["Query2"].Columns.Add("FY_Period");
Documents["***********.bqy"].Sections["Query2"].Columns["FY_Period"].Add("Q2.Apr",bqOLAPSelectorMember,false);
But now the issue is I have both Dimension FY_Period and member Apr is selected in the query statement. I do not need the FY_Period. All I need is the "Apr" member. I am not able to delect the FY_Period programmatically.

Unexpected error decoding JSF component: {0} in SAP BO 4.0 sp2

Hi,
Am getting the above mentioned error repeatidly. I tried clearing the tomcat cache folder and restarted the tomcat but that couldnt help me to resolve the issue, Help me to resolve the issue.

Hi Abhi,
Please refer the below KBA regarding your issue
1710454 - Unexpected error decoding JSF component BI 4.0
https://service.sap.com/sap/support/notes/1710454
Thanks,
Daya

Control JSF Component navigation thru Javascript

Similar Messages

Maybe you are looking for