没有正确推送到FireBase实时数据库的信息

时间:2016-07-03 23:35:45

标签: javascript firebase firebase-realtime-database

我有一个简单的表格,要求用户提出几个问题。我正在尝试连接我的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>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

您正在尝试混合使用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)

希望它有所帮助;)