Firefox에서 녹아웃 옵션 바인딩이있는 HTML 5 유효성 검사가 작동하지 않습니다.

Question

사용자가 강제로 녹아웃으로 채워진 드롭 다운 메뉴에서 옵션을 선택하도록하고 있습니다.

<form id="theForm" class="form-horizontal form-validate" action="" method="post"> 
    <div class="control-group"> 
     <label class="control-label">To</label> 
     <div class="controls"> 
      <select required data-bind="options: listRecipients, 
            optionsCaption: 'Choose...', 
            optionsText: 'name', 
            value: selectedRecipient"></select> 
     </div> 
    </div> 
    <button type="submit" class="btn btn-primary">Submit Changes</button> 
</form> 

그리고 해당 자바 스크립트 : 나는 검증 속성이 HTML5를 "필수"사용하고, 그것은 크롬 (38)와 오페라 25에서 잘 작동하지만, 여기

파이어 폭스 (33)에 실패하는 것은 내 HTML입니다 :

$(document).ready(function() { 
    function AppViewModel() { 
     // KO model 
     self.listRecipients = ko.observableArray([{ 
      name: 'foo', 
      id: '1' 
     }, { 
      name: 'bar', 
      id: '2' 
     }]); 
     self.selectedRecipient = ko.observable(); 
    } 

    // Activates knockout.js 
    var appViewModel = new AppViewModel(); 
    ko.applyBindings(appViewModel); 
}); 

해당 jsFiddle.

knockout "options"와 함께 jQuery 유효성 검사를 사용하면 다소 복잡해 보입니다. "옵션"으로 녹아웃 유효성 검사를 사용하는 것에 대한 많은 문서를 찾을 수 없습니다. FF로 작동하지 않는 이유는 무엇입니까? 당신이 관찰 selectedRecipient에 저장하고 싶었 ID가 있었다, 그래서 만약

Answer 1

녹아웃 스포츠 데이터 바인딩의 optionsValue, 그냥 optionsValue를 추가 : 'ID를'

<form id="theForm" class="form-horizontal form-validate" action="" method="post"> 
    <div class="control-group"> 
     <label class="control-label">To</label> 
     <div class="controls"> 
      <select required data-bind="options: listRecipients, 
            optionsCaption: 'Choose...', 
            optionsValue: 'id', 
            optionsText: 'name', 
            value: selectedRecipient"></select> 
     </div> 
    </div> 
    <button type="submit" class="btn btn-primary">Submit Changes</button> 
</form> 

는 해당 jsFiddle.