如何向Jquery UI Multiselect添加新选项

时间:2012-05-18 13:21:22

标签: javascript jquery html

我现在已经尝试了很长一段时间,但我似乎无法在多选中添加更多选项。

即使我尝试添加硬编码的信息,它也不会被添加。 (Multiselect和JQuery的标题位于不同的文件中)。

您可以在此处查看此处的链接: 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>

我可能只是做了一些可怕的错误,但我只是想要一个好的多选并添加一些名字。

2 个答案:

答案 0 :(得分:4)

你说是使用jQuery,但我看到很少使用它...这将是一个“jQuery方式”,为你的multiselect添加<OPTION>

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

选择属性:

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

取消选择属性:

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

删除选项

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

** 修改 **

(我没有看你的参考链接。我应该是最好的,我是这个小部件的原作者之一!)

Michael Aufreiter与我合作的这个小部件的下一个版本实现了您需要的更多功能。对于某些配置,它有点不稳定,但在基本(默认)设置下应该足够稳定。

您可以找到它here,您可以通过以下选项访问值:

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

抱歉,API文档未更新以记录此内容。这个小部件实际上得到了其他贡献者的支持,我们任何一个原始作者都维护着这个版本。

希望这有帮助。

答案 1 :(得分:0)

如果您想提交玩家index.php?act=createteam行动,请确保在发送请求之前选择了玩家。

<script>
    function selectPlayers() {
        var opts = document.getElementById("players").options;
        for (var i = 0; i < opts.length; i++) {
            opts[i].selected = "selected";
        }
        return true;
    }
</script>

<form action='index.php?act=createteam' method='post' onsubmit='selectPlayers()'>