AmazeUIのJSフォーム検証フレームワークの動作を公開

1. 必要条件

UTribe（Androidアプリ）に組み込まれた学生連合活動登録システムのフロントエンドページを作る。登録者は最低1人、最高4人で、チーム名は必須、キャプテンの情報は全て必須、選手のQQと携帯電話番号は任意、参加時間は必須で、フォームには最大4つの動的追加が可能であること。

2、予備設計

今回のプロジェクトは半日しかなく、Android側でページのデバッグをした経験もなく、レイアウトのデバッグをする機会もないので、一度デプロイして動作を確認するくらいしかできません。

3、問題点

私は白、フォームの検証を行う前に、パラメータをチェックするためにjsを使用して送信されますが、より多くのパラメータで、このプロジェクト、およびチェックするさまざまな方法の同じフィールド（キャプテンQQ、携帯電話が必要とチームメンバーは使用しません）、作業負荷が明らかに以前の方法で大きい場合、それを行うには良い方法はないですか？今回、jsの検証フレームワークのamazeUIを見たが、相互作用が良い。

使い方を研究した上で

まず対象のフォームをバリデータ関数にバインドし、検証が必要なフィールドに属性（required, pattern, mixlengthなど）を追加し、patternはHTML5に既存のemailやurlなどの正規表現に加えてカスタマイズでき、最後に操作後のフォーム情報が正規であるかを判断するためにsubmit関数に入力します。次に、このフレームワークを自分のプロジェクトに適用し、カスタム正規表現を追加してみました。

ここでは、チームメンバーが追加する必要はありませんが、検証を追加するには、キャプテンのQQ、携帯電話番号などの需要に応じて、対応するフィールドに検証を追加することができます。

mkvirtualenv django_tmall
workon django_tmall

# git clone way to download
git clone [email protected]:sshwsfc/django-xadmin

# Unpack and go to the directory
# Install the required packages
pip install -r requirements.txt

質問1.

これはどういうことでしょうか？インタープリタがあなたのValidatorメソッドを認識していないことがわかりました。あるjsの参照が欠けているので、それを修正します。

質問2．

チームメンバーフォームの情報はキャプテンとよく似ているので、でも一人ずつアペンドするわけにはいきませんよね？これは2つの問題が発生します、第一は多くの作業であり、第二は、トラブルのメンテナンスは、単純なコードではありませんので、私は方法を解決するために書かれたdivテンプレートをクローンすることを考えた。

問題点3．

チームメンバーごとのデータをjson配列に統合してバックエンドに渡したいので、リクエストパラメータを確認したところ、キャプテンだけ性別属性があり、チームメンバーにはないことがわかり、後でラジオは名前の値が1つしかないからだとわかり、チームメンバーごとの性別の違いを実現するには、クローンテンプレートでチームメンバーのフォームのラジオの名前属性を動的に変更しなければなりません。選手ごとの違い

Database name: django_tmall
Create a user for this project, username: djangotmall
User password: djangotmall321
Permissions: this user has all permissions to the django_tmall database

import sys

os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))


# Add apps and extra_apps to Django's path

sys.path.insert(0, os.path.join(BASE_DIR,'apps'))
sys.path.insert(0, os.path.join(BASE_DIR,'extra_apps'))


# Add xadmin to INSTALLED_APPS

INSTALLED_APPS = [
    ......
    'xadmin',
    'crispy_forms',
    'reversion',
]


# Will change the database configuration to mysql

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': "django_tmall",
        'USER': 'djangotmall',
        'PASSWORD': "djangotmall321",
        'HOST': "127.0.0.1"
    }
}


# System language configuration, change to Chinese

LANGUAGE_CODE = 'zh-hans'
TIME_ZONE = 'Asia/Shanghai'


# Add resource path

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

pip install pymysql