PDA

View Full Version : Urgent - hidden table please help

ClueLess
11-18-2002, 03:44 PM
I have a dropdown box; it has 1. Payment, 2.Payment –two,3.Payment-three, 4.Full-Payement. If user chooses on 4.Full-Paymenet, it shows a banking table. To do that, I have an hidden table and onchange function
I got an error, it keeps saying that. “Error: ‘document.all.BillPlan.selectedIndex’ is null or not an object.
I know, the onchange function is correct. It works fine. BUT, how can I fix the hidden table? Thanks for your help.


<form action="BillingEdit.asp" name="SubmitForm" method="post" onsubmit="ShowDate()">
<table border="0" cellpadding="1" cellspacing="1">
<td>&nbsp;
<script language="javascript">
function changeValue()
{
if (document.all.BillPlan.selectedIndex == 4)
{
document.all.showbankinfo.style.display = ''
}
else
{
document.all.showbankinfo.style.display = 'none'
}
}
</script>
<select style="border:1 solid #000000" name="BillPlan" ID="BillPlan" onchange="changeValue()">
<option>1. Payment </option>
<option> 2.Payment –two</option>
<option> 3.Payment-three</option>
<option> 4.Full-Payement </option>

</select>

</td>
</tr>
<tr>
<td>
<table id="showbankinfo" name="showbankinfo" border="0" cellpadding="1" cellspacing="1">
<!---banking table--->
</table>
</td>
</tr>
<script language="javascript">
// function showtable(){
//document.SubmitForm.submit();
//alert(document.all.BillPlan.selectedIndex);
if (document.all.BillPlan.selectedIndex == 4)
{
document.all.showbankinfo.style.display = ''; //show form's field
}
else
{
document.all.showbankinfo.style.display = 'none'; //hidden
}
// }
</script>
</table>
</form>
beetle
11-18-2002, 07:05 PM
the selectedIndex property of a SELECT element is the numerical index of the option selected in the SELECT's options collection. The options collection is an array (as all collections are), and array indexes are zero-based. What does this mean? It means that the first item in an array has an index of 0. The 2nd item has an index of 1 and so forth. So, the fourth OPTION in a SELECT has a index of 3 in the options collection.<select style="border:1 solid #000000" name="BillPlan" ID="BillPlan" onchange="changeValue()">

<option>1. Payment </option> //When selected, selectedIndex == 0
<option> 2.Payment –two</option> //When selected, selectedIndex == 1
<option> 3.Payment-three</option> //When selected, selectedIndex == 2
<option> 4.Full-Payement </option> //When selected, selectedIndex == 3

</select> So, what you need isif (document.all.BillPlan.selectedIndex == 3) Make sense?
ClueLess
11-18-2002, 07:40 PM
Yes, that makes a lot of sense to me. I did try it, but it gives me the same error message.
beetle
11-18-2002, 07:45 PM
instead of document.all (which is IE only, BTW) use

document.SubmitForm.elements['BillPlan'].selectedIndex
ClueLess
11-18-2002, 09:40 PM
Yes, i did try that before too. But, it is not working as we I want. Becuase, the table is not hidden.
What I try to do here is, i have page1.asp has information of the dropdown list, which is called: BillPlan = "one out of 4 options", example "3.Payment Three".
When I hit Edit on page1.asp, the "3.Payment Three" supposes to show inside of the dropdown list. At this time,the table is hidden. If the user wants to select "4.Full-Payement" then the table show.

Well, it has to work another way around as well. EX: if BillPlan in the page1.asp shows as "BillPlan = 4.Full-Payement" when the user goes to this page, the "4.Full-Payement" show inside of the dropdown list and the banking table shows as well.

The reason, I cannot use "SubmitForm" because it effects other thing. Do you have another ideas...Which is doing anything with the FORM NAME.
beetle
11-18-2002, 09:57 PM
uhhh, if I understand you right...

function changeValue() {
var i = document.SubmitForm.elements['BillPlan'].selectedIndex;
var t = document.getElementById('showbankinfo');
t.style.display = (i == 3) ? "block" : "none";
}

<body onload="changeValue();">

<select style="border:1 solid #000000" name="BillPlan" ID="BillPlan" onchange="changeValue()">
ClueLess
11-18-2002, 10:07 PM
beetle,
thanks for your help so far. I can tell that u're a great helper.

hmmmm, the <body> has onload event already. It does for something. That is a reason why I cannot use the Form name '

I CANNOT use this statement - "document.SubmitForm.elements['BillPlan'].selectedIndex" , because it reload the whole form. it effects to something else that I have in the form. I don't want to reload the whole form.
beetle
11-18-2002, 10:34 PM
Ok, now you aren't making sense. That line WON'T submit the form...it just reads the value of the selectedIndex of BillPlan. So what is doing it? Can I see your code?

Doesn't matter if the onload already exists in the body...just add the function call in there...

<body onload="someExistingCode; changeValue();">
ClueLess
11-19-2002, 05:31 PM
My onchange event is working fine! It works exactly what I want. I got an error on the HIDDEN table's script, which is

<script language="javascript">

//if (document.all.BillPlan.selectedIndex == 3)
if (document.SubmitForm.elements['BillPlan'].selectedIndex == 3)
{
document.all.showbankinfo.style.display = ''; //show form's field
}
else
{
document.all.showbankinfo.style.display = 'none'; //hidden
}

</script>
.
beetle
11-19-2002, 05:55 PM
What is the error?

Oh and it should be...

document.all.showbankinfo.style.display = 'block'; //show form's field
ClueLess
11-19-2002, 06:03 PM
I did try that as well

Well, it is still giving a stupid error. It keeps saying that “Error: ‘document.all.BillPlan.selectedIndex’ is null or not an object. "


this line got an error:


if (document.all.BillPlan.selectedIndex == 3)
//if (document.SubmitForm.elements['BillPlan'].selectedIndex == 3)
beetle
11-19-2002, 08:13 PM
Can you link me to your testpage?