2013-12-20 2 views
0

텍스트 필드에 아이콘을 삽입하여 필수 필드임을 나타내며 HTML5 형식으로 필드를 채워야한다는 정보를 얻는 방법을 알고 있습니다.라디오 버튼 그룹이 필요함을 나타내는 방법

라디오 버튼과 체크 상자에는 비슷한 메커니즘이 있습니까?

다음은 사용하고있는 라디오 버튼의 간단한 그룹입니다.

<!DOCTYPE html> 

    <polymer-element name='marital-status-form'> 
    <template> 
    <style"> 

     #col1 { order:1; } 
     #col2 { order:2; align-self:flex-start; } 
     #hr { order:3; } 

    </style> 
     <form id='form' 
      name='form' 
      on-change='{{updateModel}}'> 

     <section 
      <label for='marriedRdo' id='marriedLbl' >Married</label> 
      <label for='divorcedRdo' id='divorcedLbl' >Divorced</label> 
      <label for='singleRdo' id='singleLbl' >Single</label> 
      <label for='visitingRdo' id='visitingLbl' >Visiting</label> 

     </section> 

     <section > 
      <input id='marriedRdo' 
       name='status' 
       type="radio" 
       value='Married' 
       on-click='{{submit}}'> 
      <input id=divorcedRdo name='status' type='radio' value='Divorced'> 
      <input id='singleRdo' name='status' type="radio" value='Single' > 
      <input id=visitingRdo name='status' type='radio' value='Visiting'> 
     </section> 

     <hr id='hr'> 
     <delete-dispatch-form id='delete-dispatch-form'></delete-dispatch-form> 

     <button id='submit-btn' 
      type='submit'></button> 

     </form> 
     </template> 

    <script type="application/dart"> 

     import 'package:polymer/polymer.dart' show CustomTag, observable, PolymerElement; 

     import 'dart:html' show Event, Node, InputElement; 


     @CustomTag('marital-status-form') 
     class MaritalStatusForm extends RooleElement 
     { 
     @observable String choice= ''; 

     MaritalStatusForm.created() : super.created(); 

     void updateModel(Event e, var detail, Node target) 
     { 
      //maritalStatus.status = (e.target as InputElement).value; 

      //print(encode(maritalStatus)); 

     } 


     void submit (Event e, var detail, Node target) 
     { 
      $['form'].onSubmit.listen((e) 
       { 
       e.preventDefault(); 
       }); 
     } 

     } 

    </script> 
    </polymer-element> 
+0

다트와는 거의 무관 단지 HTML5의 질문이다. 그래서 태그를 바꿀 것입니다. –

답변

0

이 문제에 대한 간단한 해결책은 기본적으로 라디오 버튼을 선택하는 것입니다. 그렇게하면 사용자는 기본값을 유지하거나 다른 옵션을 선택할 수 있습니다. 사실, 이는 라디오 버튼 그룹을 '요구'합니다.

0

html의 관점에서 그룹의 라디오 입력 중 하나에 '필수'속성을 추가 할 수 있으며 옵션 중 하나를 선택해야합니다.

<input id='marriedRdo' 
      name='status' 
      type="radio" 
      value='Married' 
      on-click='{{submit}}' 
      required="required"> 

는 데모이 바이올린을 참조하십시오 : 나 여기에 http://jsfiddle.net/lickmydesign/5y4Lv6gc/

관련 문제