简体   繁体   English

在同一页面上创建注册/登录系统

[英]Creating Registration / Login System on same page

Hello I am creating a Login / Registration system on the same page using PHP and MySQl I am having trouble with the post method and action as it is on the same page.您好,我正在使用 PHP 和 MySQl 在同一页面上创建登录/注册系统我在发布方法和操作时遇到问题,因为它在同一页面上。 Someone knows how I can resolve this problem.有人知道我如何解决这个问题。 Below is my code for the login and registration/ signup system the page is separated with a slider using JavaScript, my problem is that I cannot use the Post method and action to save the form in my DB下面是我的登录和注册/注册系统代码,该页面使用 JavaScript 与 slider 分隔,我的问题是我无法使用 Post 方法和操作将表单保存在我的数据库中


<html>
    <!--WEB-APP Login / Register Page Title-->
    <title>Envision: Login/Register</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--External styling CSS / Font-Family Style / Swiper CSS-->
    <link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'>
    <link href='https://fonts.googleapis.com/css?family=Product+Sans' rel='stylesheet' type='text/css'>
    <!--Custom Styling CSS-->
    <link rel="stylesheet" type="text/css" href="CSS/Access.css">
    <!--Font Awesome Script -->
    <script src="https://kit.fontawesome.com/26011c24ac.js" crossorigin="anonymous"></script>
    <!--Custom js script-->
    <script defer src="js/Custom_JS/log_slider.js"></script>
    <script defer src="js/Custom_JS/selector.js"></script>
</html>

<body>

<!----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
    <!--Back Button to Landing Page-->
    <div class="back">
        <button onClick="location.href='Main.php'" class="back-btn">
            <i class="fas fa-arrow-alt-circle-left" style="font-size: 36px;">
                 <div class="back_text">
                     Back
                 </div> 
            </i>
        </button>
    </div>
<!----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
    <!--CONTAINER CONTAINS LOGIN / SIGN-UP SECTIONS-->
    <div class="container">
        <!--LOGIN SECTIONS STARTS HERE-->
        <div class="form Login" action="php/check_login.php" method="post">

            <form id="login" class="login_input">
            
                <h2>Login</h2>

                <div class="form_log">
                    <span>
                        Username
                    </span>
                    <input type="text" class="input_field" id="user_username" name="username" placeholder="Input your Username" autocomplete="off">
                    <small>Error message</small>
                </div>

                <div class="form_log">
                    <span>
                        Password
                    </span>
                    <input type="password" class="input_field" id="user_password" name="password" placeholder="Input your Password" autocomplete="off">
                    <small>Error message</small>
                </div>

                <div class="forgot_password">
                    <p>Forgotten you're Password ?</p>
                </div>

                <button class="submit" type="submit">
                    Login
                </button>

            </form>

        </div>
        <!--LOGIN SECTION ENDS HERE-->
<!------------------------------------------------------------------------------------------------------------------------------------------------->
        <!--SLIDER TO TOGGLE BTW LOGIN SECTION AND SIGN-UP SECTION-->
        <div class="slider_form">

            <div class="slider">

                <div class="slide_text user_signup">
                    <h2>
                        Don't have an account ?
                    </h2>

                    <p>
                        Sign-Up and get instant access to Envision skill & personal competency project management web-application
                    </p>
                </div>

                <div class="slide_text user_login">
                    <h2>
                        Already have an Account ?
                    </h2>

                    <p>
                        Login and get access to your projects !
                    </p>
                </div>

                <div class="slide_btn">
                    <span class="user_signup">Sign-up</span>
                    <span class="user_login">Login</span>
                </div>

            </div>
            <!--SLIDER ENDS HERE-->
<!------------------------------------------------------------------------------------------------------------------------------------------------->
            <!--SIGN-UP SECTIONS STARTS HERE-->
            <div class="form Signup">

                <form id="signup" class="signup_input" method="post" >
            
                    <h2>
                        Sign-up
                    </h2>
        
                    <div class="form_signup">
                        <span>
                            Username
                        </span>
                        <input type="text" class="input_field" id="username" name="username" placeholder="Enter Username" autocomplete="off">
                        <small>Error message</small>
                    </div>

                    <div class="form_signup">
                        <span>
                            Email Address
                        </span>
                        <input type="email" class="input_field" id="email" name="email" placeholder="Enter Email Address" autocomplete="off">
                        <small>Error message</small>
                    </div>
        
                    <div class="form_signup">
                        <span>
                            Password
                        </span>
                        <input type="password" class="input_field" id="password_1" name="password_1" placeholder="Enter Password" autocomplete="off">
                        <small>Error message</small>
                    </div>

                    <div class="form_signup">
                        <span>
                            Confrim Password
                        </span>
                        <input type="password" class="input_field" id="password_2" name="password_2" placeholder="Confirm Password" autocomplete="off">
                        <small>Error message</small>
                    </div>
                    
                    <div class="role_title">
                        <h4>Select User Type: </h4>
                    </div>
                    
                    <label class="reg_selector">
                        <select name="role">
                            <option selected value="manager">Manager</option>
                            <option value="staff">Staff</option>
                        </select>
                    </label>
        
                    <button type="submit" class="submit">
                        Sign-Up
                    </button>
        
                </form>

            </div>
            <!--SIGN-UP SECTION ENDS HERE-->
        </div>
<!------------------------------------------------------------------------------------------------------------------------------------------------->        
    </div>
    
</body> ``

Your action attribute in the login form is misplaced and is missing in signup.您在登录表单中的action属性放错了位置,并且在注册中丢失了。 It should be in the form tag.它应该在form标签中。

<!--LOGIN SECTIONS STARTS HERE-->
        <div class="form Login" >

            <form id="login" class="login_input" action="php/check_login.php" method="post">
            
                <h2>Login</h2>

                <div class="form_log">
                    <span>
                        Username
                    </span>
                    <input type="text" class="input_field" id="user_username" name="username" placeholder="Input your Username" autocomplete="off">
                    <small>Error message</small>
                </div>

                <div class="form_log">
                    <span>
                        Password
                    </span>
                    <input type="password" class="input_field" id="user_password" name="password" placeholder="Input your Password" autocomplete="off">
                    <small>Error message</small>
                </div>

                <div class="forgot_password">
                    <p>Forgotten you're Password ?</p>
                </div>

                <button class="submit" type="submit">
                    Login
                </button>

            </form>

        </div>
        <!--LOGIN SECTION ENDS HERE-->

Similarly assuming your signup script is php/signup.php the signup form will be同样假设您的注册脚本是php/signup.php注册表单将是

<!--SIGN-UP SECTIONS STARTS HERE-->
            <div class="form Signup">

                <form id="signup" class="signup_input" method="post" action="php/signup.php" >
            
                    <h2>
                        Sign-up
                    </h2>
        
                    <div class="form_signup">
                        <span>
                            Username
                        </span>
                        <input type="text" class="input_field" id="username" name="username" placeholder="Enter Username" autocomplete="off">
                        <small>Error message</small>
                    </div>

                    <div class="form_signup">
                        <span>
                            Email Address
                        </span>
                        <input type="email" class="input_field" id="email" name="email" placeholder="Enter Email Address" autocomplete="off">
                        <small>Error message</small>
                    </div>
        
                    <div class="form_signup">
                        <span>
                            Password
                        </span>
                        <input type="password" class="input_field" id="password_1" name="password_1" placeholder="Enter Password" autocomplete="off">
                        <small>Error message</small>
                    </div>

                    <div class="form_signup">
                        <span>
                            Confrim Password
                        </span>
                        <input type="password" class="input_field" id="password_2" name="password_2" placeholder="Confirm Password" autocomplete="off">
                        <small>Error message</small>
                    </div>
                    
                    <div class="role_title">
                        <h4>Select User Type: </h4>
                    </div>
                    
                    <label class="reg_selector">
                        <select name="role">
                            <option selected value="manager">Manager</option>
                            <option value="staff">Staff</option>
                        </select>
                    </label>
        
                    <button type="submit" class="submit">
                        Sign-Up
                    </button>
        
                </form>

            </div>
            <!--SIGN-UP SECTION ENDS HERE-->

In the example above the scripts to handle the signup and login will be done on two separate scripts check_login.php and signup.php .在上面的示例中,处理注册和登录的脚本将在两个单独的脚本check_login.phpsignup.php上完成。 Please change the action attribute with the actual location of the scripts responsible for managing signup and login请使用负责管理注册和登录的脚本的实际位置更改action属性

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

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM