M Macce Medlem sedan apr. 2001 425 inlägg Frågan 16 jan. 2003 17:09 #1 Har letat som en tok efter ett script som
Den ena med ett gäng alternativ, och när man klickar på dessa
Om jag sen ångrar ett val så ska jag kunna klicka i andra rutan så det hoppar tillbaks.
Annars kan man tänka sig att man har två knappar mellan boxarna med vänster- resp högerpil för attr flytta värdena.
Nån som vet var man kan hitta det...
P Peter S Medlem sedan dec. 2002 5 483 inlägg Är det någonting sådant här du söker?
<head>
<script type="text/javascript">
<!--
function moveContent(s){
var box1 = document.getElementById("box1");
var box2 = document.getElementById("box2");
var currentBox = (s=="box1") ? box1 : box2;
var theOtherBox = (s=="box1") ? box2 : box1;
var currentOption = null;
for(var i=0; i<currentBox.options.length; i++){
if(currentBox.options[i].selected){
currentOption = currentBox.options[i];
break;
}
}
if(currentOption){
currentBox.removeChild(currentOption);
theOtherBox.appendChild(currentOption);
} else
alert("Slut på alternativ!");
};
//-->
</script>
</head>
<body>
<form onsubmit="return false">
<table width="50%" align="center" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<select id="box1">
<option value="1">Testvärde #1</option>
<option value="2">Testvärde #2</option>
<option value="3">Testvärde #3</option>
<option value="4">Testvärde #4</option>
</select>
</td>
<td align="center">
<button onclick="moveContent('box1')">--></button><br>
<button onclick="moveContent('box2')"><--</button>
</td>
<td align="right">
<select id="box2">
<option value="5">Testvärde #5</option>
<option value="6">Testvärde #6</option>
<option value="7">Testvärde #7</option>
<option value="8">Testvärde #8</option>
</select>
</td>
</tr>
</table>
</form>
</body>
:)
M Macce Medlem sedan apr. 2001 425 inlägg Nån som kan få till det så att man även kan dubbelklicka i boxarna så valet hoppar över till andra boxen ?
mvh
J jupiters Medlem sedan sep. 2002 104 inlägg skulle varit enkelt lägga in ondblclick="moveContent('box1')"
S skyman Medlem sedan juli 2001 2 450 inlägg Jag sitter med samma rpoblem här.
Eller om man kunde göra så att när man flyttar tillbaka den som man flyttade över så ska den komma på den plats som den låg på innan, dvs i bokstavsordning.
Mvh
P Peter S Medlem sedan dec. 2002 5 483 inlägg Beroende på vad du kommer att ha för text i dina "options", d.v.s. <option>text </option>, kan jag ge dig en lösning. Innehåller texten siffror blir det till att skriva en komplicerad sorteringsalgoritm eftersom sort() -funktionen som finns för Array inte kommer att sortera sådana texter optimalt, och en sådan algoritm har ( iallafall ) inte jag tid att skriva.
:)
S skyman Medlem sedan juli 2001 2 450 inlägg Det ska bara bokstavs-sorteras :)
P Peter S Medlem sedan dec. 2002 5 483 inlägg Ok, jag är lite upptagen just nu så jag återkommer ikväll ( om inte någon annan hinner före ;) ).
:)
P Peter S Medlem sedan dec. 2002 5 483 inlägg Är det någonting sådant här du är ute efter?
<script type="text/javascript">
<!--
function move(s){
if(document.forms["f"].elements[s].options.selectedIndex==-1)
return;
var
c=document.forms["f"].elements[s],
i=c.length;
while(i-->0){
if(c[i].selected){
add(c[i],(s=="s1"?"s2":"s1"));
break;
}
}
};
function add(o,f){
if(exists(o,f))
return;
var
e=document.forms["f"].elements[f],
i=e.length,
j=i+1,
k=0,
t=[o];
while(i-->0)
t.push(e[i]);
t.sort(function(a,b){
if(a.text<b.text)
return -1;
if(a.text>b.text)
return 1;
return 0;
});
e.options.length=0;
while(j-->0)
e.options[k]=new Option(t[k].text,t[k++].value);
};
function exists(e,s){
var
f=document.forms["f"].elements[s],
i=f.length;
while(i-->0){
if(e.text==f[i].text)
return true;
}
return false;
};
//-->
</script>
...
<div>
<form name="f" onsubmit="return false">
<div style="float:left">
<select size="8" name="s1">
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
<option>E</option>
<option>F</option>
</select>
</div>
<div style="float:left;margin:35px 10px 0 10px">
<button onclick="move('s1')">--></button>
<br>
<button onclick="move('s2')"><--</button>
</div>
<div>
<select size="8" name="s2">
<option>G</option>
<option>H</option>
<option>I</option>
<option>J</option>
<option>K</option>
<option>L</option>
</select>
</div>
</form>
</div>
:)
S skyman Medlem sedan juli 2001 2 450 inlägg Det fungerade bra.
<button onclick="move('s2[]')"><--</button>
Jag har dessutom 'multiple', hur fixar man så att den kan flytta över fler samtidigt?
Tak för hjälpen! :)
S skyman Medlem sedan juli 2001 2 450 inlägg Jag lyckas flytta över fler samtidigt men jag kan inte flytta tillbaka de val som jag gjort.
<select name="s2"></select>
Det måste vara det som sabbar det, för jag får att return false i exists...
P Peter S Medlem sedan dec. 2002 5 483 inlägg Eftersom du inte vill att alternativ skall försvinna vid flyttning, så har jag lagt till en "delete"-knapp för att åstadkomma den delen. Sidan .
:)
S skyman Medlem sedan juli 2001 2 450 inlägg Tack, det funkade perfekt! :)
S skyman Medlem sedan juli 2001 2 450 inlägg Nästan...
Om man flyttar över bara några få samtidigt så är det inga problem...
P Peter S Medlem sedan dec. 2002 5 483 inlägg Det är den "feature" som du bad om ;) För varje post som flyttas över sorteras den även i rätt ordning, därav "jojjon" ( den ena posten kanske skall sorteras sist medan en annan kanske skall ligga i mitten, t.ex. ). Tid tar det p.g.a. det stora antalet poster.
:)
S skyman Medlem sedan juli 2001 2 450 inlägg Ok, det var ju inte bra alls... hmm
P Peter S Medlem sedan dec. 2002 5 483 inlägg Jag tycker det är snyggt ;)
Om du skall ha tusentals poster kanske besökaren(?) tror att webbsidan har hängt sig om ingenting händer ( om du inte sorterar d.v.s. ).
:)
S skyman Medlem sedan juli 2001 2 450 inlägg Men eftersom den hänger sig för en stund redan vid 200 poster så är nog inte så bra.
