简体   繁体   English

创建登录和注册页面 HTML 和 CSS 后如何获取用户输入并保存到数据库?

[英]After creating login and registration page HTML and CSS how to take user input and save to data base?

I'm currently making a website and have created both the HTML and CSS for both the registration and login Pages - I'm wanting to use Django to save the information, I'm just a bit confused on how to take the user input (using my html inputs) and then transferring them to the Django data base.我目前正在制作一个网站,并为注册和登录页面创建了 HTML 和 CSS - 我想使用 Django 来保存信息,我只是对如何获取用户输入有点困惑(使用我的 html 输入),然后将它们传输到 Django 数据库。 I'm very new to web development as you can tell - I'm just trying to take it one step at a time.正如您所知,我对 Web 开发非常陌生 - 我只是尝试一步一步地进行。

 /* This is the style sheet for the Registration Page only */ body { background-color: rgba(255,0,0,0.65); } h2 { color: white; font-family: optima; font-size: 300%; font-weight: 500; font-variant: small-caps; line-height: 200px; height: 200px; z-index: 0; margin-top: -50px; } h3 { color: white; font-family: Helvetica; font-size: 250%; font-weight: 400; font-variant: small-caps; margin-top: 50px; } #rectangle{ top: 20px; display: inline-block; width:450px; height:550px; background:rgba(43, 43, 43, 1); transform: translate(-50%,-50%); border-radius: 15px; position: absolute; z-index:-5; top: 550px; } img { opacity: 0.8; display: block; margin-left: auto; margin-right: auto; background-repeat: no-repeat; } div { text-align: center; padding: 0; } label{ color:white; font-family:Helvetica ; display: block; text-align: center; padding-bottom: 10px; } select{ font-family:Helvetica ; background-color: lightgrey; text-align: center; margin: 0 auto; display: block; padding: 50; } span { color:white; font-family:Helvetica ; display: block; text-align: center; padding-top: 20px; padding-bottom: 5px; } p { font-size: 10px; color:lightgrey; font-family:Helvetica ; display: block; text-align: center; } input[type=text]:focus{ font-family:Helvetica ; background-color: lightgrey; } input[type=text]{ font-family:Helvetica ; display: block; margin: 0 auto; text-align: center; } input[type=password]{ font-family:Helvetica ; display: block; margin: 0 auto; text-align: center; } input[type=password]:focus{ font-family:Helvetica ; background-color: lightgrey; } input[type=Vpassword]{ font-family:Helvetica ; display: block; margin: 0 auto; text-align: center; } input[type=checkbox]{ display: block; margin: auto; } input[type=button]{ font-family:Helvetica ; display: block; margin: 0 auto; margin-top: 50px; }
 <!DOCTYPE html> <html> <head> <!-- Tab title for the window and importing stylesheet --> <title>SEAS Course Planner</title> <link rel="stylesheet" href="registrationstyle.css"/> </head> <body> <!-- WKU image file, specify width in center/top of page --> <img src="output-onlinepngtools.png" width="200" height="100"> <div> <!-- Headers for webpage and then login title --> <h2>SEAS COURSE PLANNER</h2> <h3>Create Account</h3> <!-- Background Rectangle --> <div id="rectangle"></div> </div> <form> <!-- Drop down menu to select what account type --> <label for="usertype">Account Type:</label> <select name="usertype" id="usertype"> <option value="Student">Student</option> <option value="Admin">Admin</option> </select> <!-- textboxes for username password, and password verification --> <div> <span>Create a New User Name:</span> <!-- Side note to enter in Student ID if Student--> <p> <em>(If student, Use Student ID Number)</em> </p> </div> <input type="text" id="username" name="username" placeholder="New Username"><br> <span>Create a Password:</span> <input type="password" id="myInput" name="password" placeholder="New Password"><br> <input type="password" id="myInput2" name="Verify Password" placeholder="Verify Password"><br> <!-- checkbox for user to check if they would like to see their password in the textbox --> <span>Show Passwords:</span> <label for="showpassword" style="word-wrap:break-word"> <input id="showpassword" type="checkbox" onclick="showPassword();showVPassword()" </label> <!-- two buttons (not yet connected to corresponding webpages) for login and create account --> <input type="button" value="Create Account"><br> </form> <!-- javascript to hide password AND verification password unless checkbox is checked --> <script> function showPassword() { var x = document.getElementById("myInput"); if (x.type === "password") { x.type = "text"; } else { x.type = "password"; } } function showVPassword() { var x = document.getElementById("myInput2"); if (x.type === "password") { x.type = "text"; } else { x.type = "password"; } } </script> </script> </body> </html>

使用 Django 身份验证系统https://docs.djangoproject.com/en/3.1/topics/auth/default/或者您可以做一个脚手架,它将生成创建表单所需的所有内容并保存到数据库中。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 django registration redux登录后不会重定向到base.html - django registration redux not redirecting to base.html after login 如何在命令后获取用户输入并将其保存为变量 discord.py - How to take user input after command and save it as variable discord.py Django:如何使用通用CreateView在注册后直接登录用户 - Django: How to login user directly after registration using generic CreateView 在 django 中注册或登录后与用户保存匿名用户数据和 map - Save anonymous user data and map with the user after registeration or login in django 用户注册后Django自动登录(1.4) - Django automatic login after user registration (1.4) Django 用户注册后未创建配置文件的信号 - Django Signals not creating profile after user registration 如何获取HTML用户输入并通过Python和SQL查询? - How to take HTML user input and query it via Python & SQL? 如何在不刷新 flask 页面的情况下获取用户输入? - how do I take user input without refreshing the page in flask? Django:用户登录系统不在与用户注册的同一页面中工作 - Django: user login system is not working in the same page with user registration 如何从另一个应用程序获取管道输入并在之后获取用户输入? - How can I take piped input from another application AND take user input after?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM