I have a admin pagina where I can edit the menu with subitems. The subitems are now listed by the SORT BY method. If a customer adds a new subitem for the navigation dropdown menu, the subitem is added at the end or top of the list. I want to have a script where the customer can directly move the menu item up or down in the list using two different symbols at the end of the row. When clicking on the symbols the row directly changes from place. My question is if someone can give me a example. I searched at google but could't find anything matching this idea, but I know it's possible. Thank you

ive seen similiar when setting up a vbb bulletin board, what order to put the forums etc..

its a column in the db table using numbers (int)
and you have a small text box on side of each record (where you type a number)on the add record page or however your doing it, so you can constantly update the position and order of each and every nav item.

your best doing it on an all items page, that way you can set them all and also see if any numbers conflict.

then when you filter it with a sort-by clause, choose the numbered column youveadded, and it will sort however they enter the numbers.

Regards,
Dave

[DWMX 2004]|[FlashMX 2004 Pro]|[SQL]|[Access2000]|[ASP/VBScript]|[XP-Pro]


Edited by - UltraDav on 09 Nov 2004 00:19:50

I've used a similar thing in a few applications. The best way of doing it I've found is to use a multiple select list with a hidden form field

<pre id=code><font face=courier size=2 id=code>
&lt;form name="form1"&gt;
&lt;select name="tableList" multiple size="20"&gt;
&lt;%
'code here to create options
SQL = "select * from menu order by item_order asc"
' open conneciton string
set conn=server.createobject("ADODB.connection"
conn.open([insert connection string here])
set rs = conn.execute(SQL)
if not rs.eof then
while not rs.eof
response.write "&lt;option value=""" & rs.fields("item_id" & """&gt;" & rs.fields("item_order" & "&lt;/option&gt;
wend
else
response.write "&lt;option&gt;No categories available&lt;/option&gt;"
end if
set rs= nothing
conn.close
set conn = nothing
%&gt;
&lt;/select&gt;
&lt;input type="hidden" name="savedData" value=""&gt;
</font id=code></pre id=code>

Then have a couple of buttons to move the selected option up and down, and a save button:

<pre id=code><font face=courier size=2 id=code>
&lt;input type="button" value="Move Up" onclick="moveUp()"&gt;
&lt;input type="button" value="Move Down" onclick="moveDown()"&gt;
&lt;input type="button" name="save" value="Save List" onclick="saveTable()"&gt;
&lt;/form&gt;
</font id=code></pre id=code>

Add some javascript to handle the move up and move down events, and the save table function:

<pre id=code><font face=courier size=2 id=code>
function moveUp(){
selectedRow = document.form1.tableList.selectedIndex;
if (selectedRow &gt; 0) {
thisid = "opt" + selectedRow
nextid = "opt" + (selectedRow-1)
thiscol = document.getElementById(thisid).style.color
nextcol = document.getElementById(nextid).style.color

thisText = document.form1.tableList[selectedRow].text;
thisVal = document.form1.tableList[selectedRow].value;
nextText = document.form1.tableList[selectedRow-1].text;
nextVal = document.form1.tableList[selectedRow-1].value;
document.form1.tableList[selectedRow].text = nextText;
document.form1.tableList[selectedRow].value = nextVal;
document.form1.tableList[selectedRow-1].text = thisText;
document.form1.tableList[selectedRow-1].value = thisVal;
document.form1.tableList.selectedIndex--;
}
}

function moveDown(){
selectedRow = document.form1.tableList.selectedIndex;
if (selectedRow &lt; document.form1.tableList.length-1) {
thisid = "opt" + selectedRow
nextid = "opt" + (selectedRow+1)
thiscol = document.getElementById(thisid).style.color
nextcol = document.getElementById(nextid).style.color

thisText = document.form1.tableList[selectedRow].text;
thisVal = document.form1.tableList[selectedRow].value;
nextText = document.form1.tableList[selectedRow+1].text;
nextVal = document.form1.tableList[selectedRow+1].value;
document.form1.tableList[selectedRow].text = nextText;
document.form1.tableList[selectedRow].value = nextVal;
document.form1.tableList[selectedRow+1].text = thisText;
document.form1.tableList[selectedRow+1].value = thisVal;
document.form1.tableList.selectedIndex++;
}

}

function saveData(){

document.form1.process.value="save"
savedString = "";
for (a=0;a&lt;document.form1.tableList.length;a++) {
if (a &gt; 0) savedString += "~";
savedString += document.form1.tableList[a].value + "@@"
}
document.form1.savedData.value = savedString;
}


function saveTable(){
saveData();
document.form1.submit();
}
</font id=code></pre id=code>

Then all you have to do on the back end is use the split method on the saved string, and update the database accordingly.



Edited by - mykeblack on 15 Nov 2004 17:02:18