不能为Firebase使用“form”html标记,并且无法在没有“form”标记的情况下验证数据

时间:2018-06-13 00:50:03

标签: html5 forms firebase firebase-realtime-database

我需要帮助! - >当我使用<形式>标记,Firebase引发有关网络身份验证问题的错误。 - >当我使用没有<的页面时形式>标签,Firebase提交有效,但HTML验证标签根本不起作用!

需要一些建议

  <form>
                    <div class="container">
                        <h1 style="display: block">Sign Up</h1>
                        <p>Please fill in this form to create an account.</p>
                        <hr>

                        <label for="txt_reg_email"><b>Email</b></label>
                        <input type="email" placeholder="Email Address.." id="txt_reg_email" required>

                        <label><b>First Name</b></label>
                        <input type="text" placeholder="First Name.." id="txt_reg_firstname" required pattern="[A-Z a-z]{1,15}">

                        <label><b>Last Name</b></label>
                        <input type="text" placeholder="Last Name.." id="txt_reg_lastname" required pattern="[A-Z a-z]{1,15}">

                        <label><b>Phone</b></label>
                        <input type="phone" placeholder="Phone.." id="txt_reg_phone" required maxlength="15" minlength="10" pattern="[0-9]{10,15}"> 

                        <label><b>Mobile</b></label>
                        <input type="phone" placeholder="Mobile.." id="txt_reg_mobile" required maxlength="10" minlength="10" pattern="[0-9]{10}">

                        <label><b>Password</b></label>
                        <input type="password" placeholder="Password..." id="txt_reg_password" required pattern=".{6,}">

                        <label><b>Confirm Password</b></label>
                        <input type="password" placeholder="Confirm Password..." id="txt_reg_confirmpassword" required pattern=".{6,}">

                        <p>By creating an account you agree to our <a href="#" style="color:dodgerblue">Terms & Privacy</a>.</p>

                    </div>

                    <div class="clearfix" style="background-color:gray; padding-bottom: 10px">
                        <div class="container">
                            <button type="button" onclick="document.getElementById('div_register').style.display='none'" class="cancelbtn">Cancel</button>
                            <button onclick="if(true){fn_js_register()}" class="signupbtn">Register</button>
                        </div>
                    </div>
   </form>

编辑:(使用Firebase调用添加JS函数)

    function fn_js_register(){
  // Get data from registration form
  var txt_email = document.getElementById("txt_reg_email").value;
  var txt_password = document.getElementById("txt_reg_password").value;

  //After validation, create user and store data
  fn_createUser(txt_email,txt_password);

  //Output to test the data received from the form

}

添加最终函数调用:

// Create auth account for the user
function fn_createUser(email, password){
  var success = true;
  firebase.auth().createUserWithEmailAndPassword(email, password).then(function(){
    //Create User in the database
    uid = firebase.auth().currentUser.uid;
    firebase.database().ref('/users/'+uid+'/').set({
      uid: uid,
      firstname : document.getElementById("txt_reg_firstname").value,
      lastname: document.getElementById("txt_reg_lastname").value,
      phone: document.getElementById("txt_reg_phone").value,
      mobile: document.getElementById("txt_reg_mobile").value,
      email: document.getElementById("txt_reg_email").value

    }, function(error) {
      if (error) {
        // The write failed...
      } else {
        // Data saved successfully!
      }
    });
  })

  .catch(function(error) {
      // Handle Errors here.
      success = false;
      var errorCode = error.code;
      var errorMessage = error.message;
      window.alert("Error Code: "+errorCode+"\n"+"Error Message: "+ errorMessage);
      // ...
  });

}

0 个答案:

没有答案