完成了modelForm保存逻辑,修改为使用ajax请求的方式

1 year ago · 907bdfed12
parent cd63549cbe
commit 907bdfed12
3 changed files with 10741 additions and 7 deletions
--- a/django_demo/settings.py
+++ b/django_demo/settings.py
@ -115,16 +115,18 @@ USE_I18N = True

 USE_TZ = True

-# Static files (CSS, JavaScript, Images)
-# https://docs.djangoproject.com/en/4.1/howto/static-files/
-
-STATIC_URL = 'static/'
-
 # Default primary key field type
 # https://docs.djangoproject.com/en/4.1/ref/settings/#default-auto-field

 DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'

+# Static files (CSS, JavaScript, Images)
+# https://docs.djangoproject.com/en/4.1/howto/static-files/
+
+STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]
+STATIC_URL = '/static/'
+STATIC_ROOT = os.path.join(BASE_DIR, '/static')
+
 # Media
 MEDIA_URL = "/media/"
 MEDIA_ROOT = os.path.join(BASE_DIR, "media")
--- a/static/plugins/jquery-3.7.0.js
+++ b/static/plugins/jquery-3.7.0.js
--- a/templates/form_demo/userinfomodels.html
+++ b/templates/form_demo/userinfomodels.html
@ -4,6 +4,8 @@
    <meta charset="UTF-8">
    <title>user_info_models</title>
 </head>
+{% load static %}
+<script src="{% static 'plugins/jquery-3.7.0.js' %}"></script>
 <body>
 <form action="" method="POST" novalidate>
    {% csrf_token %}
@ -20,8 +22,34 @@
    <p>{{ form_obj.mobile.label }}:{{ form_obj.mobile }}
        {{ errors.mobile.0 }}</p>
    {{ errors }}
-    <input type="submit" value="提交">
-</form>
+    {#    <input type="submit" value="提交">#}
+    <button id="submit">提交</button>

+</form>
+<script>
+    $('#submit').click(function () {
+        $.ajax({
+            url: "/userinfomodelsave/",
+            async: true,
+            type: "post",
+            data: {
+                username: $("#id_username").val(),
+                password: $("#id_password").val(),
+                confirm_password: $("id_confirm_password").val(),
+                status: $("id_status").val(),
+                age: $("id_age").val(),
+                mobile: $("id_mobile").val(),
+                "csrfmiddlewaretoken": $("[name='csrfmiddlewaretoken']").val()
+            },
+            success: function (data) {
+                consile.log(data);
+                alter(data.msg);
+            },
+            error: function (jqXHR, testStatus, err) {
+                console.log(argument);
+            }
+        })
+    })
+</script>
 </body>
 </html>