2012-04-15 2 views
9

즉시 변경을 반영하도록 결합 observable을 I 형의 수의 input에 값 바인딩을 설정valueUpdate : Knockoutjs에서 = "숫자"입력 타입 "afterkeydown '2.0

[그림은 fiddle 참조], 및 원하는 필드 값으로. 그렇게하기 위해 나는 afterkeydown valueUpdate 바인딩을 설정했다. 이것은 위쪽 화살표와 아래쪽 화살표 키를 사용하여 입력 된 숫자를 변경하는 데 적합합니다. 그러나 브라우저에서 생성 된 (크롬에서 테스트 한) 증분/감소 컨트롤을 사용하여 숫자를 변경하면 포커스가 다른 요소로 변경 될 때만 변경 사항이 반영됩니다. 변경 이벤트가 발생할 때 기본 업데이트를 반영한다고 가정합니다.

제 질문은 위로 아래로 키보드 오류와 브라우저에서 생성 된 위/아래 오류 컨트롤을 사용하여 두 가지 변경 사항 모두에 대해 업데이트가 수행되도록 설정하는 방법이 있는지 여부입니다.

답변

18

valueUpdate 추가 바인딩은 일련의 이벤트를 취할 수 있습니다. 위/아래 화살표를 클릭하면 oninput 이벤트가 시작되는 것 같습니다.

그래서, 당신은 그것을 좋아 바인딩 할 수 있습니다 :

<input type="number" data-bind="value: y, valueUpdate: ['afterkeydown', 'input']"/>

http://jsfiddle.net/rniemeyer/hY5T2/9/

+0

우수, 그것이 마치 마법처럼 작동합니다. 감사합니다. – odedbd

+0

내 MVVM DotNetNuke 모듈에서 이것을 사용하여 아주 작은 (!) 스피넬 업 및 스피너 다운 버튼을 얻을 수 있습니다. 그들은 너무 작아서 사용하기가 거의 불가능합니다. 나는 그것이 CSS 일이라는 것을 재검토하지만, 알아낼 수는 없었다. 모든 데이터가 멋지게 보이지만

+0

관찰 기록을 업데이트하지 않는 Selenium 테스트 스크립트에서 문제가 발생하여 해결되었습니다. – AaronLS

관련 문제