HTML选择表单变量默认值

Question

我想为HTML选择表单设置默认值。我已阅读关于为选定表单设置常量默认值的帖子。但是，我希望默认值为变量 shirt.Color，根据衬衫的不同，它可以是Small，Medium或Large。

例如，如果shirt.Color很小，我希望选择表格有Small选择;如果shirt.Color是Medium，我希望选择表单具有Medium选择;如果shirt.Color很大，我希望选择的表单有大的选择。

我知道如何使用数据绑定为文本框设置默认值。我使用以下方法设置默认的衬衫颜色：

<div class="form-group"> 
    <label class="control-label col-sm-2">Shirt Color</label> 
    <input type="text" name="color" data-bind="valueUpdate: 'input', value:shirt.Color" class="form-control" required /> 
</div> 

是否有类似的简单方法可以对选择的表单进行操作？我宁愿不手动编码每个案例的小，中，大。

我曾尝试做

<div class="form-group"> 
    <label class="col-sm-2 control-label col-sm-2">Shirt Size:</label> 
    <select required name="type" data-bind="type: 'input', value: shirt.Size"> 
     <option value="s">Small</option> 
     <option value="m">Medium</option> 
     <option value="l">Large</option> 
    </select> 
</div> 

然而，这总是默认为第一个选项，小。

Answer 1

您可以使用这个kendoDropDownList。

<div data-bind="kendoDropDownList: { data: shirtSizes, dataTextField: 'SizeName', dataValueField: 'SizeId', value: shirt.Size } />

哪里shirtColors是含有ColorName和ColorId字段的阵列。

var shirtSizess = [ { SizeId: 's', SizeName: 'Small' }, { SizeId: 'm', SizeName: 'Medium' }, { SizeId: 'l', SizeName: 'Large' } ];

Answer 2

你的问题有些含糊，所以我假设你想要做的是为你的选择列表设置一个默认值。要做到这一点，只需在包含要默认选择的值的选项标签内添加“selected”。以下是一个示例：

<option value="s">Small</option> <option value="m" selected>Medium</option> <option value="l">Large</option> 您的选择列表的默认值现在为“m”。