2015-06-15 117 views
2

我想爲HTML選擇表單設置默認值。我已閱讀關於爲選定表單設置常量默認值的帖子。但是,我希望默認值爲變量 shirt.Color,根據襯衫的不同,它可以是Small,Medium或Large。HTML選擇表單變量默認值

例如,如果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> 

然而,這總是默認爲第一個選項,小。

回答

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' } ];

0

你的問題有些含糊,所以我假設你想要做的是爲你的選擇列表設置一個默認值。要做到這一點,只需在包含要默認選擇的值的選項標籤內添加「selected」。以下是一個示例:

<option value="s">Small</option> <option value="m" selected>Medium</option> <option value="l">Large</option> 您的選擇列表的默認值現在爲「m」。

+0

第一句,我說我想要的默認值是shirt.Color,它的變化取決於襯衫。我不希望窗體始終默認爲「中」。 –