Någon som känner till ett javascript där man kan flytta runt värden i en select-ruta. Se bilden.
Värden hämtas från en db och jag skulle vilja flytta runt dem i valfri ordning innan värdena skickas tillbaka.
Flytta runt värden i select (multiple)
7 svar · 847 visningar · startad av FlashX
Har inte hört något om att det är möjligt i html, och det går knappast att göra med javascript. Det skulle vara om man simulerade en sån där lista (förbannat mycket jobb).
Det blir kanske lite omständigt att koda till en sådan variant.
Just nu används inget javascript utan varje steg upp eller ner skickas till servern som skickar tillbaka resultatet. Tanken var att lägga det på klienten istället så man kan flytta runt bäst man vill och skickar tillbaka det först när man är nöjd.
Jag får fundera ut något annat lämpligt alterntiv istället där man har möjlighet att ändra ordningen på samtliga värden.
Detta förstår jag, men som sagt så går det inte. Lycka till med din alternativa lösning!
Här kan ni kanske finna lite matnyttigt: http://www.webforum.nu/showthread.php?s=&forumid=24&threadid=18229&highlight=Moveup
Jag har tittat på några sådana varianter tidigare. Jag antar att det är något liknande denna
Fanns det någon funktion för att flytta ett värde uppåt eller neråt i listan i den tråden? Jag fick uppfattningen av det när jag läste tråden men hittade inget exempel.
Här är en variant där man kan lägga till och ta bort så det borde inte vara (tycker man) så svårt att flytta runt värdena men javascript är inte riktigt min dialekt.
Oj oj oj :)
Jag såg inte alls din Up- respektive Down-knapp i exemplet. Såhär kan du göra:
<html>
<head>
<title>
Sort
</title>
<script type="text/javascript">
function moveDown(id) {
var parent = document.getElementById(id);
var element = parent.options[parent.selectedIndex];
var next = parent.options[parent.selectedIndex + 1];
if (next) parent.insertBefore(next, element);
else return;
}
function moveUp(id) {
var parent = document.getElementById(id);
var element = parent.options[parent.selectedIndex];
if (parent.selectedIndex - 1 >= 0) {
var previous = parent.options[parent.selectedIndex - 1];
parent.insertBefore(element, previous);
} else return;
}
</script>
<style type="text/css">
button {
font-family: Webdings;
}
</style>
</head>
<body>
<p>
<select id="box"
size="5">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<option>Option 4</option>
<option>Option 5</option>
</select>
</p>
<p>
<button onclick='moveUp("box");'>5</button>
<button onclick='moveDown("box");'>6</button>
</p>
</body>
</html>
Många tack Cheguelin, det fungerar alldeles utmärkt för mitt ändamål :)
