knockout을 사용하여 부분 뷰에서 kendoDatePicker를 실행

그래서 녹아웃으로 요소와 데이터를 바인딩하려고합니다. 그런 다음 버튼을 클릭 할 때 렌더링되는 부분보기가 있습니다. 지금까지 모든 것이 잘 돌아가고 있으며, 부분에 필요한 올바른 데이터를 얻습니다. 문제는 내가 kendoDatePicker처럼 행동하고 싶은 입력이 있지만 실제로는 그렇지 않습니다. 나는 버튼을 클릭하여 부분 뷰를 렌더링 할 때 올바른 방법을 실행하고 올바른 데이터를 얻지 만 동일한 메소드를 사용한다는 것을 알았습니다. $("#id").kendoDatePicker(); DOM 요소가 아직 렌더링되지 않았고 그 것이 문제라고 생각합니다 . 내가 녹아웃 - 같은 요소를 바인딩하려고했습니다 : <input data-bind="kendoDatePicker: {value: startDate}"/>하지만 그때도 날짜가 없습니다. partial 뷰의 주 div가이 <div data-bind="with: $root.shift"> <input id="randomId" data-bind: Start"/> //thats not showing in the main DOM until I the partial is loaded</div>과 같이 바인드되어 있습니다.이 바인더가있는 "with"바인더를 제거하면 버튼의 기능이 손실됩니다.knockout을 사용하여 부분 뷰에서 kendoDatePicker를 실행

누구나 동일한 문제가 발생합니까? 작동하도록하기 위해 내가 할 일이 있습니까?

출처

2017-02-15 Samo Alzeus

DOM에 요소가없는 것이 문제입니다. knockout은 DOM 변경 사항을 처리해야하므로 요소를 잡아 내고 녹아웃 외부에서 무언가를하는 것은 좋은 습관이 아닙니다.

대신 knockout custom bindings을 사용하십시오. 그들은 knockout과 관련하여 DOM 요소에서 작동하는 사용자 정의 바인딩을 만들고이를 처리하는 방법을 정의 할 수 있습니다. 따라서 :

ko.bindingHandlers.kendoDatePicker = { 
 
    init: function(element, valueAccessor, allBindings, viewModel, bindingContext) { 
 
     //here you can access (and possibly pass it to the options) the 'value' by callnig valueAccessor(). 
 
     $(element).kendoDatePicker(); 
 
    } 
 
}; 
 

 
ko.applyBindings({});

<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> 
 
<script src="http://kendo.cdn.telerik.com/2017.1.118/js/kendo.all.min.js"></script> 
 
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.1.118/styles/kendo.common.min.css" /> 
 

 
<input id="datepicker" value="10/10/2011" style="width: 100%" data-bind="kendoDatePicker: {value: 'somevalue'}" />

출처

2017-02-15 10:56:02

답을 주셔서 감사합니다! 그것은 내 경우에 유일한 방법입니다, 나는 방금 맞춤 바인딩과 녹아웃을 일반적으로 살펴보기 시작했습니다. –

knockout을 사용하여 부분 뷰에서 kendoDatePicker를 실행

답변

관련 문제