Sử dụng các trường HTML5 với WTForms

Question

Tôi đang sử dụng Flask để phát triển một ứng dụng web. Ban đầu tôi đã làm các biểu mẫu HTML theo cách thủ công và sau đó chuyển sang sử dụng WTForms (đây là một dự án giáo dục, vì vậy tôi đang hiển thị từng bước xây dựng dự án).

Tôi hơi bối rối khi cố gắng thêm các trường biểu mẫu HTML5, chẳng hạn như EmailField. Tôi đã tìm kiếm tài liệu WTForms, và trực tuyến, và tôi không thể tìm ra cách tạo ra một WTForm bằng cách sử dụng một HTML5 EmailField.

Sau đó, tôi đã cài đặt mô-đun này https://pypi.python.org/pypi/wtforms-html5 cho phép và mọi thứ đã hoạt động. Nhưng tôi đã không hài lòng về việc thêm một phụ thuộc, đặc biệt là vì nó dường như không được tích cực phát triển (https://github.com/brutus/wtforms-html5).

Sau đó tôi kết thúc trên trang github của WTForms và thấy rằng thực sự có hỗ trợ cho tất cả các trường HTML5 mới, nhưng các trường này không được nhập theo mặc định. https://github.com/wtforms/wtforms/blob/master/wtforms/fields/html5.py Do đó thay vì sử dụng

from WTForms import EmailField 

Như người ta sẽ suy ra từ

from WTForms import TextField 

Một thay vì phải sử dụng

from wtforms.fields.html5 import EmailField 

trước đây tôi đã sử dụng các mô-đun wtforms-html5 như sau

from wtforms_html5 import EmailField 

Do đó, tôi đã thay đổi tất cả các lần xuất hiện của wtforms_html5 thành wtforms.fields.html5 và ứng dụng của tôi hoạt động chính xác như mong đợi.

Ok, cảm ơn bạn đã đọc tất cả nền. Bây giờ cho các câu hỏi:

• Tại sao không phải bất kỳ trường html5 nào (EmailField, DateField, v.v.) được đề cập trong tài liệu WTForms?

• Tại sao không các lĩnh vực nhập khẩu vào WTForms theo mặc định như những người khác

• Là những lĩnh vực ổn định/kế để sử dụng?

• Phương pháp hay nhất để nhập các trường từ WTForms là gì?

Đối với lĩnh vực văn bản, tôi có thể sử dụng bất kỳ những điều sau đây:

from wtforms import TextField 
from wtforms.fields import TextField 
from wtforms.fields.simple import TextField 

Nhưng đối với EmailField, tôi phải sử dụng

from wtforms.fields.html5 import EmailField 

Tôi muốn:

from wtforms.fields import TextField 
from wtforms.fields import EmailField 

Nhưng điều này sẽ yêu cầu thêm một dòng vào các trường [__init__][1] tập tin, mà tôi không muốn làm vì nó là một dự án giáo dục và điều này sẽ chỉ gây nhầm lẫn cho người học.

Tôi đang tìm kiếm

• Cái nhìn sâu sắc là tại sao WTForms không tài liệu hoặc bằng cách nhập khẩu mặc định các lĩnh vực html5
• Bất kỳ lý do gì để tiếp tục sử dụng các mô-đun của bên thứ ba wtforms-html5.

Answer 1

lời tựa, tôi là một trong những tác giả và hiện nay nhà duy trì chính của WTForms

Trước khi tôi nhận được đến tại sao tôi nên đề cập đến một mô hình thực sự phổ biến đối với những người sử dụng WTForms là tạo ra mô-đun của riêng bạn tạo ra tất cả các bit bạn muốn vào một không gian tên duy nhất.

Ví dụ trong myapp/forms.py bạn làm điều gì đó như:

from wtforms.fields import * 
from wtforms import widgets, Form as _Form 
from wtforms.fields.html5 import EmailField, 


class Form(_Form): 
    """Awesome base form for myapp. Includes CSRF by default""" 
    class Meta: 
     csrf = True 
     csrf_secret = 'secretpasswordhere' 

     @property 
     def csrf_context(self): 
      return get_current_request().session 

    # maybe add some methods you really wanted to have on your Form class 

Bạn có thể sử dụng ở trên như:

from myapp.forms import Form, TextField, EmailField, ... 

class UserForm(Form): 
    name = TextField(...) 
    email = EmailField(...) 

hoặc xen kẽ với một khẩu sao như from myapp.forms import *

Bạn sẽ lưu ý Tôi cũng bao gồm một lớp con biểu mẫu tùy chỉnh thiết lập CSRF và cung cấp ngữ cảnh CSRF theo mặc định, điều này không thực sự cần thiết. (Bằng cách này Flask-WTF không thiết lập CSRF tương tự dành cho bạn nếu bạn đang sử dụng bình, nhưng điểm là để minh họa làm thế nào bạn có thể dễ dàng đưa ra với hội nhập của riêng bạn.)

---

Bây giờ tại sao.

Ý tưởng cốt lõi của WTForms là tạo ra một khung công tác rất đơn giản, hoạt động tốt cho đa số trường hợp sử dụng, nhưng đủ rộng để mọi người có thể cung cấp các công cụ đồng hành để làm việc với các trường hợp sử dụng cụ thể.

Sớm, giải pháp để thực hiện điều đó là kết hợp extensions để tương tác với các thư viện khác nhau. Nhưng điều đó đặt ra một vấn đề trong đó nó bao la tăng sự phức tạp và diện tích bề mặt của thử nghiệm, cộng với nó sẽ lái xe WTForms phát hành theo cách kỳ lạ (Django chỉ thay đổi điều này, bây giờ bạn cần phải phát hành một WTForms mới). Vì vậy, trong năm 2015, chúng tôi đã quyết định di chuyển tất cả các tiện ích mở rộng đến các gói của riêng họ để cho phép họ có lịch phát hành riêng. Thay vì buộc mọi người sử dụng một gói duy nhất cố gắng làm mọi thứ, điều này đã dẫn đến một hệ sinh thái thực sự tuyệt vời nổi bật với các gói đồng hành vững chắc như Flask-WTF, WTForms-Alchemy và WTForms-Django để đặt tên một vài.

Vì sao các loại HTML5 không được ghi lại; tốt, đó là một thiếu sót. Ngoài ra, một số lịch sử: Tại một số điểm, chúng tôi đã chuyển đổi kết quả đầu ra của trường WTForms mặc định từ cú pháp XHTML thành HTML nhỏ gọn; nhưng vẫn giữ đầu ra của trường lõi. Vì vậy, sau đó chúng tôi có người đóng góp các biểu mẫu XHTML, mọi người đóng góp các trường html5 và mọi người muốn các trường mặc định sử dụng các loại HTML5, tất cả sau khi chúng tôi đảm bảo khả năng tương thích ngược trong phiên bản chính.

---

Tôi biết đó là một câu trả lời dài, và có lẽ cách ngắn để nói nó là: Trong khi WTForms không thường làm việc với hầu hết các khuôn khổ web ra khỏi hộp, nó được thiết kế để cấu hình và tùy chỉnh để sử dụng của bạn; không cắm và chơi cho mọi thứ.

Answer 2

Tác giả của WTForms HTML5 tại đây. Chỉ cần một nhanh chóng đứng đầu về dự án: nó "đã không được duy trì" trong một ý nghĩa, rằng nó làm việc cho tôi và tôi không cần phải thêm bất cứ điều gì. Kể từ khi vanilla WTForms bắt đầu hỗ trợ tất cả những thứ mà tôi khuyên bạn nên sử dụng chỉ là đồng bằng WTForms.

Nếu bạn muốn một số từ khóa kết xuất được tạo tự động cho tiện ích, phiên bản WTForms HTML5 hiện tại đã bỏ tất cả các trường và tiện ích, giờ đây cũng được hỗ trợ bởi WTForms và thay vào đó sử dụng lớp Meta cho biểu mẫu.