[Django]会員入力フォームの送信


さらにdjangoで会員入庫を作成し,会員情報を転送し,価格を表示する画面も作成した.
方法は以下の通りです.

1.プロジェクト名と同じアプリケーションフォルダのurl。py確認パスに入ります。

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('jisu/', include('product.urls'))
    path('member/' include('member.urls'))
]
memberアプリケーションurls

2.対応するアプリケーションフォルダ(member)に移動し、urlを使用します。py(ない場合は作成)

from django.urls import path
from. import views

urlpatterns =[
        path('joinus', views.join),
        path('welcome', views.resu)
 ]
「メンバー入力」ウィンドウ(メンバー入力フォーム値の送信)と「結果」ウィンドウ(メンバー入力フォーム値の受信)をビューの関数に通知します.

3.対応するアプリケーションフォルダで表示します。pyに関数を作ります。

from django.shortcuts import render

def join(req):
  return render(req, 'joinin.html')

def resu(req):
  return render(req, 'hello.html')
joinとresult関数で接続します.htmlとhello.htmlを別々に開きます.

4.対応するアプリケーションフォルダ内でtemplatesフォルダ内にhtmlファイルを作成します。(join.html、hello.html)(フォルダがない場合はフォルダを作成)


5.formタグで作成した会員登録ページ接続。htmlファイル

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>회 원 가 입</title>
</head>
<body>
  <div>
    <div>
      <form action = "http://로컬ip:포트번호/members/welcome" method="POST">
        {% csrf_token %}
        <fieldset>
          <legend>회원 가입 양식</legend>
          <table class ="table">
            <tr>
              <td>아이디 : </td>
              <td><input type ="text" name ="id" placeholder="아이디를 입력하세요"></td>
            </tr>
            <tr>
              <td>비밀번호 : </td>
              <td><input type="password" name ="pw" placeholder="비밀번호를 입력하세요"></td>
            </tr>
            <tr>
              <td>이름 : </td>
              <td><input type="text" name ="name" placeholder="이름을 입력하세요"></td>
            </tr>
            <tr>
              <td>주소 : </td>
              <td><input type="text" name ="address" placeholder="주소를 입력하세요"></td>
            </tr>
            <tr>
              <td>번호 : </td>
              <td>
                <select name = "phone_1">
                  <option value = "010">010</option>
                  <option value = "02">02</option>
                </select>
                -
                <input type = "text" name = "phone_2">
                -
                <input type ="text" name = "phone_3"></td>
            </tr>
            <tr>
              <td>동의 여부 : </td>
              <td>가입에 동의 합니다.<input type ="checkbox" name ="agree">
            </tr>
            <tr>
              <td></td>
              <td><button type = "submit">가입하기</button></td>
            </tr>
          </table>
        </fieldset>
      </form>
    </div>
  </div>
</body>
</html>
🤓 ここで注意すべき点は
その他はhtmlタグで書くことができます.
  • フォームタグのactionプロパティで、フォーム値の転送先を指定します.
  • {%csrf token%}をフォームタグの真下に書きます.
    なぜなら、djangoにはトークンをフォームに渡すことで権限(?)を検証するセキュリティルールがあるからです.
  • 🚩 こらえろ!
    長時間スタンプ言語
    {%はここでエンコードできます%}
    {変数}

    6.上記の値で、結果ウィンドウに表示したい値をアプリケーションのビューに表示します。pyで関数に追加のコードを記述する必要があります。


    下のピンクにハイライトが入っています.
    from django.shortcuts import render
    
    def join(req):
      return render(req, 'join.html')
    
    def result(req):
      return render(req, 'hello.html',{'info1':req.POST.get('name'), 'info2':req.POST.get('id')})
    info 1という変数名でreq(?)から名前の値をPOST方式で受信する.
    info 2という変数名でreq(?)からIDという名前の値をPOSTで受け取ります.
    POST方式は上記接続です.htmlファイルはPOSTファイルです.
    (フォームタグがget方式で送信された場合はreq.GET.getに書き込む)
    nameも上の接続です.htmから対応する値を取得できます.

    7.フォームから送信された値を受信するhello。htmlファイル

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>회 원 가 입 완 료</title>
    </head>
    <body>
      <div>
        <div>회원 가입 완료</div>
        <div>안녕하세요 {{ info1 }}님.<br>
          회원가입이 완료 되었습니다.<br>
    			{{ info1 }}님의 아이디는 {{ info2 }}입니다.
        </div>
      </div>
    </body>
    </html>
    👉🏻結果ウィンドウ


    🤓 学んだこと
    1ππはプロジェクトフォルダ内にアプリケーションフォルダを新規作成し,再作成した.
    他のアプリケーションフォルダはtemplatesフォルダのhtmlファイルの名前と同じです.
    [コミット]をクリックすると、他のアプリケーションフォルダの結果ウィンドウが表示されます.
    ファイルの名前を同じにしないでください!!道がうまくいかないようです.
    2カンマのミスが多い.もう一度やるのは三回ある.
    いつでも誤字に注意!カンマが落ちたかどうか特に注意します.