簡體   English   中英

在同一頁面上創建注冊/登錄系統

[英]Creating Registration / Login System on same page

您好,我正在使用 PHP 和 MySQl 在同一頁面上創建登錄/注冊系統我在發布方法和操作時遇到問題,因為它在同一頁面上。 有人知道我如何解決這個問題。 下面是我的登錄和注冊/注冊系統代碼,該頁面使用 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> ``

您在登錄表單中的action屬性放錯了位置,並且在注冊中丟失了。 它應該在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-->

同樣假設您的注冊腳本是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-->

在上面的示例中,處理注冊和登錄的腳本將在兩個單獨的腳本check_login.phpsignup.php上完成。 請使用負責管理注冊和登錄的腳本的實際位置更改action屬性

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM