jquery-select2显示默认选择的第一个值

Posted 2021-04-20

我使用下面的代码填充多选：

    <s:select id = "deviceTypes" 
            name = "serviceVO.deviceTypes"
        multiple = "multiple" 
        required = "true"
  onBeforeTopics = "openLoader" 
onCompleteTopics = "closeLoader"
             key = "service.authoring.label.deviceTypes"
         tooltip = "%{getText('service .authoring.label.deviceTypes.info')}"
            list = "deviceTypesList" 
         listKey = "value" 
       listValue = "name"
        cssClass = "search-val form-control" />

并在document.ready上我打电话：

 $("#deviceTypes").attr("multiple","true");
 $("#deviceTypes").select2();

有了它，它默认显示在页面加载时选择的第一个选项值，我不想要。我希望用户应该选择值，一旦用户提交表单，然后在修改页面上，所选值应显示在选择框中，用户可以添加或删除值。

答案

key属性是用三个属性设置相同值的简写：name，value，label。

如您所知，value（如果存在）预设元素的值，而name用于将参数发送回动作，并在value缺失的情况下预设值。

然后使用key结合上述属性之一是误导和错误。 删除key，改为使用label：

    <s:select id = "deviceTypes" 
            name = "serviceVO.deviceTypes"
        multiple = "multiple" 
        required = "true"
  onBeforeTopics = "openLoader" 
onCompleteTopics = "closeLoader"
           label = "service.authoring.label.deviceTypes"
         tooltip = "%{getText('service .authoring.label.deviceTypes.info')}"
            list = "deviceTypesList" 
         listKey = "value" 
       listValue = "name"
        cssClass = "search-val form-control" />

请注意，serviceVO.deviceTypes必须是带有getter的action属性，类型为List（或其他），第一次为null，并包含下次读取的选定值。

另一答案

仍然没有得到你想要的。

但我认为你可以用一些java脚本代码来做到这一点。创建一个s:select或sj:select，其中包含所有数据的选项，但style="display: none"使其不可见。使用空选项创建第二个选择框作为正常的html select，这是用户看到的。因此，您的主选择框将在页面加载时第一次加载，但用户无法看到它。

您可以使用户可以看到某些操作，例如单击复选框。

但是，提交表单不会将所有选择选项传递给服务器，只会将选定的选项发送到服务器。

另一答案

我能够在页面加载时使用以下代码：

$("#deviceTypes").attr("multiple","true");
$("#deviceTypes").select2();
var selectedDevice=[];
var deviceList = '<s:property value="serviceVO.packagedService.deviceType" />';
$.each(deviceList, function(index,value) {
    selectedDevice.push(value); 
    });
 $("#deviceTypes").select2("val", selectedDevice);