2017-12-04 19 views
0

UIkit을 사용하여 WTForm 라디오 입력의 스타일을 지정하려하지만 각 필드를 반복 할 때 클래스를 적용하는 방법을 알 수 없습니다. form.difficulty(class_"uk-radio")for 루프에 추가하면 형식이 지정된 필드 대신 미친 출력이 표시됩니다. WTForm 내의 라디오 필드에이 UIkit 클래스를 적용하는 올바른 구문은 무엇입니까?WTForm 라디오 필드에 수업을 추가하려면 어떻게해야합니까?

감사합니다.

HTML :

{% from "_formhelpers.html" import render_field %} 
<form class="uk-grid-small uk-background-muted uk-padding" action="/ask/" method="post" uk-grid> 
    <div class="[email protected] uk-margin-small">{{ render_field(form.title,placeholder="The Problem", class_="uk-input") }}</div><br> 

    <div class="uk-width-1-1 uk-margin-small"> 
     <strong>Question Difficulty:</strong> 
     <br> 
     {% for subfield in form.difficulty(class_="uk-radio") %} 
      <tr> 
       <td>{{ subfield.label }}</td> 
       <td>{{ subfield }}</td> 
       &nbsp;&nbsp;&nbsp;&nbsp; 
      </tr> 
     {% endfor %} 
    </div> 
    <br> 

    <div class="uk-width-1-1 uk-margin-small"> 
     {{ render_field(form.body,placeholder="My device probably has a virus. I clicked the wrong link, and I have like a million popups a minute now. Minute.tech HELP! I need some direction here guys.", class_="uk-textarea", rows="20", cols="100") }} 
    </div> 
    <br> 
    <div class="uk-width-1-1 uk-margin-small">{{ render_field(form.tags,placeholder="Mac, virus, Facebook, etc", class_="uk-input") }}</div> 
    <br> 
    <div class="[email protected] uk-margin-small"> 
     <input class="uk-button uk-button-primary" type="submit" value="Ask"> 
    </div> 
</form> 

파이썬

class AskForm(Form): 
    difficulty = RadioField('Difficulty Rating', choices = [('1','1'), ('2','2'),('3','3'),('4','4'),('5','5')]) 
    title = TextField('Title:', [validators.Length(min=5, max=100)]) 
    body = TextAreaField('Desciption:', [validators.Length(min=10, max=2000)]) 
    tags = TextField('Tags:', [validators.Optional()]) 

결과 :

Results from adding class to WTForm radio

,536,913 63,210

편집이 : {{ render_field(form.difficulty, class_="uk-input") }}는, 출력은 여전히 ​​수직 포맷 및

결과 스타일하지 시도 :

enter image description here

답변

1

더 서브 필드 없다, difficulty 여러 선택 한 분야이다.
다른 필드와 마찬가지로 렌더링하고 작동해야합니다.

{{ render_field(form.difficulty, class_="uk-input") }} 
+0

시도해 보았습니다. 라디오 버튼은 스타일이 지정되지 않고 가로로 표시되지 않고 가로로 표시됩니다 (게시물에서 업데이트 된 출력) – douglasrcjames

+0

발표 문제입니다. 양식 및 입력란이 의도 한대로 작동합니다. – leovp

+0

Gotcha, 그래서 나는 WTForms 라디오 필드에 수업을 추가 할 수 없다고 제안하고 있습니까? 아마 내가 라디오 필드 입력을 검증 할 필요가 없기 때문에 Flask의'request' 필드를 함께 사용하려고 노력할 것입니다. – douglasrcjames