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!

How to populate a textbox with a a href onclick event 1

Status
Not open for further replies.
reportingbuzz

reportingbuzz

MIS
Feb 9, 2007
46
US
Hi,

I have a function which shows and hides an org tree. For every person I click on, i take the empid of the person and store it in a string. As I show, I add the person's empid to the string. As I hide, I remove the person's empid from the string. Within the function, how can I can populate a hidden textbox with the string above mentioned. I do not see the function populating the hidden box which is now visible.

javascript function is:

Code: 
function s_Hide(el){
	elID = 'UI_'+el;
	//alert(elID);
	obj = document.getElementById(elID).style;
	(obj.display == 'none')? obj.display = 'block' : obj.display = 'none';
	//Need to store the current state on a cookie - old comment
	//Need to store the current state in a string in a text field.
	var uniqueStr = '&' + el + '&'
	//var uniqueStr = '&' + elID + '&'
	var openedItems = "" //Added 2/9/07
	if (obj.display == 'block')
	{
	  // add it to the string openedItems
	  alert("Add '" + uniqueStr + "'");
	  openedItems = openedItems.concat(uniqueStr);
	}
	else
	{
	  // remove it from the string openedItems
	  alert("Remove '" + uniqueStr + "'");
	  openedItems = openedItems.replace(uniqueStr, '');
	}
	alert('s_hide - LastAlert:'+openedItems);

	//Store the openedItems info in the hState hidden text box.
	document.commissions.hState.value = openedItems;
}

My HTML hidden box is:

Code: 
<input type="text" name="hState" value="">

The tree in HTML is:
Code: 
<ul id="menu">
					    	<li>
								<input type="radio" checked ="checked" value="22979" name="empid" onClick="showReports(this.value)">
								<a href="#" class="a_style" onclick="s_Hide('22979'); return false;">Reinhard Nagel</a>&nbsp;
								<font size=1>(22979)</font>
								<ul id="UI_22979" style="display: none">

						<li>
							<input type="radio" value="8208" name="empid" onClick="showReports(this.value)">
							<a href="#" class="a_style" [b]onclick="s_Hide('8208'); return false;"[/b]>Patrick Cox</a>&nbsp;
							<font size=1>(8208)</font>
		             		<ul id="UI_8208" style="display: none">

						<li>
							<input type="radio" value="40801" name="empid" onClick="showReports(this.value)">
							Manuel Abad Ibanez&nbsp;
							<font size=1>(40801)</font>
						</li>
 
Sort by date Sort by votes
As this is written right now, you are resetting the value of the hidden textbox field everytime completely because of what I have highlighted below:

Code: 
function s_Hide(el){
    elID = 'UI_'+el;
    //alert(elID);
    obj = document.getElementById(elID).style;
    (obj.display == 'none')? obj.display = 'block' : obj.display = 'none';
    //Need to store the current state on a cookie - old comment
    //Need to store the current state in a string in a text field.
    var uniqueStr = '&' + el + '&'
    //var uniqueStr = '&' + elID + '&'
    [!]var openedItems = "" //Added 2/9/07[/!]
    if (obj.display == 'block')
    {
      // add it to the string openedItems
      alert("Add '" + uniqueStr + "'");
      openedItems = openedItems.concat(uniqueStr);
    }
    else
    {
      // remove it from the string openedItems
      alert("Remove '" + uniqueStr + "'");
      openedItems = openedItems.replace(uniqueStr, '');
    }
    alert('s_hide - LastAlert:'+openedItems);

    //Store the openedItems info in the hState hidden text box.
   [!]document.commissions.hState.value = openedItems;[/!]
}
You need to grab the current value in the textbox each time the function is called like this:

Code: 
var openedItems = document.commissions.hState.value ;

Just change that one line (var openedItems = "" ) to the above code and this should work.


<.

 
Upvote 0 Downvote
But on load of the page, there is nothing in the textbox because I have not yet clicked on the tree.

When I do the above, I get an error:

Code: 
document.commissions.hState is null or not an object

I think it is easier for you reproduce the error if I give the HTML code. Here is it.

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/html4/loose.dtd">[/URL]

<HTML>
<HEAD>
<style type="text/css">
* {
   margin:0px;
   padding:0px;
}

* {
   border: 0;
   padding: 0;
   margin: 0;
}

#menu {
  padding:0;
  margin:0;
  }
#menu li {
  list-style-type:none;
  }

#menu ul {
padding: 0;
margin: 6px;
list-style-type: none;
}

</style>
<Script type="text/JavaScript" >

/*************************************************************
This Function validates that the users select the required
parameters to view the crystal reports
**************************************************************/
function ValidateData(f) {

	// Check to make sure Reporting Period is selected.
	if (f.period.value == "Select") {
		alert("Select a Reporting Period");
		f.period.focus();
		return false;
		}

	//Check to make sure a report is selected.
	// validate myradiobuttons
	myOption = -1;
	for (i=f.crystalradio.length-1; i > -1; i--) {
		if (f.crystalradio[i].checked) {
			myOption = i;
		}
	}
	if (myOption == -1) {
	alert("You must select a report to view");
	return false;
	}

	//Populate hidden textbox with Period
	var jPeriod = f.period.value;
	f.hPeriod.value = jPeriod;
	alert(jPeriod);

	//Populate hidden textbox with EmpID radio button value
	for (i=f.empid.length-1; i>-1; i--)
	{
		if (f.empid[i].checked)
		{
			f.hEmpID.value = f.empid[i].value;
			alert(f.hEmpID.value);
		}
	}

	//Populate hidden textbox with Crystal Report value
	for (i=f.crystalradio.length-1;i>-1;i--)
	{
		if (f.crystalradio[i].checked)
		{
			f.hCrystalRadio.value = f.crystalradio[i].value;
			alert(f.hCrystalRadio.value);
		}
	}

	//Populate hidden textbox with openItems which has the string built by the s_Hide(el) function

}

/**********************************************************
Function to expand and collapse the Hierarchial tree
**********************************************************/

function s_Hide(el){
	elID = 'UI_'+el;
	//alert(elID);
	obj = document.getElementById(elID).style;
	(obj.display == 'none')? obj.display = 'block' : obj.display = 'none';
	//Need to store the current state in a string in a text field.
	var uniqueStr = '&' + el + '&'
	//var uniqueStr = '&' + elID + '&'
	var openedItems = document.commissions.hState.value ; //Added 2/9/07
	if (obj.display == 'block')
	{
	  // add it to the string openedItems
	  alert("Add '" + uniqueStr + "'");
	  openedItems = openedItems.concat(uniqueStr);
	}
	else
	{
	  // remove it from the string openedItems
	  alert("Remove '" + uniqueStr + "'");
	  openedItems = openedItems.replace(uniqueStr, '');
	}
	alert('s_hide - LastAlert:'+openedItems);

	//Store the openedItems info in the hState hidden text box.
	document.commissions.hState.value = openedItems;
}

//This function takes the openItems string stored in the textbox hState
//which is the holder of the state information.

function do_onload()
{
	alert("on_load");
	if (document.commission.hState.value != "")
	{
		alert(document.commission.hState.value); //returns a blank text box
	}
	else
	{
		alert("No value is hState textbox");
	}

	if (document.commission.hState.value != "")
	{
		alert("Here b4 '" + openedItems + "'");
		var displayItems = openItems.split("&");
		for (i=0; i<displayItems.length; i++)
		{
			if(displayItems[i].lenght != 0)
			{
				//Set the value to 'block'
				alert(displayItems[i]);
				elID = 'UI_'+displayItems[i];
				obj = document.getElementById(elID).style;
				obj.display = 'block'
			}

		}
	}
}

//savestate function which stores the openedItems information
function saveState()
{
	var info = document.commission.hState.value;
	alert('savestate:'+info);

}

//On unload of this window, call the savestate so that the value of opened employees
//are stored before we lose them
window.onunload = saveState
window.onload = do_onload

</script>
<TITLE>View Commissions Reports</TITLE>
</HEAD>

<body>

<!-- This is the top most level which holds all the content divs -->
<div class="div_Container">


	<form name="commission" method="POST" action="ViewReports7.asp" onSubmit="">
	<input type="text" name="hState" value="" bgcolor="yellow">

	<ul id="menu">
					    	<li>
								<input type="radio" checked ="checked" value="22979" name="empid" onClick="">
								<a href="#" class="a_style" onclick="s_Hide('22979'); return false;">Top Most Manager</a>&nbsp;
								<font size=1>(22979)</font>
								<ul id="UI_22979" style="display: none">

						<li>
							<input type="radio" value="8208" name="empid" onClick="">
							<a href="#" class="a_style" onclick="s_Hide('8208'); return false;">Manager1</a>&nbsp;
							<font size=1>(8208)</font>
		             		<ul id="UI_8208" style="display: none">

						<li>
							<input type="radio" value="40801" name="empid" onClick="">
							Sub1&nbsp;
							<font size=1>(40801)</font>
						</li>

						<li>
							<input type="radio" value="8089" name="empid" onClick="">
							Sub2&nbsp;
							<font size=1>(8089)</font>
						</li>

						<li>
							<input type="radio" value="8218" name="empid" onClick="">
							Sub3&nbsp;
							<font size=1>(8218)</font>
						</li>

		                    </ul>
		                </li>

						<li>
							<input type="radio" value="28391" name="empid" onClick="">
							Sub4&nbsp;
							<font size=1>(28391)</font>
						</li>

						<li>
							<input type="radio" value="9006" name="empid" onClick="">
							Sub5&nbsp;
							<font size=1>(9006)</font>
						</li>

						<li>
							<input type="radio" value="8073" name="empid" onClick="">
							Sub6&nbsp;
							<font size=1>(8073)</font>
						</li>

						<li>
							<input type="radio" value="40343" name="empid" onClick="">
							<a href="#" class="a_style" onclick="s_Hide('40343'); return false;">Manager2</a>&nbsp;
							<font size=1>(40343)</font>
		             		<ul id="UI_40343" style="display: none">

						<li>
							<input type="radio" value="41543" name="empid" onClick="">
							Sub7&nbsp;
							<font size=1>(41543)</font>
						</li>

						<li>
							<input type="radio" value="40798" name="empid" onClick="">
							Sub8&nbsp;
							<font size=1>(40798)</font>
						</li>

		                    </ul>
		                </li>

								</ul>
							</li>
						</ul>

	<center><input type="submit" value="Request Reports" class="btn"></center>

</form>

</body>

</html>

Am I referring to the hState textbox in a wrong way because error says that it is either null or not an object...

Thanks.
 
Upvote 0 Downvote
In haste, i had sent the code. It was indeed a typo error. The form name, I was referring to was wrong. Now I do not get that error.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
1K
Mike Lewis
Mike Lewis
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
648
malpa
malpa
Rayj0000
  • Locked
  • Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
574
Rayj0000
Rayj0000
penguinspeaks
  • Locked
  • Question
How do I pass a classic asp variable to JS
Replies
1
Views
892
xwb
xwb
Ahmad khalafalla
  • Locked
  • Question
How to listen to 'onclick' event on the document
Replies
1
Views
179
feherke
feherke

Part and Inventory Search

Sponsor

Back
Top