Прототип: как переместить выбранные параметры из одного выбора в другой? - PullRequest
Новая
       20

Прототип: как переместить выбранные параметры из одного выбора в другой?

1 голос
/ 07 декабря 2010

Используя прототип 1.6, как я могу удалить все выбранные опции из одного выбора и добавить их к другому?Думаю, я должен добавить, что когда они появляются в цели, они не должны быть выбраны ...

1 Ответ

1 голос
/ 07 декабря 2010

Я нашел ответ, который включал просто использование javascript "plain-jane", чтобы получить выбранные параметры и отменить их выбор Это использует прототип 1.6 и отлично работает. 

<head>

    <script type="text/javascript" src="prototype.js"></script>

</head>

<body>

    <h1>Hello World</h2>

    <div style="border:solid 1px black">

        <select id="leftSelect" multiple="multiple" size="3">
            <option value="1">One</option>
            <option value="2">Two</option>
            <option value="3">Three</option>
        </select>

        <span class="test">
            <button id="moveRightBtn">&gt;&gt;</button><br/>
            <button id="moveLeftBtn">&lt;&lt;</button>
        </span>

        <select id="rightSelect" multiple="multiple" size="3">
            <option value="1">One</option>
            <option value="2">Two</option>
            <option value="3">Three</option>
        </select>

    </div>

    <script type="text/javascript">

        document.observe("dom:loaded", function()
        {
            Event.observe("moveRightBtn", "click", function()
            {
                move($("leftSelect"), $("rightSelect"));
            });

            Event.observe("moveLeftBtn", "click",  function()
            {
                move($("rightSelect"), $("leftSelect"));
            });
        });

        function move(sourceSelect, targetSelect)
        {
        var options = sourceSelect.select("option");

        options.each(function(item)
        {
           if(item.selected)
           {
              item.selected = false;
              targetSelect.appendChild(item.remove());
           }
        });
        }

    </script>

</body>

...