25 svar · 668 visningar · startad av learn
Jag skulle vilja att detta skript fungerar så att när man endast behöver klicka på den text man vill flytta och slippa klicka på länken. Det funkar att ju i FF att göra så här:
<option value="1" onClick="selectMoveSelected(document.myForm.selectlist,document.myForm.selectlistb); return false;">Val 1</option>
Men detta funkar ju inte i IE... Någon som har ngt tips??
Tack på förhand! :)
Jag hade förväntat mig att <select onclick="selectMoveSelected(...)" skulle fungera utan problem, men efter att ha testat visade sig så inte vara fallet. Istället:
<select onclick="setTimeout(function(){selectMoveSelected(document.myForm.selectlist,document.myForm.selectlistb)},1)"
Hur gick det med trådarna längre ned i forumet?
Peter S skrev:
Jag hade förväntat mig att <select onclick="selectMoveSelected(...)" skulle fungera utan problem, men efter att ha testat visade sig så inte vara fallet. Istället:
<select onclick="setTimeout(function(){selectMoveSelected(document.myForm.selectlist,document.myForm.selectlistb)},1)"
Funkar fortfarande inte i IE för mig... Dock i FF.
Peter S skrev:
Hur gick det med trådarna längre ned i forumet?
Vilka trådar syftar du på?
Jag bifogar exemplet som för mig fungerar :)
Dessa trådar:
http://www.webforum.nu/showthread.php?t=137692
http://www.webforum.nu/showthread.php?t=137694
Peter S skrev:
Jag bifogar exemplet som för mig fungerar :)
Funkar perfekt! :bire
Peter S skrev:
Dessa trådar:
http://www.webforum.nu/showthread.php?t=137692
http://www.webforum.nu/showthread.php?t=137694
Hade glömt bort dessa trådar, av ngn anledningen har dess bevakningar inte påminnt mig... Iaf, tack! :bire
Och en extra :birp
En liten tilläggsfråga bara, är det möjligt att få dem att lägga sig i ordning också??
<form name="myForm">
<input type="checkbox" name="check">
<a href="#" onClick="checkboxToggle(document.myForm.check); return false;" style="text-decoration:none; color:black;">Klicka här för att växla</a><br>
<br>
<input type="radio" name="radio" value="1"> <input type="radio" name="radio" value="2"> <input type="radio" name="radio" value="3">
<a href="#" onClick="radioCycle(document.myForm.radio); return false;" style="text-decoration:none; color:black;">Klicka här för att växla</a><br>
<br>
<select onclick="setTimeout(function(){selectMoveSelected(document.myForm.selectlist,document.myForm.selectlistb)},1)" name="selectlist" size="4" multiple style="width:100px;">
<option value="1">Val 1</option>
<option value="2">Val 2</option>
<option value="3">Val 3</option>
<option value="4">Val 4</option>
</select>
<select name="selectlistb" size="4" multiple style="width:100px;">
</select><br>
<a href="#" onClick="selectCycle(document.myForm.selectlist); return false;" style="text-decoration:none; color:black;">Klicka här för att växla</a><br>
<a href="#" onClick="selectMarkall(document.myForm.selectlist); return false;" style="text-decoration:none; color:black;">Klicka här för att markera alla</a><br>
<a href="#" onClick="selectClearall(document.myForm.selectlist); return false;" style="text-decoration:none; color:black;">Klicka här för att avmarkera alla</a><br>
<a href="#" onClick="selectInvertall(document.myForm.selectlist); return false;" style="text-decoration:none; color:black;">Klicka här för att invertera alla</a><br>
<a href="#" onClick="selectMoveSelected(document.myForm.selectlist,document.myForm.selectlistb); return false;" style="text-decoration:none; color:black;">Klicka här för att flytta markerade från vänster till höger</a><br>
<br>
</form>
<script type="text/javascript">
/* Detta script finns att hämta på [url]http://www.jojoxx.net[/url] och
får användas fritt så länge som dessa rader står kvar. */
function checkboxToggle(obj){
obj.checked = (obj.checked) ? false:true;
}
function radioCycle(obj){
nn=-1;
for(n=0;n<obj.length;n++){if(obj[n].checked){nn=n}}
nn++;
if(nn==obj.length)nn=0;
obj[nn].checked=true;
}
function selectCycle(obj){
n=obj.selectedIndex; n++;
if(n==obj.length)n=0;
obj.selectedIndex=n;
}
function selectMarkall(obj){
for(var n=0;n<obj.length;n++){ obj[n].selected=true; }
}
function selectClearall(obj){
for(var n=0;n<obj.length;n++){ obj[n].selected=false; }
}
function selectInvertall(obj){
for(var n=0;n<obj.length;n++){ obj[n].selected=(!obj[n].selected); }
}
function selectMoveSelected(from,to){
var curr = 0;
for(var n=0;n<from.length;n++){
if(from[n].selected){ curr=new Option(from[n].text,from[n].value); }
}
for(var n=from.length-1;n>=0;n--){
if(from[n].selected){ from[n]=null; }
}
var opts = to.options,
i = 0,
elm = 0,
arr = [];
while (elm = opts[i]){ arr[i++] = elm }
arr.push(curr);
arr.sort(function cmp(a,b){
if (b.text < a.text){ return 1 }
if (b.text > a.text){ return -1 }
return 0;
});
i = elm = 0;
while (elm = arr[i]){
to.options[i++] = elm;
}
}
</script>
Hmm, nä det där funkade inte riktigt... Rätt va det är så hoppar det fram en massa extra text...Svårt att förklara, kanske du själv kan testa att klicka lite fram och tillbaka.
Jag upplever inget hoppande. Använder du ovanstående kod precis som den är? Isåfall, hur skall jag klicka för att se det du beskriver?
:)
Ah, förlåt..glömde säga att jag gjort en liten justering på egen hand... :) Jag vill att man ska kunna klicka tillbaka texten till ursprungsläget...
Alltså, lägg till...
onclick="setTimeout(function(){selectMoveSelected(document.myForm.selectlist,document.myForm.selectlistb)},1)" name="selectlist" size="4" multiple style="width:100px;"
...i den andra selecten också. När man sedan klickar fram och tillbaka så blir det strul...
Du får byta plats på argumenten:
onclick="setTimeout(function(){selectMoveSelected(document.myForm.selectlistb,document.myForm.selectlist)},1)"
:)
Jojo :) det har jag gjort. Ändå beter den sig olovligt...
Men i ditt förra inlägg är de inte bytta ;)
Komplett kod som fungerar för mig:
<form name="myForm">
<select size="7" onclick="setTimeout(function(){selectMoveSelected(document.myForm.selectlist,document.myForm.selectlistb)},1)" name="selectlist" size="4" multiple style="width:100px;">
<option value="1">Val 1</option>
<option value="2">Val 2</option>
<option value="3">Val 3</option>
<option value="4">Val 4</option>
<option value="5">Val 5</option>
<option value="6">Val 6</option>
<option value="7">Val 7</option>
</select>
<select size="7" onclick="setTimeout(function(){selectMoveSelected(document.myForm.selectlistb,document.myForm.selectlist)},1)" name="selectlistb" size="4" multiple style="width:100px;">
</select>
</form>
<script>
function selectMoveSelected(from,to){
var curr = 0;
for(var n=0;n<from.length;n++){
if(from[n].selected){ curr=new Option(from[n].text,from[n].value); }
}
for(var n=from.length-1;n>=0;n--){
if(from[n].selected){ from[n]=null; }
}
var opts = to.options,
i = 0,
elm = 0,
arr = [];
while (elm = opts[i]){ arr[i++] = elm }
arr.push(curr);
arr.sort(function cmp(a,b){
if (b.text < a.text){ return 1 }
if (b.text > a.text){ return -1 }
return 0;
});
i = elm = 0;
while (elm = arr[i]){
to.options[i++] = elm;
}
}
</script>
Är du säker? Testa att klicka över några texter från vänster till höger och sedan tillbaka ngr gånger..
Bifogar bild på hur det ser ut för mig efter en stunds klickande.
Ok, då förklarar jag exakt hur jag klickar (notera att detta bara är ett exempel)
Mystiskt. Hur det ser ut för mig kan ses i den bifogade filen.
Du använder alltså den senast postade koden (utan några ändringar)?
Vänta nu, använder du IE? Själv kör jag med FF, upptäckte nämligen precis att det fungerar som det ska i IE... (Jag vill att detta ska funka oavsett läsare...)
Nu så:
function selectMoveSelected(from,to){
var tArr = [from.options[from.selectedIndex]],
fArr = [];
for (var i = 0; i < from.length; ++i){
if (!from.options[i].selected){ fArr.push(from.options[i]); }
}
from.options.length = 0;
updateSelect(from,fArr);
for (var i = 0; i < to.length; ++i){
tArr.push(to.options[i]);
}
to.options.length = 0;
tArr.sort(function(a,b){
if (b.text < a.text){ return 1 }
if (b.text > a.text){ return -1 }
return 0;
});
updateSelect(to,tArr);
}
function updateSelect(sel,arr){
for (var i = 0; i < arr.length; ++i){
sel.options[sel.options.length] = arr[i];
}
}