【问题标题】:Information not pushing to FireBase Realtime Database correctly信息未正确推送到 FireBase 实时数据库
【发布时间】:2016-11-05 15:04:55
【问题描述】:

我有一个简单的表单,要求用户提出几个问题。我正在尝试连接我的 FireBase 帐户,以便在用户按下提交按钮时更新实时数据库。但是,数据库没有收到任何信息。我已附上代码。

问题出在 HTML 或 JavaScript 的某个地方。我插入了随机警报,看看它们是否会起作用,然后我让它们出现。我删除了一些“dataLink.push”命令,因为我的 FireBase 只包含 2 个值(名称、值)。我是 FireBase 的初学者。

var config = {
    apiKey: "AIzaSyCdqgGdZH8bWSMiHEM7ZoeWSNfZ04uA3Y8",
    authDomain: "errandboi-f1cf5.firebaseapp.com",
    databaseURL: "https://errandboi-f1cf5.firebaseio.com",
    storageBucket: "errandboi-f1cf5.appspot.com",
  };
  firebase.initializeApp(config);
// Creates a variable called databaseLink that links to our database.
  var databaseLink = new Firebase('https://errandboi-f1cf5.firebaseio.com/');  
  // Create javascript variables that link our previous HTML IDs.  Remember, we can't use regular HTML inside a script tag, so we need to use JQuery to reference any previous HTML.  A $ means we are using JQuery
  var messageField = $('#task');
  var nameField = $('#name');
  var contactField = $('#contact');
  var locationField = $('#location');
  var miscField = $('#misc');
  var messageList = $('#example-messages'); // DELETE MAYBE?????
  //alert(messageField);
  // If the enter key is pressed, push the values in the text boxes to our database.
  function push(){
    alert("yo");
    messageField.keypress(function (e) {
    if (e.keyCode == 13) {                            //13 is the enter key's keycode
      alert("yo");
      if (messageField.val() == ""){                  //Ensure that an activity was entered.
        alert("Please let us know how we can help!");
      }else{
        //push data to firebase and then clear the text box
        databaseLink.push({name:nameField.val(), value:messageField.val()});
        messageField.val('');
      }
    }
  }
  });//end of keypress function
<DOCTYPE! html>
<html>
<head>
<meta charset="UTF-8">
<!--THIS IS NEEDED TO IMPORT FIREBASE LIBRARIES -->
  <script src="https://cdn.firebase.com/js/client/2.2.1/firebase.js"></script>
<!-- THIS IS JUST A NICE LOOKING FONT -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<!--THIS IS NEEDED TO IMPORT JQUERY LIBRARIES -->  
  <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script>
<!-- THIS IS TO IMPORT MY JS FILE -->
<script src="index.js"></script>
<link href="style.css" rel="stylesheet" />
<title>ErrandBoi!</title>

</head>
<body>
<div id="container">
	<header>
		<h1 class="title">ErrandBoi</h1>
	</header>
	<div id="banner">
		<h2>Your Helping Hand in Every Situation</h2>
	</div>
	<div id="content">
		<p class="content">Ever have an emergency while you are in class? Life has got you all tied up but your tasks won't do themselves? Well, you are at the right place for help. Let ErrandBoi take the stress off your shoulders while you can do what really matters. Simply, fill out the form below with any* task that you may need help with and one of our drivers will help you out as soon as possible!</p>



	<br><br><br><br><br><br><br><br><br>



	<div class="form-style-5">
<form method="POST">
<fieldset>
<legend><span class="number">1</span> Your Information</legend>
<input type="text" name="field1" id="name" placeholder="Your Name *">
<input type="email" name="field2" id="contact"placeholder="Contact Information (Email, Phone Number, etc.) *">

<input type="location" name="field2" id="location" placeholder="Your Location (i.e. McNutt, Hodge Hall, exact address, etc.)*">
<input type="text" name="field3" id="misc" placeholder="Miscellaneous Information That May Be Important"></textarea>
<label for="job">Urgency:</label>
<select id="job" name="field4">
<optgroup label="Urgency level: just for us to prioritize properly">
  <option value="Not Urgent">Low (ETA: Up to an hour)</option>
  <option value="reading">Normal (ETA: Up to 45 mins)</option>
  <option value="boxing">Critical (ETA: ASAP!)</option>
</optgroup>
</select>      
</fieldset>
<fieldset>
<legend><span class="number">2</span>Task that needs completion</legend>
<input type="text" name="field3" id="task" placeholder="Let Us Know How We Can Help!*"></input>
</fieldset>
<input type="submit" value="Apply" onClick = "push()"/>
</form>
</div>
</div>
</div>

</body>
</html>

【问题讨论】:

  • 嗨,你解决了这个问题吗? :)

标签: javascript firebase firebase-realtime-database


【解决方案1】:

您正在尝试混合使用 Firebase v2 和 Firebase v3。为了使其正常工作,您应该:

1) 导入正确的 Firebase sdk(并从您的代码中删除旧的)

<script src="https://www.gstatic.com/firebasejs/3.1.0/firebase.js"></script>

2) 获取对 firebase 数据库的引用

var databaseLink = firebase.database().ref();

注意: Firebase 最近已更新,新文档位于 firebase.google.com(不是 firebase.com)

希望对你有帮助;)

【讨论】:

    猜你喜欢
    • 2021-08-28
    • 2020-01-12
    • 1970-01-01
    • 1970-01-01
    • 2021-10-07
    • 2021-08-20
    • 2023-03-20
    • 2020-03-25
    • 2018-03-13
    相关资源
    最近更新 更多