Select 一个由控制器加载值的选项

Question

我有一个带有一些 bootstrap 属性的标签，当我按编辑 link 时，我想 select 一个特定的选项，但现在它不起作用，其他字段有效，但 selects 总是获得默认选项。

Select

<div class="form-group">
    <select id="categoryField" form="formPerson" class="form-control select2me" placeholder="Categor&iacute;a" th:field="*{category}">                              
        <option value="-1">Categor&iacute;a</option>
        <option th:each="cat : ${categorias}" th:value="${cat.id}" th:text="${cat.name}"></option>                                                              
    </select>
</div>

脚本

function editJury(year, category, juryType, accepted, acceptDate, notes, index){
    $('#categoryField option[value="'+category+'"]');
    $('#yearField').val(year);
    $('#juryTypeField').val(juryType);
    $('#dateField').val(acceptDate);
    if(accepted==1){
        $('#radio6').val(accepted);
    }
    if(accepted==0){
        $('#radio7').val(accepted);
    }
    if(accepted==null){
        $('#radio8').val(accepted);
    }
    $('#notesField').val(notes);
    $('#indexField').val(index);

}

我尝试了 this 但对我不起作用，我认为这是因为当我检查最终 html bootstrap 时，将 select 标签转换为 div...

编辑：我完全改变了如何编辑这个，现在我想最好不要使用那么多 JQuery，所以现在我有 2 个问题，首先，我可以正确获取 selected 值（始终保持默认值 -1）并且页面加载时模态对话框不会打开。

现在，当你点击这个

<a class="edit" href="#modal-jury-form" th:href="@{/person/edit_jury/__${status.index}__}" data-toggle="modal">Editar </a>

启动控制器方法：

@RequestMapping(value = "person/edit_jury/{index}", method = RequestMethod.GET)
public String editJury(@PathVariable String index, @ModelAttribute("person") PersonForm personForm,
            RedirectAttributes ra, Model model) {

    Jury jury = personForm.getJuries().get(Integer.parseInt(index));

    personForm.setJuryAux(new JuryForm(jury));

    model.addAttribute("person", personForm);

    return "person/new";
}

然后 return 到页面，但模式不会自动加载...但是如果您单击“新建”按钮，模式会加载我传递的数据，但加载默认选项的标签除外。

Answer 1

您可以根据您想要的选项的值设置 select 列表的值 selected。

$(function() {
  $("#colours").val("blue");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>
    <select id="colours">                        
        <option value="black">Black</option>
        <option value="white">White</option>
        <option value="green">Green</option>
        <option value="blue">Blue</option>
    </select>
</div>

Answer 2

最终解决方案是这样的：

$("#idComboField").select2('data',  id : '-1',  text : 'Cargo');

Select 一个由控制器加载值的选项

Select an option with value loaded by controller

twitter-bootstrap

spring-mvc

jquery-select2

thymeleaf