<div class="container" id="pickListContainer"
th:style="${'display:'+ val1}">
<div class="b" id="item">
<div class="panel-heading">
<input type="text" class="form-control" id="admin_group_name"
th:field="${add_user.adminGroup.groupName}" readOnly="readOnly">
</div>
<div class="panel-body">
<div id="pickList">
<div class="row">
<div class="col-sm-5">
<select class="form-control pickListSelect pickListResult"
style="width: 100%" multiple="multiple"
id="existingAdminGroupMembers"
th:field="${add_user.adminGroup.currentMembers}">
<option
th:each="currentUser : ${add_user.adminGroup.currentMembers}"
th:value="${currentUser}" th:text="${currentUser}"></option>
</select>
</div>
<div class="col-sm-2 pickListButtons">
<button class="pAdd btn btn-primary btn-sm">></button>
<button class="pAddAll btn btn-primary btn-sm">>></button>
<button class="pRemove btn btn-primary btn-sm"><</button>
<button class="pRemoveAll btn btn-primary btn-sm"><<</button>
</div>
<div class="col-sm-5">
<select class="form-control pickListSelect pickAdminData"
style="width: 100%" multiple="multiple"
id="availableMembersForAdminGrp"
th:field="${add_user.adminGroup.availableMembers}">
<option
th:each="adminUser : ${add_user.adminGroup.availableMembers}"
th:value="${adminUser.userName}"
th:text="${adminUser.userName}"></option>
</select>
</div>
</div>
</div>
</div>
</div>
<div class="b" id="item">
<div class="panel-heading">
<input type="text" class="form-control" id="user_group_name"
th:field="${add_user.userGroup.groupName}" readOnly="readOnly">
</div>
<div class="panel-body">
<div id="pickList2">
<div class="row">
<div class="col-sm-5">
<select class="form-control pickListSelect pickListUserResult"
style="width: 100%" multiple="multiple"
id="existingUserGroupMembers"
th:field="${add_user.userGroup.currentMembers}">
<option
th:each="currentUser : ${add_user.userGroup.currentMembers}"
th:value="${currentUser}" th:text="${currentUser}"></option>
</select>
</div>
<div class="col-sm-2 pickListButtons">
<button class="pAddUser btn btn-primary btn-sm">></button>
<button class="pAddAllUser btn btn-primary btn-sm">>></button>
<button class="pRemoveUser btn btn-primary btn-sm"><</button>
<button class="pRemoveAllUser btn btn-primary btn-sm"><<</button>
</div>
<select class="form-control pickListSelect pickUserData"
style="width: 100%" multiple="multiple"
id="availableMembersForUserGrp"
th:field="${add_user.userGroup.availableMembers}">
<option
th:each="user : ${add_user.userGroup.availableMembers}"
th:value="${user.userName}" th:text="${user.userName}"></option>
</select>
</div>
</div>
</div>
</div>
</div>
picklist.js
(function($) {
}(jQuery));
$(document).on('click', ".pRemove", function() {
var p = $(document).find(".pickAdminData option:selected");
p.clone().appendTo($(document).find(".pickListResult"));
p.remove();
return false;
});
$(document).on('click', ".pRemoveAll", function() {
var p = $(document).find(".pickAdminData");
p.clone().appendTo($(document).find(".pickListResult"));
p.remove();
return false;
});
$(document).on('click', ".pAdd", function() {
var p = $(document).find(".pickListResult option:selected");
p.clone().appendTo($(document).find(".pickAdminData"));
p.remove();
return false;
});
$(document).on('click', ".pAddAll", function() {
var p = $(document).find(".pickListResult option");
p.clone().appendTo($(document).find(".pickAdminData"));
p.remove();
return false;
});
$(document).on('click', ".pRemoveUser", function() {
var p = $(document).find(".pickUserData option:selected");
p.clone().appendTo($(document).find(".pickListUserResult"));
p.remove();
return false;
});
$(document).on('click', ".pRemoveAllUser", function() {
var p = $(document).find(".pickUserData");
p.clone().appendTo($(document).find(".pickListUserResult"));
p.remove();
return false;
});
$(document).on('click', ".pAddUser", function() {
var p = $(document).find(".pickListUserResult option:selected");
p.clone().appendTo($(document).find(".pickUserData"));
p.remove();
return false;
});
$(document).on('click', ".pAddAllUser", function() {
var p = $(document).find(".pickListUserResult");
p.clone().appendTo($(document).find(".pickUserData"));
p.remove();
return false;
});
addUser.js
$(document).ready(
function() {
var clusterName;
var projectName;
$("#add_clusture_name").on("change", function() {
clusterName = this.value;
$.ajax({
url : '/user/listProjects',
data : $(this).serialize(),
type : 'post',
dataType : 'html',
success : function(html) {
$('#project').replaceWith($(html));
}
});
});
$(document).on("change", "#project", function() {
projectName = this.value;
var projectData = {
'clusterName' : clusterName,
'projectName' : projectName
}
$.ajax({
url : '/user/listGroups',
data : projectData,
type : 'post',
dataType : 'html',
success : function(htmlObject) {
$('#pickListContainer').replaceWith($(htmlObject));
}
});
});
当我从选择列表中选择多个选项时,选择currentMembers和availableMembers并单击Submit按钮, 当我尝试在控制器类中获取它们时,这些多个选择模型对象add_user.adminGroup.currentMembers,add_user.adminGroup.availableMembers,add_user.adminGroup.availableMembers和add_user.userGroup.availableMembers都为空。您能否解释一下如何在控制器类中检索这些模型对象的值。在执行添加,删除,addall,全部删除之类的选择列表选项时,这些选择多个选项的值会丢失。