Question

hello everyone i am try to extract value from the field of a JSF page using document.getElementById(“someid”)

here is the actual code

      <h:form id="hell">
                <h:panelGrid columns="12" border="0">
                    <h:outputLabel>Airlines</h:outputLabel>
                    <h:selectOneMenu  value="#{planeMngr.PM.airline_no}" styleClass="inputbox" style="width:150px">
                        <f:selectItems value="#{projectUtil.airlineList}" var="AList" itemLabel="#{AList.name}" itemValue="#{AList.name}"/>
                    </h:selectOneMenu>
                    <h:outputLabel>Source</h:outputLabel>
                    <h:selectOneMenu  value="#{planeMngr.PM.source}" styleClass="inputbox" style="width:150px">
                        <f:selectItems value="#{projectUtil.contyList}" var="RList" itemLabel="#{RList.country_Name}" itemValue="#{RList.country_Name}"/>
                    </h:selectOneMenu>
                    <h:outputLabel>Destination</h:outputLabel>
                    <h:selectOneMenu value="#{planeMngr.PM.destination}" styleClass="inputbox" style="width:150px">
                        <f:selectItems value="#{projectUtil.contyList}" var="RList" itemValue="#{RList.country_Name}"/>
                    </h:selectOneMenu>

                    <h:outputLabel>Departure Date</h:outputLabel>
                    <h:inputText id ="depday" value="#{planeMngr.PM.departure_date}" label="dd/mm/yyyy" >
                        <f:convertDateTime pattern="dd/MM/yyyy" dateStyle="full" ></f:convertDateTime>

                    </h:inputText>



                    <h:outputLabel>Departure Time </h:outputLabel>
                    <h:inputText id="deptime" value="#{planeMngr.PM.departure_time}" label="HH:MM"  >
                        <f:convertDateTime pattern="HH:mm"></f:convertDateTime>
                    </h:inputText>



                    <h:outputLabel value="Status"/>
                    <h:selectOneMenu  label="Status" value="#{planeMngr.PM.status}">
                        <f:selectItem  itemLabel="PreFlight" itemValue="PreFlight" />
                        <f:selectItem  itemLabel="Open" itemValue="Open" />
                        <f:selectItem  itemLabel="Restricted CheckIn" itemValue="Restricted_CheckIn" />
                        <f:selectItem  itemLabel="Restricted" itemValue="Restricted" />
                        <f:selectItem  itemLabel="Closed" itemValue="Closed" />
                        <f:selectItem  itemLabel="Released" itemValue="Released" />
                    </h:selectOneMenu>
                </h:panelGrid>
                <h:commandButton onclick="return datevalidate()" action="#{planeMngr.ADD}" value="save" ></h:commandButton>
            </h:form>

here is my JS code. in which i am just checking what are the value in the field that is filled by user.

 function datevalidate()
{
  var dat = document.getElementById("hell:deptime");
var day = document.getElementById("hell:depday");
alert(dat +" time "+day); // this gives "[object HTMLInputElement] time [object HTMLInputElement]" as an out put
return false;   
}

tell me what i am doing wrong here?

Answer 1

In JavaScript to get values from HTMLInputElement use its value field:

alert(dat.value +" time "+day.value);