javascript 如何向 Jquery UI Multiselect 添加新选项

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10653445/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 10:34:13  来源:igfitidea点击:

How can I add new options to Jquery UI Multiselect

javascriptjqueryhtml

提问by Jeffro

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).

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

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

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

我可能只是在做一些非常错误的事情,但我只是想要一个好的多选并为其添加一些名称。

回答by Yanick Rochon

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

你说正在使用 jQuery,但我很少看到它的使用......这将是一种“jQuery 方式”<OPTION>向你的多选添加

$('#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.

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

You can find it hereand 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.

抱歉,API 文档没有更新来记录这一点。这个小部件实际上得到了其他贡献者的支持,我们中的任何一个,原作者,都维护这个版本。

Hope this helps.

希望这可以帮助。

回答by Yall

If you want to submit players to your index.php?act=createteamaction, make sure you've selected players before sending request.

如果您想将玩家提交给您的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>

and

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