Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/386.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/87.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/xml/12.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Firestore:Javascript:如何将用户输入转换为数组并存储在Firestore中?_Javascript_Html_Forms_Firebase_Google Cloud Firestore - Fatal编程技术网

Firestore:Javascript:如何将用户输入转换为数组并存储在Firestore中?

Firestore:Javascript:如何将用户输入转换为数组并存储在Firestore中?,javascript,html,forms,firebase,google-cloud-firestore,Javascript,Html,Forms,Firebase,Google Cloud Firestore,我的程序目前接受某一类别的单个用户输入。如果他/她认为需要另一个字段,则可以使用“添加字段”按钮。输入一个问题,我如何获取特定类别的所有这些多用户输入,并将它们转换为数组字段类型,以便将其放入Firestore?查询上述输入的正确方法是什么,以便在Firestore中查看时将其转换为数组 节目图像: <div class="form-group">

我的程序目前接受某一类别的单个用户输入。如果他/她认为需要另一个字段,则可以使用“添加字段”按钮。输入一个问题,我如何获取特定类别的所有这些多用户输入,并将它们转换为数组字段类型,以便将其放入Firestore?查询上述输入的正确方法是什么,以便在Firestore中查看时将其转换为数组

节目图像:

                                    <div class="form-group">
                                        <label>Allergy</label>
                                        <ul id="fieldList">
                                            <li>
                                                <input type="text" name="allergy" class="form-control" placeholder="Allergy" value="" id="allergy" required>
                                            </li>
                                        </ul>
                                        <button id="addMore">Add more fields</button>
                                        <script>
                                        $(function() {
                                            $("#addMore").click(function(e) {
                                                    e.preventDefault();
                                                    $("#fieldList").append("<li><input type='text' name='allergy' class='form-control' placeholder='Allergy' /></li>");
                                                });
                                            });
                                        </script>
                                    </div>
 //Register
    $('#registerForm').on('submit', async function (e) {
      e.preventDefault();
      // var date_input = new Date($("#date_input").val());
      // var day = date_input.getDay();
      // var month = date_input.getMonth() + 1;
      // var year = date_input.getFullYear();
      // var theDate = year + "-" + month + "-" + day;

      var data = {
        email: $('#email').val(), //get the email from Form
        firstName: $('#fname').val(), // get firstName
        lastName: $('#lname').val(), // get lastName
        allergies: $('#allergy').val(),
        sex: $('#sex').val(),
        birthDate: new Date($('#bday').val()),
        diabetesType: parseInt($('#dtype').val()),
        diabetesComplication: $('#dcomp').val(),
        weight: parseInt($('#weight').val()),
        height: parseInt($('#height').val()),
      };
      console.log(data);
      console.log(data.birthDate);
      var passwords = {
        password : $('#password').val(), //get the pass from Form
        cPassword : $('#cpassword').val(), //get the confirmPass from Form
      }
      if( data.email != '' && passwords.password != ''  && passwords.cPassword != '' ){
        if( passwords.password == passwords.cPassword ){
          //create the user
          await firebase.auth()
            .createUserWithEmailAndPassword(data.email, passwords.password)
            .then(function(user){
                console.log('uid',user.user.uid);
                usersRef.doc(user.user.uid).set({
                  'email': data.email, 'firstName': data.firstName, 
                  'lastName': data.lastName, 'allergies': data.allergies,
                  'sex': data.sex, 'birthDate': firebase.firestore.Timestamp.fromDate(data.birthDate),
                  'diabetesType': data.diabetesType, 'diabetesComplication': data.diabetesComplication,
                  'weight': data.weight, 'height': data.height,
             })

我希望在数据库中看到的内容示例:

                                    <div class="form-group">
                                        <label>Allergy</label>
                                        <ul id="fieldList">
                                            <li>
                                                <input type="text" name="allergy" class="form-control" placeholder="Allergy" value="" id="allergy" required>
                                            </li>
                                        </ul>
                                        <button id="addMore">Add more fields</button>
                                        <script>
                                        $(function() {
                                            $("#addMore").click(function(e) {
                                                    e.preventDefault();
                                                    $("#fieldList").append("<li><input type='text' name='allergy' class='form-control' placeholder='Allergy' /></li>");
                                                });
                                            });
                                        </script>
                                    </div>
 //Register
    $('#registerForm').on('submit', async function (e) {
      e.preventDefault();
      // var date_input = new Date($("#date_input").val());
      // var day = date_input.getDay();
      // var month = date_input.getMonth() + 1;
      // var year = date_input.getFullYear();
      // var theDate = year + "-" + month + "-" + day;

      var data = {
        email: $('#email').val(), //get the email from Form
        firstName: $('#fname').val(), // get firstName
        lastName: $('#lname').val(), // get lastName
        allergies: $('#allergy').val(),
        sex: $('#sex').val(),
        birthDate: new Date($('#bday').val()),
        diabetesType: parseInt($('#dtype').val()),
        diabetesComplication: $('#dcomp').val(),
        weight: parseInt($('#weight').val()),
        height: parseInt($('#height').val()),
      };
      console.log(data);
      console.log(data.birthDate);
      var passwords = {
        password : $('#password').val(), //get the pass from Form
        cPassword : $('#cpassword').val(), //get the confirmPass from Form
      }
      if( data.email != '' && passwords.password != ''  && passwords.cPassword != '' ){
        if( passwords.password == passwords.cPassword ){
          //create the user
          await firebase.auth()
            .createUserWithEmailAndPassword(data.email, passwords.password)
            .then(function(user){
                console.log('uid',user.user.uid);
                usersRef.doc(user.user.uid).set({
                  'email': data.email, 'firstName': data.firstName, 
                  'lastName': data.lastName, 'allergies': data.allergies,
                  'sex': data.sex, 'birthDate': firebase.firestore.Timestamp.fromDate(data.birthDate),
                  'diabetesType': data.diabetesType, 'diabetesComplication': data.diabetesComplication,
                  'weight': data.weight, 'height': data.height,
             })

请注意,此图像中的字段
allergies
已设置为数组

我的当前代码:

                                    <div class="form-group">
                                        <label>Allergy</label>
                                        <ul id="fieldList">
                                            <li>
                                                <input type="text" name="allergy" class="form-control" placeholder="Allergy" value="" id="allergy" required>
                                            </li>
                                        </ul>
                                        <button id="addMore">Add more fields</button>
                                        <script>
                                        $(function() {
                                            $("#addMore").click(function(e) {
                                                    e.preventDefault();
                                                    $("#fieldList").append("<li><input type='text' name='allergy' class='form-control' placeholder='Allergy' /></li>");
                                                });
                                            });
                                        </script>
                                    </div>
 //Register
    $('#registerForm').on('submit', async function (e) {
      e.preventDefault();
      // var date_input = new Date($("#date_input").val());
      // var day = date_input.getDay();
      // var month = date_input.getMonth() + 1;
      // var year = date_input.getFullYear();
      // var theDate = year + "-" + month + "-" + day;

      var data = {
        email: $('#email').val(), //get the email from Form
        firstName: $('#fname').val(), // get firstName
        lastName: $('#lname').val(), // get lastName
        allergies: $('#allergy').val(),
        sex: $('#sex').val(),
        birthDate: new Date($('#bday').val()),
        diabetesType: parseInt($('#dtype').val()),
        diabetesComplication: $('#dcomp').val(),
        weight: parseInt($('#weight').val()),
        height: parseInt($('#height').val()),
      };
      console.log(data);
      console.log(data.birthDate);
      var passwords = {
        password : $('#password').val(), //get the pass from Form
        cPassword : $('#cpassword').val(), //get the confirmPass from Form
      }
      if( data.email != '' && passwords.password != ''  && passwords.cPassword != '' ){
        if( passwords.password == passwords.cPassword ){
          //create the user
          await firebase.auth()
            .createUserWithEmailAndPassword(data.email, passwords.password)
            .then(function(user){
                console.log('uid',user.user.uid);
                usersRef.doc(user.user.uid).set({
                  'email': data.email, 'firstName': data.firstName, 
                  'lastName': data.lastName, 'allergies': data.allergies,
                  'sex': data.sex, 'birthDate': firebase.firestore.Timestamp.fromDate(data.birthDate),
                  'diabetesType': data.diabetesType, 'diabetesComplication': data.diabetesComplication,
                  'weight': data.weight, 'height': data.height,
             })
此代码是用户输入或表单代码:

                                    <div class="form-group">
                                        <label>Allergy</label>
                                        <ul id="fieldList">
                                            <li>
                                                <input type="text" name="allergy" class="form-control" placeholder="Allergy" value="" id="allergy" required>
                                            </li>
                                        </ul>
                                        <button id="addMore">Add more fields</button>
                                        <script>
                                        $(function() {
                                            $("#addMore").click(function(e) {
                                                    e.preventDefault();
                                                    $("#fieldList").append("<li><input type='text' name='allergy' class='form-control' placeholder='Allergy' /></li>");
                                                });
                                            });
                                        </script>
                                    </div>
 //Register
    $('#registerForm').on('submit', async function (e) {
      e.preventDefault();
      // var date_input = new Date($("#date_input").val());
      // var day = date_input.getDay();
      // var month = date_input.getMonth() + 1;
      // var year = date_input.getFullYear();
      // var theDate = year + "-" + month + "-" + day;

      var data = {
        email: $('#email').val(), //get the email from Form
        firstName: $('#fname').val(), // get firstName
        lastName: $('#lname').val(), // get lastName
        allergies: $('#allergy').val(),
        sex: $('#sex').val(),
        birthDate: new Date($('#bday').val()),
        diabetesType: parseInt($('#dtype').val()),
        diabetesComplication: $('#dcomp').val(),
        weight: parseInt($('#weight').val()),
        height: parseInt($('#height').val()),
      };
      console.log(data);
      console.log(data.birthDate);
      var passwords = {
        password : $('#password').val(), //get the pass from Form
        cPassword : $('#cpassword').val(), //get the confirmPass from Form
      }
      if( data.email != '' && passwords.password != ''  && passwords.cPassword != '' ){
        if( passwords.password == passwords.cPassword ){
          //create the user
          await firebase.auth()
            .createUserWithEmailAndPassword(data.email, passwords.password)
            .then(function(user){
                console.log('uid',user.user.uid);
                usersRef.doc(user.user.uid).set({
                  'email': data.email, 'firstName': data.firstName, 
                  'lastName': data.lastName, 'allergies': data.allergies,
                  'sex': data.sex, 'birthDate': firebase.firestore.Timestamp.fromDate(data.birthDate),
                  'diabetesType': data.diabetesType, 'diabetesComplication': data.diabetesComplication,
                  'weight': data.weight, 'height': data.height,
             })

我只想回答,如果它适用于任何人,请使用JSON序列化数组,并将其转换为firestore可以存储的数组

关于流程,以下是代码:

HTML

                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <label>Allergy</label>
                                            <table class="table table-bordered" id="dynamic_field">  
                                                    <tr>  
                                                        <td><input type="text" name="allergy" id="allergy0" placeholder="Allergy" class="form-control name_list" /></td>  
                                                        <td><button type="button" name="add" id="add" class="btn btn-success">Add More</button></td>  
                                                    </tr>  
                                            </table>  
                                            <script>

                                             var i =  {
                                                    counter : 0,
                                                    button_id : 0,
                                                }  

                                            $(document).ready(function(){  
                                                $('#add').click(function(){  
                                                    i.counter++;  
                                                    i.button_id = i.counter;
                                                    console.log(i.counter);
                                                    console.log(i.button_id);
                                                    $('#dynamic_field').append('<tr id="row'+i.counter+'"><td><input type="text" name="allergy" id="allergy'+i.counter+'" placeholder="Allergy" class="form-control name_list" /></td><td><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">X</button></td></tr>');  
                                                });  
                                                console.log(i.counter);
                                                $(document).on('click', '.btn_remove', function(){  

                                                    $('#'+"row"+i.button_id).remove();
                                                    i.button_id--;
                                                    i.counter--;  
                                                    console.log(i.button_id);
                                                    console.log(i.counter);
                                                });  
                                            });  
                                            </script>
                                        </div>
                                    </div>
                                </div>
希望这有帮助