Html 使用数组变量填充多个g:select

我正在尝试创建两个多选择列表，我正在尝试在这两个列表之间执行典型的添加/删除操作。我可以从第二个g:select添加和删除初始值，并保存值数组，但当我尝试向用户显示更新的值时，我似乎无法重新填充第二个g:select

<table class="threecols">
  <tr>
    <td style="width: 10%">
     <g:select multiple="true" id="select1" name="select1" from="${['User','Department','School','Class','User','Id','District']}" disabled="${disabled}"/>
    </td>
    <td style="width: 10%">
        <button type="button" style="margin-left: 12px"><a href="#" id="add">Add &gt;&gt;</a>
        </button>
        <button type="button"><a href="#" id="remove">&lt;&lt; Remove</a>    </button>
   </td>
   <td style="width: 10%">
     <g:select multiple="true" id="select2" name="paramList" from="${report?.paramList}" value="${report?.paramList}" disabled="${disabled}"/>
   </td>
  </tr>
</table>

变量声明为：String[]paramList

---

非常感谢您的帮助。

您需要使用JQuery来完成以下操作：

$(document).ready(function() {

    $('#add').click(function(){
        $('#select2 option:selected').each( function() {
                $('#select1').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");
            $(this).remove();
        });
    });
    $('#remove').click(function(){
        $('#select1 option:selected').each( function() {
            $('#select2').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");
            $(this).remove();
        });
    });

});

---

这里的更多信息：

我很愚蠢，在我应该使用reportInstance？的时候使用了report？.paramList。paramList因为report只是一个类，reportInstance是一个单一的对象。Woops.

我有添加删除部分，它更多的是在页面加载。我如何加载字符串数组作为第二次选择的值，但谢谢！我重读了我的问题，我有点毁了这个问题。