添加Mustache后选择无法识别的选项

Question

我在页面中有一个选择列表，最初如下：

<select id="select-company-type" name="company_type">
    <option value="">Company Type</option>
</select>

当另一个选择被更改时，通过Mustache模板重新填充选项

<script id="companyTypeOptionsTpl" type="text/template">
    <option value="">Company Type</option>
    {{#companies}}
        <option value="{{title}}">{{title}}</option>
    {{/companies}}
</script>

这样可以正常工作，新选项会出现在下拉列表中。

然而，如果我尝试以编程方式选择其中一个选项，例如：

$('#select-company-type').val(selectedOption);

其中selectedOption包含一个与其中一个选项匹配的字符串 - 它不起作用。

此外，即使我手动选择了一个选项，在提交表单时也不会通过GET或POST传递它。

好像新选项虽然可见但未被识别。

我在这里错过了一招吗？

由于