...

View Full Version : Max number of values in a list



Dominick
07-11-2003, 09:42 PM
Hello everyone. Sincere thanks in advance for all your help in the past and hopefully the present.

I've modified a function that allows you to select items from a list box and move them to another list box. I then took that function, duplicated it and then reversed the variables so that you can transfer the items back to their original list box. Works in NN 4.7 and late-model NN and IE, so I was thrilled. Feeling quite confident at that point, I added alert messages so that a user would be informed if they tried to move an item from either list box without actually selecting one from the list. That also worked well and I was beside myself with joy - until I decided that I would like to set a maximum number of five values in the second list box - in other words, if a user tries to add a sixth value, they will be alerted that the maximum is five.

I've tried a number of methods, to no avail...Any suggestions would be greatly appreciated.

Regards,

Dominick

==============================================


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

<html>
<head>
<title></title>

<script language="JavaScript">
<!--
function transferAtoB(object) {
var index = object.dropdownlistA.selectedIndex;
if (index > -1) {
var newoption = new Option(object.dropdownlistA.options[index].text, object.dropdownlistA.options[index].value, true, true);
object.dropdownlistB.options[object.dropdownlistB.length] = newoption;

if (!document.getElementById) history.go(0);
object.dropdownlistA.options[index] = null;
object.dropdownlistA.selectedIndex = 0;
}
else
alert ('Please select an item from List A that you would like to add to List B.');
}

function transferBtoA(object) {
var index = object.dropdownlistB.selectedIndex;
if (index > -1) {
var newoption = new Option(object.dropdownlistB.options[index].text, object.dropdownlistB.options[index].value, true, true);
object.dropdownlistA.options[object.dropdownlistA.length] = newoption;
if (!document.getElementById) history.go(0);
object.dropdownlistB.options[index] = null;
object.dropdownlistB.selectedIndex = 0;
}
else
alert ('Please select an item from List B that you would like to return to List A.');
}
//-->
</script>

</head>

<body>

<form name="MyForm">

<table border="0" cellpadding="0" cellspacing="0">

<tr>
<td align="center" valign="top" width="220">List A</td>
<td width="50"></td>
<td align="center" valign="top" width="220">List B</td>
</tr>

<tr>
<td align="center" valign="top">
<select name="dropdownlistA" size="6" style="width:200px;">
<option value="Option 01">Entry 01</option>
<option value="Option 02">Entry 02</option>
<option value="Option 03">Entry 03</option>
<option value="Option 04">Entry 04</option>
<option value="Option 05">Entry 05</option>
<option value="Option 06">Entry 06</option>
<option value="Option 07">Entry 07</option>
<option value="Option 08">Entry 08</option>
<option value="Option 09">Entry 09</option>
<option value="Option 10">Entry 10</option>
</select>
<br><br>
<input type="button" value="Add to List B" onClick="if (document.images) transferAtoB(this.form)">
</td>

<td>&nbsp;&nbsp;&nbsp;&nbsp;</td>

<td align="center" valign="top">
<select name="dropdownlistB" size="6" style="width:200px;">
</select>
<br><br>
<input type="button" value="Return to List A" onClick="if (document.images) transferBtoA(this.form)">
</td>
</tr>
</table>

</form>


</body>
</html>

beetle
07-12-2003, 07:54 AM
a generic reference

form.select.options.length

The length of the options collection is the number you're after

Dominick
07-17-2003, 03:04 PM
beetle:

Sincere thanks for the tip. Using your advice, I created an alternate function that counts the values and disables the appropriate button based on the number. Works great in late model IE, NN but I need to work it out for NN 4.7. I wish 4.7 would just disappear...

Here's what's going on:

===========================================

<html>
<head>
<title></title>

<style>

body,td {
font : verdana;
font-size : 11px;
}
</style>

<script>
function buttonState()
{
var SL=0;
var SLTOT=document.MyForm.dropdownlistB.options;

for(var i=0;i<SLTOT.length;i++)
{
SL+=(SLTOT[i])?1:0;
}

if (SL < 1)
{
document.MyForm.BtoA.disabled=true;
document.MyForm.AtoB.disabled=false;
}

if (SL >= 1)
{
document.MyForm.BtoA.disabled=false;
document.MyForm.AtoB.disabled=false;
}

if (SL <= 5)
{
return true;
}

if (SL = 6)
{
document.MyForm.AtoB.disabled=true;
return false;
}
}

</script>


<script language="JavaScript">
<!--
function transferAtoB(object) {
var index = object.dropdownlistA.selectedIndex;

if (index > -1) {
var newoption = new Option(object.dropdownlistA.options[index].text, object.dropdownlistA.options[index].value, true, true);
object.dropdownlistB.options[object.dropdownlistB.length] = newoption;
if (!document.getElementById) history.go(0);
object.dropdownlistA.options[index] = null;
object.dropdownlistA.selectedIndex = 0;
}
else
alert ('Please select an item from List A that you would like to add to List B.');
}



function transferBtoA(object) {
var index = object.dropdownlistB.selectedIndex;
if (index > -1) {
var newoption = new Option(object.dropdownlistB.options[index].text, object.dropdownlistB.options[index].value, true, true);
object.dropdownlistA.options[object.dropdownlistA.length] = newoption;
if (!document.getElementById) history.go(0);
object.dropdownlistB.options[index] = null;
object.dropdownlistB.selectedIndex = 0;
}
else
alert ('Please select an item from List B that you would like to return to List A.');
}

//-->
</script>

</head>

<body onLoad="buttonState();">

<form name="MyForm">

<table border="0" cellpadding="0" cellspacing="0">

<tr>
<td align="center" valign="top" width="220">List A</td>
<td width="50"></td>
<td align="center" valign="top" width="220">List B</td>
</tr>

<tr>
<td align="center" valign="top">
<select name="dropdownlistA" size="6" style="width:200px;">
<option value="Option 01">Entry 01</option>
<option value="Option 02">Entry 02</option>
<option value="Option 03">Entry 03</option>
<option value="Option 04">Entry 04</option>
<option value="Option 05">Entry 05</option>
<option value="Option 06">Entry 06</option>
<option value="Option 07">Entry 07</option>
<option value="Option 08">Entry 08</option>
<option value="Option 09">Entry 09</option>
<option value="Option 10">Entry 10</option>
</select>
<br><br>
<input name="AtoB" type="button" value="A to B" onClick="if (document.images) transferAtoB(this.form); buttonState();" style="width:165px;">
</td>

<td>&nbsp;&nbsp;&nbsp;&nbsp;</td>

<td align="center" valign="top">
<select name="dropdownlistB" size="6" style="width:200px;">
</select>
<br><br>
<input name="BtoA" type="button" value="B to A" onClick="if (document.images) transferBtoA(this.form); buttonState();" style="width:165px;">
</td>
</tr>
</table>

</form>

</body>
</html>


===========================================

arnyinc
07-17-2003, 06:15 PM
Originally posted by Dominick
]I wish 4.7 would just disappear...


It pretty much has. Something like 1 or maybe 2 percent of users will use NN4.

glenngv
07-18-2003, 03:50 AM
it's better to have the checking in your move functions and display alert msg if the length of option has reach the maximum.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum