ICEsoft.org Forums: ICEfaces, ICEmobile, ICEpdf

Hi,

I could get the Calendar component of ICEFaces. Its working well, am able to move it anywhere on the screen. Ok. But I tried to select any date, then it is not getting selected to the Text Field, from where I want to store it into the database.

Is there any possibility to make it so?

Can any one please help me out?

Thanks in advance.

Rgds,
Mercury.

Assume that you are using Netbeans VWP, at designer page,

You need to set value binding of outputLabel to the selectInputDateBean for SelectInputDate,

or you could create your own property bean.

I am using MyEclipse5.5. Does the same thing here works out?

Yes, same structure.

A quick way for you to getting started is to import one of sample war files and run the web application inside IDE.

enjoy

Frank,

Yet am unable to get the selected date into the text box. Gone thru the ICEFaces tutorials also. I wanna the Calendar to be popped up and draggable. Am getting the calendar component, but couldnt get the selected date into the textbox.

Can you please help me out?

Thanks,
Mercury.

You could make a simple back bean bind to the value of ice:selectInputDate

<ice:selectInputDate style="height: 118px; width: 238px" value="#{selectInputDate1Bean.date1}"/>

also, bind the same back bean to the outputText value.

Then, you should be able to select the value in the calendar and it shows up in the outputText.

Next step using
ice:panelPopup with selectInputDate inside body facet.

<f:facet name="body">
<ice:panelGrid >
<ice:selectInputDate/>
</ice:panelGrid>
</f:facet>

enjoy

Yes. I tried out in similar fashion. I could get the selected date into text box. But when I tried to use calendar component as a popup, then it is not working. Here is the code ...

Code:

 <ice:form style="width: 45%;" id="cale">
 				<ice:inputText size="15" value="#{popup.nav_date}">
 				</ice:inputText>
 				<ice:commandButton image="calendar_icon.png"
 					action="#{popup.openPopup}" />
 				<ice:panelPopup draggable="true"  binding="#{popup.panel_popup}"  visible="#{popup.visible}"  
 					style="z-index: 1000; top: 30%; left: 10%; position: absolute; width: 150px;">
 					<f:facet name="header">
 						<ice:panelGrid width="100%" cellpadding="0" cellspacing="0"
 							columns="2" style="text-align: center;	color:red;"
 							bgcolor="lightblue">
 							<ice:outputText style="color: #FFFFFF;" value="Calendar" />
 							<ice:commandButton image="close.gif" action="#{popup.closePopup}"
 								 />
 						</ice:panelGrid>
 					</f:facet>
 
 					<f:facet name="body">
 						<ice:panelGrid width="100%" bgcolor="lightblue" onclick="">
 						
 							
 							<ice:selectInputDate  rendered="true" binding="#{popup.siDate}" valueChangeListener="#{popup.showDate}">
 								
 							</ice:selectInputDate>
 							
 						</ice:panelGrid>
 					</f:facet>
 
 				</ice:panelPopup>
 			</ice:form>

Please advise me to go further.

Thanks,
Mercury.

Yes. I tried out in similar fashion. I could get the selected date into text box. But when I tried to use calendar component as a popup, then it is not working. Here is the code ...

Code:

 <ice:form style="width: 45%;" id="cale">
 				<ice:inputText size="15" value="#{popup.nav_date}">
 				</ice:inputText>
 				<ice:commandButton image="calendar_icon.png"
 					action="#{popup.openPopup}" />
 				<ice:panelPopup draggable="true"  binding="#{popup.panel_popup}"  visible="#{popup.visible}"  
 					style="z-index: 1000; top: 30%; left: 10%; position: absolute; width: 150px;">
 					<f:facet name="header">
 						<ice:panelGrid width="100%" cellpadding="0" cellspacing="0"
 							columns="2" style="text-align: center;	color:red;"
 							bgcolor="lightblue">
 							<ice:outputText style="color: #FFFFFF;" value="Calendar" />
 							<ice:commandButton image="close.gif" action="#{popup.closePopup}"
 								 />
 						</ice:panelGrid>
 					</f:facet>
 
 					<f:facet name="body">
 						<ice:panelGrid width="100%" bgcolor="lightblue" onclick="">
 						
 							
 							<ice:selectInputDate  rendered="true" binding="#{popup.siDate}" valueChangeListener="#{popup.showDate}">
 								
 							</ice:selectInputDate>
 							
 						</ice:panelGrid>
 					</f:facet>
 
 				</ice:panelPopup>
 			</ice:form>

Please advise me to go further.

Thanks,
Mercury.

Could you make sure you use value to bind to your back bean date...

<ice:selectInputDate value="binding date value to this attribute"
renderAsPopup="true">

If you still have problem, please post your back bean class.

enjoy

Frank,

Thanks. Now am able to get the selected date into Text box.

Yet I have a doubt. On using SelectInputDate, I am getting a Textbox, where selected date is being caught. How to get the selected date into a text box thru InputText. Is it possible? If so, can you please advise me?

Thanks,
Mercury.

Try this structure

<ice:selectInputDate value="#{admin$Date}" styleClass="cal" renderAsPopup="true" renderMonthAsDropdown="true" renderYearAsDropdown="true" />

-bond

Hi, I'm facing the similar issue. I used the ice:selectInputDate> inside the ice:panelPopup
the problem is, when I click on the date picker, it is not triggering the calendar.

I used a reusable popup called commonPopup which has the title, close button and place holder for the content.

When I need a popup, I call the commonPopup by passing the content as url.
here is how I call the popup
<aci:commonPopup backer="#{historyBacker}" url="../profile/historyPopup.jspx" popupTitle="More History"/>

and here is my commonPopup.jspx

<div xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:c="http://java.sun.com/jstl/core"
xmlns:aci="http://www.americancentury.com/coe/jsf"
xmlns:ice="http://www.icesoft.com/icefaces/component">

<ice:panelPopup draggable="true" modal="false" rendered="#{popup.rendered}" autoCentre="true" styleClass="icePnlPop">
<f:facet name="header">
<ice:panelGroup>
<ice:outputText value="Common Header"/>
<ice:commandButton type="button"
image="/resources/css/css-images/cal_off.gif"
action="#{popup.closePopup}"
styleClass="popupHeaderImage"
title="#{popupTitle}" alt="Close"/>
</ice:panelGroup>
</f:facet>

<f:facet name="body">

<ice:commandButton type="button"
image="/resources/css/css-images/cal_off.gif"
action="#{popup.closePopup}"
styleClass="popupHeaderImage"
title="Close Popup" alt="Close"/>

<ice:panelGroup styleClass="exampleBox">


<ui:include src="#{url}"/>

<ice:commandButton value="Close"
action="#{popup.closePopup}" title="Close Popup"
alt="Close" />
</ice:panelGroup>

</f:facet>

</ice:panelPopup>
</div>

Problem is when i click on the date it is not triggering the calender.
It was working fine in a simple screen, but when i use it in ice:panelPopup it is not working.

Here is by backing bean
import java.util.Date;
public class PreclearanceHistoryBacker extends BackingBean{

....
private Date fromRange;
private Date toRange;

//getters and setter.

please help me..

and the content I pass is like this

<ice:panelGroup styleClass="exampleBox"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:c="http://java.sun.com/jstl/core"
xmlns:aci="http://www.americancentury.com/coe/jsf"
xmlns:ice="http://www.icesoft.com/icefaces/component">

<c:set var="historyBacker" value="#{preclearanceHistoryBacker}" />
<ice:panelGrid columns="7" width="100%">
<ice:outputLabel for="fromRange"
value="#{labels['preclearanceRequestHistory.search.enterRange']}" />
<ice:panelGroup>
<ice:selectInputDate id="fromDate" value="#{backer.fromRange}"
highlightClass="weekend: august:" highlightUnit="DAY_OF_WEEK: MONTH"
renderAsPopup="true" highlightValue="1,7: 8">

</ice:selectInputDate>
</ice:panelGroup>
<ice:outputLabel for="toRange"
value="#{labels['preclearanceRequestHistory.search.to']}" />
<ice:selectInputDate id="toDate" value="#{backer.toRange}"
highlightClass="weekend: august:" highlightUnit="DAY_OF_WEEK: MONTH"
renderAsPopup="true" highlightValue="1,7: 8">

</ice:selectInputDate>
<ice:outputLabel
value="#{labels['preclearanceRequestHistory.search.ticker']}" />
<ice:inputText value="#{historyBacker.ticker}" />

<ice:graphicImage url="/resources/css/images/search.gif"
styleClass="imageLink" alt="Search" />

<ice:outputLabel
value="#{labels['preclearanceRequestHistory.search.accountNumber']}" />
<ice:inputText value="#{historyBacker.accountNumber}" />
<ice:commandButton value="Submit" action="#{historyBacker.search}" />

</ice:panelGrid>

<ice:panelGroup>
<ui:debug />
<ice:dataTable var="pcr" value="#{historyBacker.historyWrappers}"
columnClasses="tableCol">

<ice:column>
<f:facet name="header">
<ice:outputText value="#{labels['preclearance.label.requestDate']}" />
</f:facet>
<ice:outputText id="requestDate"
value="#{pcr.tradeRequest.requestTimestamp}">
<f:convertDateTime type="date" pattern="MM/dd/yyyy" />
</ice:outputText>
</ice:column>

<ice:column>
<f:facet name="header">
<ice:outputText
value="#{labels['preclearance.label.accountNumber']}" />
</f:facet>
<ice:outputText id="accNumber"
value="#{pcr.tradeRequest.accountNumber}">
</ice:outputText>
</ice:column>

<ice:column>
<f:facet name="header">
<ice:outputText value="#{labels['preclearance.label.broker']}" />
</f:facet>
<ice:outputText id="broker"
value="#{pcr.tradeRequest.account.broker.name}">
</ice:outputText>
</ice:column>

<ice:column>
<f:facet name="header">
<ice:outputText value="#{labels['preclearance.label.ticker']}" />
</f:facet>
<ice:outputText id="ticket"
value="#{pcr.tradeRequest.instrument.ticker}">
</ice:outputText>
</ice:column>

<ice:column>
<f:facet name="header">
<ice:outputText value="#{labels['preclearance.label.description']}" />
</f:facet>
<ice:outputText id="description"
value="#{pcr.tradeRequest.instrument.issuerName}">
</ice:outputText>
</ice:column>

<ice:column>
<f:facet name="header">
<ice:outputText value="#{labels['preclearance.label.noOfShares']}" />
</f:facet>
<ice:outputText id="numOfShares"
value="#{pcr.tradeRequest.tradeQuantity}">
</ice:outputText>
</ice:column>

<ice:column>
<f:facet name="header">
<ice:outputText value="#{labels['preclearance.label.status']}" />
</f:facet>
<ice:outputText id="status"
value="#{pcr.tradeRequest.requestStatusCode}">
</ice:outputText>
</ice:column>
<ice:column>
<f:facet name="header">
<ice:outputText
value="#{labels['preclearance.label.lastTradingDate']}">
<f:convertDateTime type="date" pattern="MM/dd/yyyy" />
</ice:outputText>
</f:facet>
<ice:outputText id="status" value="#{pcr.lastTradingDate}">
</ice:outputText>
</ice:column>

</ice:dataTable>

</ice:panelGroup>
</ice:panelGroup>

Hello,

I am trying to start a page with a Calendar on it. I am using ICEFaces 1.8.1 under NetBeans 6.7. After all a text field instead of selectInputDate appears (no elements to choose date appear).

Could you help me?

Code:

 <jsp:root version="2.1"
           xmlns:jsp="http://java.sun.com/JSP/Page"
           xmlns:f="http://java.sun.com/jsf/core"
           xmlns:h="http://java.sun.com/jsf/html"
           xmlns:ice="http://www.icesoft.com/icefaces/component">
     <jsp:directive.page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"/>
     <f:view>
         <html>
             <head>
                 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
                 <title>JSP Page</title>
             </head>
             <body>
                 <ice:form>
                     <ice:selectInputDate id="cal"
                                          renderAsPopup="true"
                                          value="#{Intro.cal}"/>
                     <ice:commandButton value="#{null}"/>
                 </ice:form>
             </body>
         </html>
     </f:view>
 </jsp:root>

Thanks in advance

Add <link href="./xmlhttp/css/rime/rime.css" .... or <ice:outputstyle with one of icefaces built-in theme such as xp, rime, and royale.

Liming