2017-04-20 5 views
0

私はフラスコアプリで書かれた一連のwtformを持っています。私のアプリケーションの私のページの1つは、英語とスペイン語を話す人々によって使用されます。 Webページのトグルボタンを使って、英語とスペイン語の間でフォーム要素のラベルを切り替えるきれいな方法を見つけたいと思います。フラスコのラベルのトグルフォームフォーム

私はここにHTML lang属性(Jグローバーによって第二答えダウンを、)を使用して言語を切り替えるには、素敵な解決策を見つけた:

Using Javascript to change website language

これは<span>要素で各言語を囲み、その後、単に非表示になります私たちは見たくないです。

私の問題は、フォーム上のフィールドのラベルがwtformsオブジェクトから来ていることです。現在の設定で複数の言語を含める方法がわかりません。私は今の私どこの例については以下を参照してください:私はRoofCheckクラスフォームに複数のラベルの追加を開始する場所を確認していない

フォーム

class RoofCheck(FlaskForm):                                                
    """                                                      
    Class holding the form inputs for a roof check                                              
    """                                                      
    roofstate = RadioField('Roof Status',                                            
          validators=[validators.DataRequired('Please select roof closed or open')],                               
          choices=[('closed', 'Closed'), ('open', 'Open')])                                     
    comments = TextAreaField('Comments on roof status',                                          
          [validators.optional(), validators.length(max=390)],                                   
          render_kw={"placeholder": "Enter comments here",                                    
             "rows": 4,                                           
             "style": "min-width: 100%"})                                      
    submit = SubmitField('Submit') 

HTML

<div id='roof_check' class='col-md-6 padding-0'>                                           
    <form id="roof_check_form" action={{ url_for('roof_check')}} method="post" name="roof">                                 
     <fieldset class='form_group'>                                              
      {{ form1.hidden_tag() }}                                              
      <legend class='text-center'>                                             
       Daily visual check of the roof                                       
      </legend>                                                  
      {% for subfield in form1.roofstate %}                                           
       <div class='form-check'>                                             
        {{ subfield }} &nbsp;                                             
        {{ subfield.label(class_="form-check-label") }} <br/>                                     
       </div>                                                 
      {% endfor %}                                                 
      <div class='form-check'>                                              
       {{ form1.comments }}                                             
      </div>                                                  
      <div class='form-check'>                                              
       {% with messages = get_flashed_messages(category_filter=["form1"]) %}                                  
        {% if messages %}                                              
         {% for message in messages %}                                          
          <div> {{ message }} </div>                                         
         {% endfor %}                                              
        {% endif %}                                               
       {% endwith %}                                                
       {% for message in form1.roofstate.errors %}                                        
        <div> {{ message }} </div>                                           
       {% endfor %}                                                
       <div style="padding-top: 5px;">                                           
        {{ form1.submit(class_="btn btn-primary") }}                                       
       </div>                                                 
      </div>                                                  
     </fieldset>                                                  
    </form>                                                    
</div> 

オブジェクト。ここに2つの言語のサポートを挿入する方法に関するアドバイスは素晴らしいでしょう。前もって感謝します。

答えて

0

ラベルに直接htmlを追加して言語属性を配置して、上記のリンクでjavascriptソリューションを使用して言語を切り替えることができます。例:

roof_status_text = ("<span lang='en'>Roof Status</span>" 
        "<span lang='es'>Estado del Techo</span>") 
open_text = ("<span lang='en'>Open</span>" 
      "<span lang='es'>Abierto</span>") 
closed_text = ("<span lang='en'>Closed</span>" 
       "<span lang='es'>Cerrado</span>") 
roofstate = RadioField(roof_status_text, 
         validators=[validators.DataRequired('Please select roof closed or open')],                               
         choices=[('closed', closed_text), 
           ('open', open_text)])