将初始下拉值设置为viewmodel [英] Set initial dropdown value to viewmodel

问题描述

我在下拉列表中遇到了一些问题，我需要将初始值传递给viewmodel。只是为了澄清：我正在编辑表单，所以下拉列表将填充一个已经选定的值。

我到目前为止是：

Razor：

 < select data-bind =selectedOptions：selectedLength> 
 //剃刀代码省略
 foreach（var preValue in lengthPreValues）
 {
 if（lengthPreValues.Contains（preValue.value））
 {
 < ; option selected =selectedvalue ='@ preValue'> @ preValue< / option> 
} 
 else 
 {
< option value ='@ preValue'> @ preValue< / option> 
} 
} 
  

我的viewmodel如下所示：

  var editOfferViewModel = {
 //属性省略
 selectedLength：ko.observable（）
} ; 
 
 ko.applyBindings（editOfferViewModel）; 
  

虽然这在选择一个新值时有一定的作用，但在设置时我有点卡住初始值。我有幸得到了来自Ryan Niemeyer的一些很好的帮助，在stackoverflow.com上有复选框并且创建了自定义绑定处理程序，但是我仍然有
的难以理解的原因。

因此，任何帮助和/或暗示都非常感谢！

>

执行此操作的常用方法是将模型值序列化到页面。这可能类似于：

  var viewModel = {
 choices：ko.observableArray（@ Html.Raw（Json .Encode（Options））），
 selectedChoices：ko.observableArray（@ Html.Raw（Json.Encode（SelectedOptions）））
}; 
  

然后，只需在您的选择中使用标准的数据绑定即可：

  data-bind =options：choices，selectedOptions：selectedChoices
  

如果您的 viewModel code>建立在外部文件中，那么你可以在你的视图中设置观察值的值（在你的外部脚本被加载后）


I'm having some issues with a dropdown list where I need to pass the initial value to the viewmodel. Just to clarify: I'm working on an edit-form, so the dropdownlist will be populated with an already-selected value.

What I have so far is:

Razor:

<select data-bind="selectedOptions: selectedLength"> 
// razor code omitted 
foreach(var preValue in lengthPreValues) 
{ 
   if(lengthPreValues.Contains(preValue.value)) 
   { 
      <option selected="selected" value='@preValue'>@preValue</ option> 
   } 
  else 
  { 
     <option value='@preValue'>@preValue</option> 
  } 
} 

And my viewmodel looks like this:

var editOfferViewModel = { 
  // Properties omitted 
  selectedLength: ko.observable("") 
}; 

ko.applyBindings(editOfferViewModel); 

While this definately works when selecting a new value, I'm a bit stuck when it comes to setting the initial value. I was fortunate enough to get some great help from Ryan Niemeyer here on stackoverflow.com with checkboxes and creating custom bindinghandlers, but I'm still having a hard time to figure it out to be honest.

So, any help and/or hint on this is greatly appreciated!

解决方案

A common and easy way to do this is to serialize your model values to the page. This would be something like:

var viewModel = {
  choices: ko.observableArray(@Html.Raw(Json.Encode(Options))),
  selectedChoices: ko.observableArray(@Html.Raw(Json.Encode(SelectedOptions)))
};

Then, just use a standard data-bind on your select like:

data-bind="options: choices, selectedOptions: selectedChoices"

You then don't even need to populate the option elements in Razor.

If your viewModel is built in an external file, then you can just set the value of the observables in your view (after your external script has been loaded)

这篇关于将初始下拉值设置为viewmodel的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！