commandButton 'onclick' doesn't execute javascript method in XHTML page
I'm hoping someone can help me.
After a couple of weeks trying just about everything I'm wondering why I can't reach my java script code with the onclick event in commandButton.
Here is the XHTML page...
view plaincopy to clipboardprint?
Note: Text content in the code blocks is automatically word-wrapped
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http-://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http-://www.w3.org/1999/xhtml"
xmlns:ui="http-://java.sun-com/jsf/facelets"
xmlns:h="http-://java.sun-com/jsf/html"
>
<ui:composition template="/template.xhtml">
<ui:define name="title">
<h:outputText value="#{bundle.CreateAssetsTitle}"></h:outputText>
</ui:define>
<ui:define name ="head">
<meta http-equiv="content-script-type" content="text/javascript"></meta>
<script type="text/javascript" >
var iid1 = "";
function setValue() {
iid1 = "value";
alert(iid1);
var depvalue=document.getElementById('deprecation').value;
var cost = getCost();
if (cost == null) return;
if (depvalue > 0 ) {
var newval = cost-depvalue;
alert(newval);
tvalue.value = newval;
//cost.disabled = true;
}
}
function getCost() {
if (iid1 == '') return null;
var costId = 'cost';
var cost = document.getElementById(costId).value;
if (cost == null) {
return null;
}
return cost;
}
</script>
</ui:define>
<ui:define name="body">
<h:panelGroup id="messagePanel" layout="block">
<h:messages errorStyle="color: red" infoStyle="color: green" layout="table" />
</h:panelGroup>
<h:form>
<h:panelGrid columns="2">
<h:outputLabel value="#{bundle.CreateAssetsLabel_assetId}" for="assetId" />
<h:outputText id="assetId" value="#{assetsController.selected.assetId}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_description}" for="description" />
<h:inputText id="description" value="#{assetsController.selected.description}" title="#{bundle.CreateAssetsTitle_description}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_location}" for="location" />
<h:inputText id="location" value="#{assetsController.selected.location}" title="#{bundle.CreateAssetsTitle_location}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_year}" for="year" />
<h:inputText id="year" value="#{assetsController.selected.year}" title="#{bundle.CreateAssetsTitle_year}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_cost}" for="cost" />
<h:inputText id="cost" value="#{assetsController.selected.cost}" title="#{bundle.CreateAssetsTitle_cost}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_deprecation}" for="deprecation" />
<h:inputText id="deprecation" value="#{assetsController.selected.deprecation}" title="#{bundle.CreateAssetsTitle_deprecation}" />
<h:commandButton value="#{bundle.CreateAssetsLabel_value}" onclick="setTheValue()" />
<h:inputText id="tvalue" value="#{assetsController.selected.value}" title="#{bundle.CreateAssetsTitle_value}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_furnishings}" for="furnishings" />
<h:inputText id="furnishings" value="#{assetsController.selected.furnishings}" title="#{bundle.CreateAssetsTitle_furnishings}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_equipment}" for="equipment" />
<h:inputText id="equipment" value="#{assetsController.selected.equipment}" title="#{bundle.CreateAssetsTitle_equipment}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_computer}" for="computer" />
<h:inputText id="computer" value="#{assetsController.selected-computer}" title="#{bundle.CreateAssetsTitle_computer}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_agricultural}" for="agricultural" />
<h:inputText id="agricultural" value="#{assetsController.selected.agricultural}" title="#{bundle.CreateAssetsTitle_agricultural}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_musical}" for="musical" />
<h:inputText id="musical" value="#{assetsController.selected.musical}" title="#{bundle.CreateAssetsTitle_musical}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_infrastructure}" for="infrastructure" />
<h:inputText id="infrastructure" value="#{assetsController.selected.infrastructure}" title="#{bundle.CreateAssetsTitle_infrastructure}" />
</h:panelGrid>
<br />
<h:commandLink action="#{assetsController.create}" value="#{bundle.CreateAssetsSaveLink}" />
<br />
<br />
<h:commandLink action="#{assetsController.prepareList}" value="#{bundle.CreateAssetsShowAllLink}" immediate="true"/>
<br />
<br />
<h:link outcome="/index" value="#{bundle.CreateAssetsIndexLink}"/>
</h:form>
</ui:define>
</ui:composition>
</html>
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http-://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http-://www.w3.org/1999/xhtml"
xmlns:ui="http-://java.sun-com/jsf/facelets"
xmlns:h="http-://java.sun-com/jsf/html"
>
<ui:composition template="/template.xhtml">
<ui:define name="title">
<h:outputText value="#{bundle.CreateAssetsTitle}"></h:outputText>
</ui:define>
<ui:define name ="head">
<meta http-equiv="content-script-type" content="text/javascript"></meta>
<script type="text/javascript" >
var iid1 = "";
function setValue() {
iid1 = "value";
alert(iid1);
var depvalue=document.getElementById('deprecation').value;
var cost = getCost();
if (cost == null) return;
if (depvalue > 0 ) {
var newval = cost-depvalue;
alert(newval);
tvalue.value = newval;
//cost.disabled = true;
}
}
function getCost() {
if (iid1 == '') return null;
var costId = 'cost';
var cost = document.getElementById(costId).value;
if (cost == null) {
return null;
}
return cost;
}
</script>
</ui:define>
<ui:define name="body">
<h:panelGroup id="messagePanel" layout="block">
<h:messages errorStyle="color: red" infoStyle="color: green" layout="table" />
</h:panelGroup>
<h:form>
<h:panelGrid columns="2">
<h:outputLabel value="#{bundle.CreateAssetsLabel_assetId}" for="assetId" />
<h:outputText id="assetId" value="#{assetsController.selected.assetId}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_description}" for="description" />
<h:inputText id="description" value="#{assetsController.selected.description}" title="#{bundle.CreateAssetsTitle_description}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_location}" for="location" />
<h:inputText id="location" value="#{assetsController.selected.location}" title="#{bundle.CreateAssetsTitle_location}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_year}" for="year" />
<h:inputText id="year" value="#{assetsController.selected.year}" title="#{bundle.CreateAssetsTitle_year}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_cost}" for="cost" />
<h:inputText id="cost" value="#{assetsController.selected.cost}" title="#{bundle.CreateAssetsTitle_cost}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_deprecation}" for="deprecation" />
<h:inputText id="deprecation" value="#{assetsController.selected.deprecation}" title="#{bundle.CreateAssetsTitle_deprecation}" />
<h:commandButton value="#{bundle.CreateAssetsLabel_value}" onclick="setTheValue()" />
<h:inputText id="tvalue" value="#{assetsController.selected.value}" title="#{bundle.CreateAssetsTitle_value}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_furnishings}" for="furnishings" />
<h:inputText id="furnishings" value="#{assetsController.selected.furnishings}" title="#{bundle.CreateAssetsTitle_furnishings}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_equipment}" for="equipment" />
<h:inputText id="equipment" value="#{assetsController.selected.equipment}" title="#{bundle.CreateAssetsTitle_equipment}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_computer}" for="computer" />
<h:inputText id="computer" value="#{assetsController.selected-computer}" title="#{bundle.CreateAssetsTitle_computer}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_agricultural}" for="agricultural" />
<h:inputText id="agricultural" value="#{assetsController.selected.agricultural}" title="#{bundle.CreateAssetsTitle_agricultural}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_musical}" for="musical" />
<h:inputText id="musical" value="#{assetsController.selected.musical}" title="#{bundle.CreateAssetsTitle_musical}" />
<h:outputLabel value="#{bundle.CreateAssetsLabel_infrastructure}" for="infrastructure" />
<h:inputText id="infrastructure" value="#{assetsController.selected.infrastructure}" title="#{bundle.CreateAssetsTitle_infrastructure}" />
</h:panelGrid>
<br />
<h:commandLink action="#{assetsController.create}" value="#{bundle.CreateAssetsSaveLink}" />
<br />
<br />
<h:commandLink action="#{assetsController.prepareList}" value="#{bundle.CreateAssetsShowAllLink}" immediate="true"/>
<br />
<br />
<h:link outcome="/index" value="#{bundle.CreateAssetsIndexLink}"/>
</h:form>
</ui:define>
</ui:composition>
</html>
The java script accepts a big decimal value for Cost and Depreciation and attempts to insert the value (cost-depreciation) into the value field.
If anyone has any ideas I would be very grateful.