保存文本并将选择下拉到Firebase

时间:2017-01-10 00:32:45

标签: javascript html firebase firebase-realtime-database

我正在尝试将在textarea中输入的文本和从下拉菜单中选择的选项存储到Firebase。我在下面链接了我的代码。正在保存上载的文件,但是,所选的文本和选项不会保存到Firebase数据库。任何帮助,将不胜感激。

以下是javascript代码:

/*jslint plusplus: true*/
 var index = 0;
var Email = sessionStorage.getItem("email");
var EmailU = Email[index];



var uploader = document.getElementById("uploader");
var fileButton = document.getElementById("fileButton");
//Listen for file selection

fileButton.addEventListener('change', function(e) {
    // Get File 
    var file = e.target.files[0];
    //Create a storage ref

    var storageRef = firebase.storage().ref(Email + file.name);
    /** folder name will be email**/
    //Upload file 

    var task = storageRef.put(file);
    //Update progress bar
    task.on('state_changed',
        function progress(snapshot) {
            var percentage = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
            uploader.value = percentage;
        },
        function complete() {
        sessionStorage.setItem(file.name);
        });
});
}


//function to gets the value from the html and stores them into an array 
function AddMed() {
'use strict';
//Create array of values from html

var database = firebase.database();

function writeUserData(userId, name, email, image) {
    firebase.database().ref('users/' + EmailU).set({
        MedName: document.getElementById("MTitle").value, // title of Med
        description: document.getElementById("Adescription").value, //descripton of Med
        Type: document.getElementById("TypeSelect").value, // Type
        //Start: document.getElementById("AStart").value, //when does it start
        //End: document.getElementById("AEnd").value //when does it end    
    });
    index++;
}

}

html代码是这样的:

 <h1><b>Medicine Schedule</b></h1>
<!---------------------------------------------- START of Form ---------------------------------------------->
<div id="form">
    <form>
        Name of Medicine <input type="text" id="MTitle" size="50" name="MedicineTitle">
        <br>
        <br> Descritption:
        <br> <textarea id="Adescription" rows="2" cols="50" name="AnnouncementDescription" placeholder="Provide a description of what the medicine is. "></textarea>
        <br>
        <br> Type: <select id="TypeSelect"> 
                <option>Pill</option>
                <option>Syrup</option>
                <option>Drop</option>
                <option>Cream</option>
                    </select>
        <br>
        <br> Start Date: <input type="date" id="AStart" placeholder="dd/mm/yyyy" name="MeetingTime">
        <br>
        <br> End Date: <input type="date" id="AEnd" placeholder="dd/mm/yyyy" name="MeetingTime">
        <br>
        <br>
    </form>
</div>
<!------------------------------------ END of Medicine Form ------------------------------------------>
<div id="progress">
    <progress value="0" max="100" id="uploader">0%</progress>
    <input type="file" value="upload" id="fileButton" />
</div>
<br>
<br>
<button type="button" class="btn btn-success btn-md" onclick="AddMed()"> Submit Medicine</button>

2 个答案:

答案 0 :(得分:0)

您没有调用函数writeUserData()。

    function AddMed() {
'use strict';
//Create array of values from html

var database = firebase.database();

function writeUserData(userId, name, email, image) {
    firebase.database().ref('users/' + EmailU).set({
        MedName: document.getElementById("MTitle").value, // title of Med
        description: document.getElementById("Adescription").value, //descripton of Med
        Type: document.getElementById("TypeSelect").value // Type
        //Start: document.getElementById("AStart").value, //when does it start
        //End: document.getElementById("AEnd").value //when does it end    
    });
    index++;
}

writeUserData();

}

答案 1 :(得分:0)

您没有在事件列表器中调用AddMed。尝试添加以下内容,看看它是否有效。

    fileButton.addEventListener('change', function(e) {
    ....your code...

    AddMed();
   }