I have this script where I can move users from one multiple selectbox to another and it works fine, but…
I want to add a button, beside the “Add” and “Remove” button which pick random of users depending on a given value, lets say that the value is 2, then it would pick 2 users randomly and move them to box 2, I just don’t know how… Please help…
Where does this “given value” come from? Also, your first SELECT is empty, and both your SELECTs have the same ID. This is illegal, as the ID must be unique.
Still, to select random values:
var given = 2, used = {}, randnum, opts = $('#select1 option'), olen = opts.length;
function ran() { // generate a unique random number
randnum = Math.floor(Math.random() * olen);
if (!used['u'+randnum]) return randnum;
else ran();
}
for (var i = 0; i < given; i++) { // get the correct quantity of randoms
used['u'+ran()] = true;
}
opts.filter(function(index) { // remove all options that are not one of the randoms
return !!used['u'+index];
}).appendTo('#select2'); // append random options to other SELECT
assuming select1 contains at least 2 options and select2 is empty.
There might be a better way of doing this with jQuery, but I’m not familiar with it enough to know.
No it doesn’t. If #select2 is empty, then only 2 (random) items from #select1 will get moved there. Is that not what you wanted? If not, you have to be clearer, with examples.
That is exactly what I wanted, but as it is now… It moves all from #select1 to #select2.
The users I have in #select1 is from a db table… Does that change anything?
Here is all my script…
$().ready(function() {
$('#add').click(function() {
return !$('#select1 option:selected').remove().appendTo('#select2');
});
$('#remove').click(function() {
return !$('#select2 option:selected').remove().appendTo('#select1');
});
});
function randomusers(){
var given = 2, used = {}, randnum, opts = $('#select1 option'), olen = opts.length;
function ran() { // generate a unique random number
randnum = Math.floor(Math.random() * olen);
//randnum = 2;
if (!used['u'+randnum]) return randnum;
else ran();
}
for (var i = 0; i < given; i++) { // get the correct quantity of randoms
used['u'+ran()] = true;
}
opts.filter(function(index) { // remove all options that are not one of the randoms
return !!used['u'+index];
});
$('#select2').append(opts); // append random options to other SELECT
}
It doesn’t work because the javascript you’re using is not the same as what I posted. I edited it about 30 seconds after I posted it, so you must have copied it then! Use the JS I posted above, you’ll see it works (I tested it).
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</head>
<body>
<select id="select1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<select id="select2">
</select>
<script>
var given = 2, used = {}, randnum, opts = $('#select1 option'), olen = opts.length;
function ran() { // generate a unique random number
randnum = Math.floor(Math.random() * olen);
return used['u'+randnum] ? ran() : randnum;
}
for (var i = 0; i < given; i++) { // get the correct quantity of randoms
used['u'+ran()] = true;
}
opts.filter(function(index) { // remove all options that are not one of the randoms
return !!used['u'+index];
}).appendTo('#select2');
</script>
</body>
</html>
I have one more question… I have pulled my head to figure out how to add a “createElement” to your script… I need to add hidden input fields to the scriipt to be able to pass it on to a db table… I have been surfing around the net and found that I need to use createElement but dont know where to put it in your script…
I think it should be near the “appendTo(‘#select2’);” but not sure…
First of all, if I have understood what you want, if you give name for both of the selects then they will be submitted themselves when you submitted the form. So I didn’t quite get that which new value you want to submit by creating new hidden field.
And regarding creating new element and storing the value in it, I think you should know yourself which value and after what you want to post. Since there are/maybe more than one options in both of the selects so I am confused which value you want to store in a new element for posting. And regarding creating element/hidden field, you can rather just have one predefined hidden field and store the value in it since hidden field is always invisible in the page/form.
Do you mean all the random picks or one of them? If all, then each in different hidden field or in a single field with comma separated or something else?