Question

I have been trying this for a good while now but I can’t seem to add more options to the multiselect.

Even when I try to add a hardcoded piece of information it just doesn’t get added. (The headers for Multiselect and JQuery are in a different file).

You can see the link in action here:
http://www.fakegaming.eu/GoT/index.php?act=selectteam&matchid=3

<?php
$matches = new Matches();
$user = new User();
$id = $_GET['matchid'];
$matchinfo = $matches->getmatch($id);
$matchplayers = $matches->getmatchplayers($id);
?>
<script type="text/javascript">
    $(function(){
        $.localise('ui-multiselect', {/*language: 'en',*/ path: 'script/locale/'});
        $(".multiselect").multiselect();

        $("#add").click(function() {
          $('#players').multiselect('addOptions', 'Test=123');
          alert("Handler for .click() called.");
        });
    });
</script>
Kies hier 10 spelers die mee doen aan de match.<br /> <br />

<form action='index.php?act=createteam' method='post'>
    <select id="players" class="multiselect" multiple="multiple" name="players[]">
    <?php
        foreach($matchplayers as $matchplayer){
            $userinfo = $user->getuserbyid($matchplayer['user_id']);
            if($matchplayer['type'] == 0 OR $matchplayer['type'] == 2){
                $name = $userinfo['EU_username'];
                ?>
                <option value="<?= $name ?>"><?= $name ?></option>
                <?php
            }
        }

    ?>
    </select>
    <input name='name' type='text' id='name' />
    <input type='button' id="add" name="add" value="Toevoegen" />
    <input name="submit" value="Maak team" type="submit" />
</form>

I’m probably just doing something horribly wrong but I just want a good multiselect and add some names to it.

Answer 1

You say are using jQuery, but I see very little use of it… Here would be a “jQuery way” of adding an <OPTION> to your multiselect

$('#players').append($('<option></option>').attr('value', '123').text('345'));

To select an attribute :

$('#players option[value="123"]').attr('selected', true);

to deselect an attribute :

$('#players option[value="123"]').removeAttr('selected');

to remove an option

$('#players option[value="123"]').remove();

** Edit **

(I didn’t look at your reference link. I should be the best to anwser, I’m one of the original authors of this widget!)

There is a next version of this widget that Michael Aufreiter and I worked on that implements more functionality that you require. It is a little unstable with some configurations, but should be stable enough with basic (default) setup.

You can find it here and you can access values via the options :

 $('#players').multiselect('addOptions', '123=456'); // value=123, text=456

Sorry, the API documentation was not updated to document this. This widget is actually being supported by other contributors and either of us, original authors, maintain this version.

Hope this helps.