Javascript/Seam and Facelets has me baffled!
A couple of questions on the code below:
1. Why are my varibales being renamed _id9:? can I guarentee that they will always be prefixied by this and if not how do I reference them?
2. How on earth do I reference the advertType; as document.getElementById("_id9:advertType"); brigs back something strange... that I cannot pass into the javascript function.
On page load I want to fire the script to disable the relevant section.
I think I have to disable it as "display=none" seems to not stop it being validated!
I must be misunderstanding something fundemental about seam, facelets and javascript as they seem at odds... this is weired!
<!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:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:c="http://java.sun.com/jstl/core"
xmlns:s="http://jboss.com/products/seam/taglib">
<script language="JavaScript" src="../../javascript/setstyle/setstyle.js"/>
<script language="JavaScript">
function checkAdvertType(radioButtons) {
var buttonClicked = radioButtons.value;
if (buttonClicked.toString() == "Lineage") {
document.getElementById("_id9:goToUpload").disabled = true;
document.getElementById("_id9:textArea").disabled = false;
} else if (buttonClicked.toString() == "BannerAd") {
document.getElementById("_id9:goToUpload").disabled = false;
document.getElementById("_id9:textArea").disabled = true;
} else {
alert("Internal Error - Unsupported Ad Type");
}
}
</script>
<table>
<!-- Advert Type -->
<tr>
<td align="right">
<h:outputLabel for="advertType" value="#{messages.label_ad_type}" />
<h:outputText value="#{messages.label_field_marker}" />
</td>
<td align="left">
<table>
<tr>
<td>
<s:decorate>
<h:selectOneRadio id="advertType" required="true" value="#{advertisingCampaignController.campaign.advert.type}" onclick="checkAdvertType(this)">
<s:selectItems id="choices" value="#{advertisingCampaignController.campaign.advert.advertTypes}" var="advertType" label="#{messages[advertType.label]}"/>
<s:convertEnum />
</h:selectOneRadio>
</s:decorate>
</td>
</tr>
</table>
</td>
</tr>
<!-- Text Lines -->
<tr id="textLines">
<td align="right">
<h:outputLabel for="advertType" value="#{messages.label_text_lines}" />
<h:outputText value="#{messages.label_field_marker}" />
</td>
<td align="left">
<table>
<tr>
<td>
<s:decorate>
<h:inputTextarea id="textArea" required="true" rows="4" cols="20" value="#{advertisingCampaignController.campaign.advert.textLines}">
<s:validate/>
</h:inputTextarea>
</s:decorate>
</td>
</tr>
</table>
</td>
<td>
<h:outputText value="#{messages.tag_mandatory}"
styleClass="mandatory" />
</td>
</tr>
<tr>
<td>
<h:outputText value="" />
</td>
<td>
<h:message styleClass="error" for="textArea" />
</td>
<td>
<h:outputText value="" />
</td>
</tr>
<!-- Upload Image Component -->
<tr id="upload">
<td align="right">
<h:outputLabel for="goToUpload" value="#{messages.label_upload}" />
<h:outputText value="#{messages.label_field_marker}" />
</td>
<td align="left">
<h:commandButton id="goToUpload"
action="#{advertisingCampaignController.goToUploadBanner}"
value="#{messages.button_add_banner}"/>
</td>
<td>
<h:outputText value="#{messages.tag_mandatory}"
styleClass="mandatory" />
</td>
</tr>
<tr>
<td>
<h:outputText value="" />
</td>
<td>
<h:message styleClass="error" for="goToUpload" />
</td>
<td>
<h:outputText value="" />
</td>
</tr>
<tr>
<td colspan="3" align="center">
<s:graphicImage value="#{advertisingCampaignController.campaign.advert.image.imageBytes}" rendered="#{(advertisingCampaignController.campaign.advert.image.name != null) and (advertisingCampaignController.campaign.advert.image.name != '')}"/>
</td>
</tr>
<tr>
<td colspan="3" align="center">
<h:outputText value="#{advertisingCampaignController.campaign.advert.image.name}" rendered="#{(advertisingCampaignController.campaign.advert.image.name != null) and (advertisingCampaignController.campaign.advert.image.name != '')}"/>
</td>
</tr>
</table>
</html>
<script language="JavaScript">
var radioButtons = document.getElementById("_id9:advertType");
checkAdvertType(radioButtons);
</script>
