Question

我有以下HTML和JS，我正在使用MVC。这是方案

当“过滤器”对象参数传入HTML时，我无法从KO “optionsAfterRender”函数中分配日期字段。

HTML（Razor View）：

 var Filter =(Project.Models.Entity) ViewData["Filter"];

 @if (Filter != null)
                {
                    <div id="sdate">
                        <label>From Senior Date</label>
                        <input id="sdateVal"   type="date"  data-bind="value:SeniorDate,optionsAfterRender:function(){setOptionSrDate(@Filter.DateSenior.Value.ToString("yyyy-MM-dd"));}">
                    </div>

                    <div id="jdate">
                        <label>To Junior Date</label>
                        <input id="jdateVal"  type="date"  data-bind="value:JuniorDate,optionsAfterRender:function(){setOptionJrDate(@Filter.DateJunior.Value.ToString("yyyy-MM-dd"));}">
                    </div>
                }

JS（淘汰赛）：

  self.setOptionSrDate = function (x) {//Sr Date
        $("#sdateVal").val(x);//this does not assign the value
        self.SeniorDate(x);//this does not assign the value
    };

Answer 1

看起来好像要使用从HTML元素中获取的值来初始化observable。

理想情况下，您希望能够这样做：

<input type="date" value="(@Filter.DateSenior.Value.ToString("yyyy-MM-dd"))" data-bind="value:SeniorDate">

但是，这不起作用，因为我确定您已尝试过，因为value绑定的默认行为不会使用值更新绑定的observable初始化绑定时的 dom 元素。

但是有一个解决方案，你可以创建一个自定义绑定来完成现有value绑定所做的一切以及你想要的行为，即使用值初始化observable dom 元素。

使用此绑定：

ko.bindingHandlers.value2 = {
  init: function(element, valueAccessor, allBindings) {
    var observable = valueAccessor(),
      value = element.value;
    observable(value);
    ko.bindingHandlers.value.init.apply(this, arguments);
  },
  update: function(element, valueAccessor, allBindings) {
    ko.bindingHandlers.value.update.apply(this, arguments);
  }
};

这将使您能够这样做：

<input type="date" value="(@Filter.DateSenior.Value.ToString("yyyy-MM-dd"))" data-bind="value2:SeniorDate">

请参阅下面的工作代码：

＆＃13;

ko.bindingHandlers.value2 = {
  init: function(element, valueAccessor, allBindings) {
    var observable = valueAccessor(),
      value = element.value;
    observable(value);
    ko.bindingHandlers.value.init.apply(this, arguments);
  },
  update: function(element, valueAccessor, allBindings) {
    ko.bindingHandlers.value.update.apply(this, arguments);
  }
};

var vm = {
  seniorDate: ko.observable()
};

ko.applyBindings(vm);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>

<div>
  <input type="date" value="2015-07-20" data-bind="value2: seniorDate" />
</div>

<div>
  <p data-bind="text: seniorDate"></p>
</div>

＆＃13;

RP Niemeyer已回答了类似的问题here。

Answer 2

问题可能是日期的格式。试试这个。

var now = new Date();

var day = ("0" + now.getDate()).slice(-2);
var month = ("0" + (now.getMonth() + 1)).slice(-2);

var today = now.getFullYear()+"-"+(month)+"-"+(day) ;

$('#datePicker').val(today);

如何在日期类型字段中设置值

2 个答案: