Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Havig Problems Referencing Controls on Page

Status
Not open for further replies.
SDyke

SDyke

MIS
Oct 13, 2005
55
US
Why does the following syntax generate an error that control is null or not an object?

document.form1.text3.value = "Steve";
 
Sort by date Sort by votes
I have done a little more testing and this only happens on JSF not JSP.

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%-- jsf:pagecode language="java" location="/JavaSource/pagecode/Testjsfform.java" --%><%-- /jsf:pagecode --%>
<%@taglib uri="[URL unfurl="true"]http://java.sun.com/jsf/html"[/URL] prefix="h"%>
<%@taglib uri="[URL unfurl="true"]http://www.ibm.com/jsf/html_extended"[/URL] prefix="hx"%>
<%@taglib uri="[URL unfurl="true"]http://www.ibm.com/jsf/BrowserFramework"[/URL] prefix="odc"%>
<HTML>
<HEAD>
<%@ taglib uri="[URL unfurl="true"]http://java.sun.com/jsf/core"[/URL] prefix="f"%>
<%@taglib uri="[URL unfurl="true"]http://java.sun.com/jsp/jstl/core"[/URL] prefix="c" %>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<META name="GENERATOR" content="IBM Software Development Platform">
<META http-equiv="Content-Style-Type" content="text/css">
<LINK href="theme/Master.css" rel="stylesheet"
	type="text/css">
<TITLE>testjsfform.jsp</TITLE>
<LINK rel="stylesheet" type="text/css" href="theme/stylesheet.css"
	title="Style">
<LINK rel="stylesheet" type="text/css" href="theme/tabpanel.css"
	title="Style">
</HEAD>
<f:view>
<BODY onload="addText()"><hx:scriptCollector id="scriptCollector1"><h:form styleClass="form" id="form1">
			<h:inputText styleClass="inputText" id="text3"></h:inputText>
			<BR>
			<BR>
			<SCRIPT type="text/javascript">
function addText(){
	document.form1.text3.value = "Steve";
}
</SCRIPT>
			<odc:tabbedPanel slantActiveRight="4" styleClass="tabbedPanel"
				width="300" slantInactiveRight="4" height="300"
				variableTabLength="false" showBackNextButton="true" showTabs="true"
				id="tabbedPanel1">
				<odc:bfPanel id="bfpanel1" name="Tab1"
					showFinishCancelButton="false">
					<h:inputText styleClass="inputText" id="text1" value="test"></h:inputText>
					<hx:commandExButton type="submit" value="Submit"
						styleClass="commandExButton" id="button1" onclick="showAlert(this.form)"></hx:commandExButton>
					<h:selectOneRadio disabledClass="selectOneRadio_Disabled"
						styleClass="selectOneRadio" id="radio1">
						<f:selectItem itemValue='Value0' itemLabel="Name0" />
						<f:selectItem itemValue='Value1' itemLabel="Name1" />
					</h:selectOneRadio>
					<h:selectManyCheckbox disabledClass="selectManyCheckbox_Disabled"
						styleClass="selectManyCheckbox" id="checkbox1">
						<f:selectItem itemValue="Value0" itemLabel="Name0" />
						<f:selectItem itemValue="Value1" itemLabel="Name1" />
					</h:selectManyCheckbox>
				</odc:bfPanel>
				<odc:bfPanel id="bfpanel2" name="Tab2"
					showFinishCancelButton="false">
					<h:inputText styleClass="inputText" id="text2"></h:inputText>
				</odc:bfPanel>
				<f:facet name="back">
					<hx:commandExButton type="submit" value="&lt; Back"
						id="tabbedPanel1_back" style="display:none"></hx:commandExButton>
				</f:facet>
				<f:facet name="next">
					<hx:commandExButton type="submit" value="Next &gt;"
						id="tabbedPanel1_next" style="display:none"></hx:commandExButton>
				</f:facet>
				<f:facet name="finish">
					<hx:commandExButton type="submit" value="Finish"
						id="tabbedPanel1_finish" style="display:none"></hx:commandExButton>
				</f:facet>
				<f:facet name="cancel">
					<hx:commandExButton type="submit" value="Cancel"
						id="tabbedPanel1_cancel" style="display:none"></hx:commandExButton>
				</f:facet>
			</odc:tabbedPanel>
			<BR>
			<hx:commandExButton type="submit" value="Submit"
				styleClass="commandExButton" id="button2" onclick="showAlert(this.form)"></hx:commandExButton>
		</h:form></hx:scriptCollector></BODY>
</f:view>
</HTML>
 
Upvote 0 Downvote
Hi

Hmm... I should keep the first intended version of my previous post. Was abit rude, but it said clearly to post the relevant parts of your page... Well, then I tell you now : post the relevant parts of your page. Where is accent on both "relevant" and "page". Do not post server-side code, but the HTML page source.

Feherke.
 
Upvote 0 Downvote
Your suggestion works great for the text box but the following will not work for a radio button

document.getElementById('form1:radio1').value= "Value1";
 
Upvote 0 Downvote
Hi

Why the part before the colon ( : ) ?
Code: 
document.getElementById('radio1').value= "Value1";
But are you sure you want to change the value of a radio button ? Not a frequent practice...

Feherke.
 
Upvote 0 Downvote
Your suggestion works great for the text box but the following will not work for a radio button
Click to expand...

You only asked for help with text objects, not a radio button.

Why don't you do as suggested, and post the real client-side code. Post your real requirements while you're at it, because you seem to be making up new ones as you go along.

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
Upvote 0 Downvote
I guess I am not understanding what code you want me to post. My previous post contains the code that generates the JSF that the client sees. As far as the text versus radio controls, I was just looking for the correct syntax for referencing page controls. I am sorry for the offences and thanks for helping me. I am in brand new territory with web developing.
 
Upvote 0 Downvote
Hi

SDyke said:
My previous post contains the code that generates the JSF that the client sees.
Click to expand...
No. You posted a JSF page, which probably is transformed into a Java class, which is compiled then when executed outputs an HTML document. All this happens on the server. Only the output HTML is sent to the client as browser can only render HTML documents. That HTML document is what we ask for. The one you can see with your browser's View Source command.

Feherke.
 
Upvote 0 Downvote
I finally woke up from my coma. This is the code you need. This does not produce any errors but it also does not set the value of the radio button which I really need. The value of the radio button will be determained by a value gathered from another source eventually.

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">




<HTML>
<HEAD>



<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<META name="GENERATOR" content="IBM Software Development Platform">
<META http-equiv="Content-Style-Type" content="text/css">
<LINK href="theme/Master.css" rel="stylesheet"
	type="text/css">
<TITLE>testjsfform.jsp</TITLE>
<LINK rel="stylesheet" type="text/css" href="theme/stylesheet.css"
	title="Style">
<LINK rel="stylesheet" type="text/css" href="theme/tabpanel.css"
	title="Style">
</HEAD>

<BODY onload="myControlValues()">
	<form id="form1" method="post" action="/DrawingPDMW1/faces/testjsfform.jsp" class="form" enctype="application/x-[URL unfurl="true"]www-form-urlencoded">[/URL]
<div id="form1:tabbedPanel1:bfpanel1" style="visibility: hidden">
					<input id="form1:text1" type="text" name="form1:text1" class="inputText" />
					<input type="button" value="Submit" name="form1:button1" id="form1:button1" onclick="myControlValues()" class="commandExButton" />
					
						
						
					<table id="form1:radio1" class="selectOneRadio">
	<tr>
<td>
<label for="form1:radio1"><input type="radio" name="form1:radio1" value="&quot;Value0&quot;">Name0</label></td>
<td>
<label for="form1:radio1"><input type="radio" name="form1:radio1" value="&quot;Value1&quot;">Name1</label></td>
	</tr>
</table>
				</div>
				<div id="form1:tabbedPanel1:bfpanel2" style="visibility: hidden">
					<input id="form1:text2" type="text" name="form1:text2" class="inputText" />
				</div>
				
					
				
				
					
				
				
					
				
				
					
				
			<input type="submit" value="&amp;lt; Back" name="form1:tabbedPanel1_back" id="form1:tabbedPanel1_back" style="display:none" /><input type="submit" value="Next &amp;gt;" name="form1:tabbedPanel1_next" id="form1:tabbedPanel1_next" style="display:none" /><input type="submit" value="Finish" name="form1:tabbedPanel1_finish" id="form1:tabbedPanel1_finish" style="display:none" /><input type="submit" value="Cancel" name="form1:tabbedPanel1_cancel" id="form1:tabbedPanel1_cancel" style="display:none" /><SCRIPT src="/DrawingPDMW1/.ibmjsfres/jsl/OdysseyMessage_en.js"></SCRIPT>
<SCRIPT src="/DrawingPDMW1/.ibmjsfres/jsl/odcSessionControllerMessage_en.js"></SCRIPT>
<SCRIPT language="JavaScript" src="/DrawingPDMW1/.ibmjsfres/jsl/jsl_core_c.js"></SCRIPT>
<SCRIPT language="JavaScript">Log.setLogLevel(-1); Log.setURLRewriter(getURLPrefix("/DrawingPDMW1/.ibmjsfres/jsl_css/x.css","jsl_css/x.css"), getURLPostfix("/DrawingPDMW1/.ibmjsfres/jsl_css/x.css","jsl_css/x.css")); 
 var URL_REWRITER_PREFIX = getURLPrefix("/DrawingPDMW1/.ibmjsfres/jsl_css/x.css","jsl_css/x.css"); var URL_REWRITER_POSTFIX= getURLPostfix("/DrawingPDMW1/.ibmjsfres/jsl_css/x.css","jsl_css/x.css"); var ODCPORTAL=0; var PAGE_LOCALE = "en_US"; 
</SCRIPT>
<SCRIPT language="JavaScript">
 var URL_REWRITER_PREFIX=getURLPrefix("/DrawingPDMW1/.ibmjsfres/jsl_css/x.css","jsl_css/x.css"); var URL_REWRITER_POSTFIX=getURLPostfix("/DrawingPDMW1/.ibmjsfres/jsl_css/x.css","jsl_css/x.css");</SCRIPT><SCRIPT>ODCProgressBar.startRenderControl(tabbed_panel);</SCRIPT>
<SCRIPT language="JavaScript" src="/DrawingPDMW1/.ibmjsfres/jsl/jsl_tabbedpanel_c.js"></SCRIPT>
<div id="form1:tabbedPanel1"></div>
<script language="JavaScript">
ODCTabPanelControlVar1 = new TabPanel(document.getElementById("form1:tabbedPanel1"), true, true, URL_REWRITER_PREFIX);
ODCTabPanelControlVar1.Name = "ODCTabPanelControlVar1";
ODCTabPanelControlVar1.setHeight("300");
ODCTabPanelControlVar1.setWidth("300");
ODCTabPanelControlVar1.setVariableTabLength("false");
ODCTabPanelControlVar1.tabSize = -2147483648;
ODCTabPanelControlVar1.setFinishButtonId("form1:tabbedPanel1_finish");
ODCTabPanelControlVar1.setCancelButtonId("form1:tabbedPanel1_cancel");
ODCTabPanelControlVar1.setBackButtonId("form1:tabbedPanel1_back");
ODCTabPanelControlVar1.setNextButtonId("form1:tabbedPanel1_next");
ODCTabPanelControlVar1.setStyleClass("tabbedPanel");
ODCTabPanelControlVar1.setNipAndTuckStyle(-2147483648 ,4 ,-2147483648 ,4);
ODCTabPanelControlVar1.addCaseFromDIV(0,"Tab1","form1:tabbedPanel1:bfpanel1","form1:tabbedPanel1:bfpanel2",null,null,null);
ODCTabPanelControlVar1.addCaseFromDIV(1,"Tab2","form1:tabbedPanel1:bfpanel2",null,"form1:tabbedPanel1:bfpanel1",null,null);
ODCTabPanelControlVar1.addFinishCancelButton([]);
ODCTabPanelControlVar1.updateControl();
ODCProgressBar.endRenderControl(tabbed_panel);
</SCRIPT>
<script>ODCRegistry.addElementInfo(null,'tabbedPanel1','form1:tabbedPanel1',ODCTabPanelControlVar1);</script><script>if(isIE()){
document.getElementById('form1').attachEvent('onsubmit', function(){ODCRegistry.saveAllToForm(document.getElementById('form1'));});
}
else{
document.getElementById('form1').addEventListener('submit', function(){ODCRegistry.saveAllToForm(document.getElementById('form1'));}, false);
}
</script>
			<BR>
			<input type="submit" value="Submit" name="form1:button2" id="form1:button2" onclick="showAlert(this.form)" class="commandExButton" />
		<input type="hidden" name="form1" value="form1" /></form>
<script type="text/javascript">
	
	function myControlValues(){
		document.getElementById("form1:text1").value = "Steve";
		document.getElementById("form1:radio1").value = "Value1";
		
	}
</Script>
</BODY>

</HTML>
 
Upvote 0 Downvote
Hi

How ugly. I see the names indeed look like 'form1:radio1'.

And the code you posted previously :
Code: 
document.getElementById('form1:radio1').value= "Value1";
works fine for me.

Again, are you sure you want to change the radio button's value ?

Feherke.
 
Upvote 0 Downvote
I dont't know what I am doing wrong but even though I don't get an error using the above line of code but the radio button control still is empty(neither items have a dot in them) when the page is ran.
 
Upvote 0 Downvote
Hi

Ouch ! Only now I realized how messy is that code. This is the solution for that :
Code: 
document.getElementById('form1').elements['form1:radio1'][[red]0[/red]].checked=true;
The red 0 means the first option, if you change it to 1 will mean the second option.

Feherke.
 
Upvote 0 Downvote
The above suggestion does not mark the radio button with a dot. Wouldn't I have to state which item needs the check? If so how do I reference a particular item. I have tried but it does not work(null or not and object).

Code: 
document.getElementById("form1:radio1")[1].checked = true;
 
Upvote 0 Downvote
SDyke's code:
Code: 
document.getElementById("form1:radio1")[1].checked = true;

<>

feherke's code:
Code: 
document.getElementById('form1').elements['form1:radio1'][0].checked=true;


1 != 2


feherke's code will check the radio button labeled Name0, believe you me.


[monkey][snake] <.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
739
Kennelbloke
Kennelbloke
rogerte
  • Locked
  • Question
Code that works on Windows, Android and Iphone
Replies
0
Views
576
rogerte
rogerte
JScannell
  • Locked
  • Question
Javascript issue on iPhone/iMac platforms
Replies
0
Views
602
JScannell
JScannell
penguinspeaks
  • Locked
  • Question
JS Open print dialog page to print a file
Replies
0
Views
233
penguinspeaks
penguinspeaks
chillay
  • Locked
  • Question
Add Control + F feature to a Web Page
Replies
3
Views
219
feherke
feherke

Part and Inventory Search

Sponsor

Back
Top