Form Element ID changed

[griffitm]

Hello All,

Using Seam 2.0.0CR1, I have a form where I want to change the value of a <rich:calendar/> element based on the selection of a DDLB. It seems overkill to use Ajax, and to make a round trip to the server in order to change the value of an HTML input -- so I wrote a simple JS function to change the value:

First the JSF Source:

 <rich:simpleTogglePanel label="Deliverable Date Search" switchType="ajax">
 <s:decorate template="layout/display.xhtml">
 <ui:define name="label">Select Period:</ui:define>
 <h:selectOneMenu id="period" onchange="setPeriod(this.value);">
 <f:selectItem itemLabel="Next 30 Days" itemValue="30"/>
 <f:selectItem itemLabel="Next 60 Days" itemValue="60"/>
 <f:selectItem itemLabel="Next 90 Days" itemValue="90"/>
 <f:selectItem itemLabel="Next 120 Days" itemValue="120"/>
 <f:selectItem itemLabel="Next 365 Days" itemValue="365"/>
 </h:selectOneMenu>
 </s:decorate>
 <s:decorate template="layout/display.xhtml">
 <ui:define name="label">From Due Date:</ui:define>
 <rich:calendar id="fromDueDate" popup="true" enableManualInput="true"
 value="#{deliverableSearch.fromDate}" pattern="MM/dd/yyyy"
 event="onclick" reRender="completionDateDecoration" bypassUpdates="true"/>

 </s:decorate>
 <s:decorate template="layout/display.xhtml">
 <ui:define name="label">To Due Date:</ui:define>
 <rich:calendar id="toDueDate" popup="true" enableManualInput="true"
 value="#{deliverableSearch.toDate}" pattern="MM/dd/yyyy"
 event="onclick" reRender="completionDateDecoration" bypassUpdates="true"/>
 </s:decorate>
 </rich:simpleTogglePanel>

The JS Source:

 <script type="text/javascript">
 //<![CDATA[
 function setPeriod(days){
 var today= new Date();
 var newDate= new Date(today.getTime() + days*24*60*60*1000);
 var form= document.forms[0];
 form.fromDueDate.value= today;
 form.toDueDate.value= newDate;
 form.submit();
 return;
 }
 // ]]>
 </script>

The problem is that the JS code errors because the id's of the HTML form elements are mangled by RichFaces. How can I get the ID's of the elements as they appear in the cooked page in order to make this JS function work?

Thanks in advance,
MG

[swd847]

JSF pretty much generates id's of the form : container1ID:container2ID:elementID
but it depends on the container.

If you are still stuck there are other ways to approch this.

[griffitm]

Thanks for the reply. I was able to use the prototype form.getInputs('text') to get an array of my form elements and replace the values that way. However, this doesn't work like I expected. Even though the HTML form contains the correct values, the bean that the search is bound to has the old values. I'm not sure if I can get around that, or if Ajax would be a better way to approach this after all.

MG