首页 > 解决方案 > 在提交到firebase firestore之前,如何使用javascript更改所有空值?

问题描述

我试图允许仍然能够提交到 Firebase Firestore 的未答复表单输入。问题是它返回null is not an object。.如果您没有使用过firebase,它不会让您提交null值。我想弄清楚如何将所有null值输入更改为可提交的值?

这是我正在尝试做的一个例子:

if (document.querySelector('input').value.length == 0) {
    this.value = 'No input'
  }

当前的html:

<input type="text" id="fname" name="fname" required>
<input type="text" id="lname" name="lname" required>
<input type="email" id="email" name="email" required>

<p>Radio 1</p>

<div>
  <label for="a1">Option 1</label>
  <input type="radio" id="a1" name="a" value="Value 1">
</div>

<div>
  <label for="a2">Option 2</label>
  <input type="radio" id="a2" name="a" value="Value 2">
</div>

<div>
  <label for="a3">Option 3</label>
  <input type="radio" id="a3" name="a" value="Value 3">
</div>

<div>
  <label for="b">Question 1</label>
  <textarea id="b" name="b" rows="5" placeholder="Your Response…&quot;></textarea>
</div>

<div>
  <label for="c">Question 2</label>
  <input id="c" name="c" placeholder="Your Response…&quot;>
</div>

当前的 JavaScript:

// * Feedback Form Submit
document.querySelector('#feedbackForm').on('submit', e => {

  e.preventDefault();
  e.stopPropagation();

  // Set Variables
  var name = document.querySelector('#fname').value + ' ' + document.querySelector('#lname').value;
  var email = document.querySelector('#email').value;
  var a = document.querySelector('[name="a"]:checked').value;
  var b = document.querySelector('[name="b"]').value;
  var c = document.querySelector('[name="c"]').value;
  var timestamp = Date();

  // Login
  console.log('logging in anonymously');
  auth.signInAnonymously().then(function() {

    console.log('adding data to feedback collection');
  
    db.collection("Team Forms").doc('Feedback Survey').set({
      [name]: {
        'Name': name,
        'Email': email,
        'Radio 1': a,
        'Question 1': b,
        'Question 2': c,
        'Timestamp': timestamp
      }
    });

  document.querySelector('#feedbackForm')[0].reset();

    setTimeout(function() {
      
      // Log out
      auth.signOut().then(function() {

        // Sign-out successful
    
      }).catch(function(error) {
        
        // Run errors
        var errorCode = error.code;
        var errorMessage = error.message;
        console.error('Failed to log out\.', errorCode + '\: ' + errorMessage);
    
      })
    }, 500);
  }).catch(function() {

    // Run errors
    var errorCode = error.code;
    var errorMessage = error.message;
    console.error('Failed to sign in anonymously\.', errorCode + '\: ' + errorMessage);

  })
});

标签: javascriptfirebaseformsgoogle-cloud-firestore

解决方案


在您的代码中,您this在 if 语句之后使用,这是错误所在。这是因为this指的是窗口,因为它不是一个事件。这是你的代码应该看起来有点 li



let all_inputs = document.querySelectorAll("input"); // If you have multiple forms, use ("#form1 input");
all_inputs.forEach(input => {
   if(!input.value) {
      input.value = "No value";
   }
});



此外,实现此目的的更好方法是在分配变量时更改变量,如下所示:

  var a = document.querySelector('[name="a"]:checked').value || "No val";
  var b = document.querySelector('[name="b"]').value || "No val";
  var c = document.querySelector('[name="c"]').value || "No val";

推荐阅读