2015-02-14 1 views
1

Это, как я использую Date Picker на мой взгляд:не MinDate быть установлен в выбора даты

<input type="text" class="form-control datepicker" name="ChartStartDate1" id="dailySummaryDt" data-bind="datePicker: targetDate, minDate: viewModel.datePickerMinDate()" /> 
<span id="temp" data-bind="text:viewModel.datePickerMinDate()"></span> 

Последняя строка с пролетом работает отлично. Я создал этот диапазон, чтобы проверить, имеет ли моя модель правильное значение или нет. Но выбор даты не поднимает эту ценность, и я не уверен, почему.

minDate для выбора даты не установлен; другими словами, я не могу установить минимальную дату для выбора даты. Обратите внимание, что правильное выполнение:

minDate: new Date() or 
minDate:new Date('01/10/2015') 

Это не работает. Если я пытаюсь отлаживать привязки обработчика значение для даты либо не определено или недействительным во всех этих случаях:

minDate: new Date(viewModel.datePickerMinDate()) OR 
minDate: viewModel.datePickerMinDate() OR 
minDate: viewModel.datePickerMinDate 

Вот код для моего связывания обработчика

ko.bindingHandlers.datePicker = { 
    init: function (element, valueAccessor, allBindings) { 
     var minDate = moment(allBindings.get('minDate') || ''), 
      maxDate = moment(allBindings.get('maxDate') || ''), 
      options = { 
       minDate: minDate.isValid() ? minDate.toDate() : undefined, 
       maxDate: maxDate.isValid() ? maxDate.toDate() : undefined, 
       onClose: function() { if ($.fn.valid) $(this).valid(); }, 
       dateFormat: allBindings.get('format') || GGS.dateFormats.pickerDateFormat 
      }, 
      dp = $(element).datepicker(options); 
     console.log('minDate ' + minDate + ' ' + moment.utc($("#ChartStartDate").val()).format('MM/DD/YYYY')); 
     dp.change(function() { 
      var observable = valueAccessor(), 
       unwrapped = ko.unwrap(observable) 
       current = unwrapped ? moment.utc(unwrapped) : null, 
       raw = dp.datepicker("getDate"), 
       localValue = raw ? moment(raw) : null, //n.b. not UTC; stupid jQuery UI 
       value = localValue ? moment.utc([localValue.year(), localValue.month(), localValue.date()]) : null //extract the date part to a UTC date 
       if (!value || (!current || !current.isSame(value, 'day'))) { 
        console.log('value = ' + value.toDate()); 
        observable(value ? value.toDate() : value); 
       } 
     }); 
    }, 
    update: function (element, valueAccessor) { 
     var dp = $(element); 
     var observable = valueAccessor(), 
      unwrapped = ko.unwrap(observable), 
      value = unwrapped ? moment.utc(unwrapped) : null, 
      localValue = value ? moment([value.year(), value.month(), value.date()]) : null //make sure that jQuery UI shows the date we expect, rather than trying to convert to local time 
     ; 
     dp.datepicker("setDate", localValue ? localValue.toDate() : localValue); 
     dp.blur();   
    }, 
} 
+0

ищет что-то вроде этого http://jsfiddle.net/supercool/X82aC/1251/. вы можете изменить 'new Date()' на любой наблюдаемый, где вы можете передать свой собственный пользовательский номер min –

+0

, а также любую дополнительную информацию, которая дает мне знать, вот скрипка с вашим кодом http://jsfiddle.net/supercool/74dh736s/22/ , ура. –

+0

Спасибо, сработало. !! – ATHER

ответ

2

Ну как уже упоминалось в комментариях вы просто должны сделать это

вид:

<input type="text" class="form-control datepicker" data-bind="datePicker:targetDate, minDate:datePickerMinDate()" /> 
<span id="temp" data-bind="text:targetDate"></span> 

ViewModel:

var ViewModel = function() { 
    var self = this; 
    self.targetDate = ko.observable('01/10/2015'); 
    self.datePickerMinDate = ko.observable('01/10/2015'); 
}; 

//In bindingHandler update 

update: function (element, valueAccessor) { 

     var dp = $(element); 
     var observable = valueAccessor(), 
      unwrapped = ko.unwrap(observable) 

      //here you have to format the Date before setting 
      $(element).datepicker("setDate", unwrapped); 
     dp.blur(); 

    } 

Рабочие скрипку для справки here

 Смежные вопросы

  • Нет связанных вопросов^_^