Reorder listbox items in asp.net

  • Thread starter Thread starter Guest
  • Start date Start date
G

Guest

Is it possible to reorder items in a listbox server control by having the
user select an item and then click an up or down button? ... how?
Or is this something that can only be achieved client side?

thanks
 
hi,

of course it's possible and yes, you should do it in client side, otherwise
you would get a lot of roundtrip
find the code below for doing just that


cheers,

--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation

<script>
function GoDown()
{
if ( document.forms[0].SelectOrder.selectedIndex == -1 ) return;
document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = true;

if ( document.forms[0].SelectOrder.selectedIndex<
document.forms[0].SelectOrder.options.length-1)
{
var selIndex = document.forms[0].SelectOrder.selectedIndex;
var text = document.forms[0].SelectOrder.options[ selIndex ].text;
var value = document.forms[0].SelectOrder.options[ selIndex ].value;
document.forms[0].SelectOrder.options[ selIndex ].text =
document.forms[0].SelectOrder.options[ selIndex +1].text;
document.forms[0].SelectOrder.options[selIndex ].value =
document.forms[0].SelectOrder.options[ selIndex +1].value;
document.forms[0].SelectOrder.options[ selIndex +1].text = text;
document.forms[0].SelectOrder.options[ selIndex +1].value = value;

document.forms[0].SelectOrder.selectedIndex++;
}
document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = false;
}

function GoUp()
{
if ( document.forms[0].SelectOrder.selectedIndex == -1 ) return;

document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = true;

if ( document.forms[0].SelectOrder.selectedIndex>0)
{
var selIndex = document.forms[0].SelectOrder.selectedIndex;
var text = document.forms[0].SelectOrder.options[ selIndex ].text;
var value = document.forms[0].SelectOrder.options[ selIndex ].value;
document.forms[0].SelectOrder.options[ selIndex ].text =
document.forms[0].SelectOrder.options[ selIndex -1].text;
document.forms[0].SelectOrder.options[selIndex ].value =
document.forms[0].SelectOrder.options[ selIndex -1].value;
document.forms[0].SelectOrder.options[ selIndex -1].text = text;
document.forms[0].SelectOrder.options[ selIndex -1].value = value;

document.forms[0].SelectOrder.selectedIndex--;
}
document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = false;
}

function GenerateIDsSubmit()
{

//see the order of the select and set
var s= new String();
for( var i=0; i< document.forms[0].SelectOrder.options.length; i++)
s=s + "," + document.forms[0].SelectOrder.options.value;
document.forms[0].userIDs.value = s.slice(1, s.length);
document.all["GetStatsBTN"].click();

}

</script>

<input type="button" value="Send" onclick="GenerateIDsSubmit();">

<input type="button" id="UpButton" name="UpButton" value="Up"
onclick="GoUp();"><br>
<input type="button" id="DownButton" name="DownButton" value="Down"
onclick="GoDown();">
<select id="SelectOrder" size=10 name="SelectOrder"></select>
 
thank you

Ignacio Machin ( .NET/ C# MVP ) said:
hi,

of course it's possible and yes, you should do it in client side, otherwise
you would get a lot of roundtrip
find the code below for doing just that


cheers,

--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation

<script>
function GoDown()
{
if ( document.forms[0].SelectOrder.selectedIndex == -1 ) return;
document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = true;

if ( document.forms[0].SelectOrder.selectedIndex<
document.forms[0].SelectOrder.options.length-1)
{
var selIndex = document.forms[0].SelectOrder.selectedIndex;
var text = document.forms[0].SelectOrder.options[ selIndex ].text;
var value = document.forms[0].SelectOrder.options[ selIndex ].value;
document.forms[0].SelectOrder.options[ selIndex ].text =
document.forms[0].SelectOrder.options[ selIndex +1].text;
document.forms[0].SelectOrder.options[selIndex ].value =
document.forms[0].SelectOrder.options[ selIndex +1].value;
document.forms[0].SelectOrder.options[ selIndex +1].text = text;
document.forms[0].SelectOrder.options[ selIndex +1].value = value;

document.forms[0].SelectOrder.selectedIndex++;
}
document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = false;
}

function GoUp()
{
if ( document.forms[0].SelectOrder.selectedIndex == -1 ) return;

document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = true;

if ( document.forms[0].SelectOrder.selectedIndex>0)
{
var selIndex = document.forms[0].SelectOrder.selectedIndex;
var text = document.forms[0].SelectOrder.options[ selIndex ].text;
var value = document.forms[0].SelectOrder.options[ selIndex ].value;
document.forms[0].SelectOrder.options[ selIndex ].text =
document.forms[0].SelectOrder.options[ selIndex -1].text;
document.forms[0].SelectOrder.options[selIndex ].value =
document.forms[0].SelectOrder.options[ selIndex -1].value;
document.forms[0].SelectOrder.options[ selIndex -1].text = text;
document.forms[0].SelectOrder.options[ selIndex -1].value = value;

document.forms[0].SelectOrder.selectedIndex--;
}
document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = false;
}

function GenerateIDsSubmit()
{

//see the order of the select and set
var s= new String();
for( var i=0; i< document.forms[0].SelectOrder.options.length; i++)
s=s + "," + document.forms[0].SelectOrder.options.value;
document.forms[0].userIDs.value = s.slice(1, s.length);
document.all["GetStatsBTN"].click();

}

</script>

<input type="button" value="Send" onclick="GenerateIDsSubmit();">

<input type="button" id="UpButton" name="UpButton" value="Up"
onclick="GoUp();"><br>
<input type="button" id="DownButton" name="DownButton" value="Down"
onclick="GoDown();">
<select id="SelectOrder" size=10 name="SelectOrder"></select>



CodeRazor said:
Is it possible to reorder items in a listbox server control by having the
user select an item and then click an up or down button? ... how?
Or is this something that can only be achieved client side?

thanks
 
no problem,

just let me know if it solved your problem

cheers,

--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation



CodeRazor said:
thank you

Ignacio Machin ( .NET/ C# MVP ) said:
hi,

of course it's possible and yes, you should do it in client side,
otherwise
you would get a lot of roundtrip
find the code below for doing just that


cheers,

--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation

<script>
function GoDown()
{
if ( document.forms[0].SelectOrder.selectedIndex == -1 ) return;
document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = true;

if ( document.forms[0].SelectOrder.selectedIndex<
document.forms[0].SelectOrder.options.length-1)
{
var selIndex = document.forms[0].SelectOrder.selectedIndex;
var text = document.forms[0].SelectOrder.options[ selIndex ].text;
var value = document.forms[0].SelectOrder.options[ selIndex ].value;
document.forms[0].SelectOrder.options[ selIndex ].text =
document.forms[0].SelectOrder.options[ selIndex +1].text;
document.forms[0].SelectOrder.options[selIndex ].value =
document.forms[0].SelectOrder.options[ selIndex +1].value;
document.forms[0].SelectOrder.options[ selIndex +1].text = text;
document.forms[0].SelectOrder.options[ selIndex +1].value = value;

document.forms[0].SelectOrder.selectedIndex++;
}
document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = false;
}

function GoUp()
{
if ( document.forms[0].SelectOrder.selectedIndex == -1 ) return;

document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = true;

if ( document.forms[0].SelectOrder.selectedIndex>0)
{
var selIndex = document.forms[0].SelectOrder.selectedIndex;
var text = document.forms[0].SelectOrder.options[ selIndex ].text;
var value = document.forms[0].SelectOrder.options[ selIndex ].value;
document.forms[0].SelectOrder.options[ selIndex ].text =
document.forms[0].SelectOrder.options[ selIndex -1].text;
document.forms[0].SelectOrder.options[selIndex ].value =
document.forms[0].SelectOrder.options[ selIndex -1].value;
document.forms[0].SelectOrder.options[ selIndex -1].text = text;
document.forms[0].SelectOrder.options[ selIndex -1].value = value;

document.forms[0].SelectOrder.selectedIndex--;
}
document.forms[0].UpButton.disabled =
document.forms[0].DownButton.disabled = false;
}

function GenerateIDsSubmit()
{

//see the order of the select and set
var s= new String();
for( var i=0; i< document.forms[0].SelectOrder.options.length; i++)
s=s + "," + document.forms[0].SelectOrder.options.value;
document.forms[0].userIDs.value = s.slice(1, s.length);
document.all["GetStatsBTN"].click();

}

</script>

<input type="button" value="Send" onclick="GenerateIDsSubmit();">

<input type="button" id="UpButton" name="UpButton" value="Up"
onclick="GoUp();"><br>
<input type="button" id="DownButton" name="DownButton" value="Down"
onclick="GoDown();">
<select id="SelectOrder" size=10 name="SelectOrder"></select>



CodeRazor said:
Is it possible to reorder items in a listbox server control by having
the
user select an item and then click an up or down button? ... how?
Or is this something that can only be achieved client side?

thanks
 
Back
Top